Terminal doesn't take editor background color into account
See original GitHub issueForked off case from @sagebind in https://github.com/microsoft/vscode/issues/128295#issuecomment-952194513
I can consistently reproduce this today specifically with terminals in the editor area (similar to https://github.com/microsoft/vscode/issues/127156) as I experience it every day for the past few months. Here’s full reproduction steps:
- Install a fresh copy of VS Code Insiders (no extensions or customizations). At time of writing I reproduced this with commit
dc1a6699060423b8c4d2ced736ad70195378fddf
. - Install a theme with a different background color for panel terminal and editor. In this case, https://marketplace.visualstudio.com/items?itemName=swashata.beautiful-ui. Note that this is a theme pack, but can be reproduced with most themes in this pack. The theme shown below is
βui - One Dark
. - Create a new terminal in the editor area.
- Ensure that GPU acceleration is
on
(terminal.integrated.gpuAcceleration
). - Observe the background color discrepancy:
![Screen Shot 2021-10-26 at 1 12 41 PM](https://user-images.githubusercontent.com/2192863/138936792-eb218e00-b495-4f68-a382-1a118c37e343.png)
Using the developer tools, you can see that while .editor-container
has an inline style of background-color: rgb(38, 42, 49);
, the inner element .xterm-viewport
has the inline style of background-color: rgb(24, 26, 30);
, which does not match the editor area.
![Screen Shot 2021-10-26 at 1 16 14 PM](https://user-images.githubusercontent.com/2192863/138937295-679bb7ab-74f8-4291-b7ac-6466de5b4fc5.png)
Somehow the setting terminal.integrated.gpuAcceleration
is actually involved here, because when changed to off
, suddenly everything looks correct:
![Screen Shot 2021-10-26 at 1 18 14 PM](https://user-images.githubusercontent.com/2192863/138937580-ebcd8d17-60f9-4bb1-bcf7-2a7f18cf7286.png)
Though the background color of the inner element .xterm-viewport
is still the wrong value, it seems to no longer have an impact. I am presuming this is still a VS Code bug, but I suppose that somehow this could be an issue with the theme itself though I’m not sure how.
This test was done on macOS 11.6.
Issue Analytics
- State:
- Created 2 years ago
- Comments:10 (5 by maintainers)
Same here on apple silicon (MBP 2020 m2).
fixed problem, but for sure it’s not best solution 😦
So basically, the only reason that setting
terminal.background
“fixes” the problem is because it causes the terminal to useterminal.background
as the background color instead ofeditor.background
, and causes it to actually become the same aseditorPane.background
via alpha transparency. But if the terminal defaults toeditor.background
in a terminal editor, I would expect the margin around the terminal to also beeditor.background
, noteditorPane.background
.I think enabling Zen Mode helps visually show why the current behavior is wrong:
(Of course, in all places where
editor.background
is being used here, I’d expect it to probably useterminal.background
instead if set.)It seems like at the very least, the bug starts here:
https://github.com/microsoft/vscode/blob/dec7735080b74f3d8eba8d0bcb0a1c0d96f96c1f/src/vs/workbench/contrib/terminal/browser/media/terminal.css#L63-L65
In light of https://github.com/microsoft/vscode/issues/127156 I’d expect this to be