vscode: Wrong color of console.log token
Version: 1.48.0 Commit: db40434f562994116e5b21c24015a2e40b2504e6 Date: 2020-08-13T08:03:27.059Z Electron: 7.3.2 Chrome: 78.0.3904.130 Node.js: 12.8.1 V8: 7.8.279.23-electron.0 OS: Darwin x64 19.5.0
Steps to Reproduce:
this is a follow up of #91818
this was working fine before I updated to v1.48
editor.semanticHighlighting
is disabled
I’m using the theme
Before the update the console was yellow
Changing the tokenColorCustomizations
to this doesn’t do anything
"textMateRules": [
{
"scope": ["meta.function-call"],
"settings": {
"foreground": "#FFCB6B"
}
}
]
Does this issue occur when all extensions are disabled?: Yes/No Yes
About this issue
- Original URL
- State: closed
- Created 4 years ago
- Reactions: 6
- Comments: 21 (5 by maintainers)
Thanks for the explanation.
The previous coloring was incorrect and was coming from the
support.class
rule (console
is not a class). We fixed this for #101802. I don’t plan on reverting this fix as it makes the grammar more consistent. I understand it’s been this way for a while and you have gotten used to specific colors but the new behavior better for the grammar long termIf you want proper distinct colorization for
console
, please file a feature request against typescript so that semantic coloring can identify calls toconsole
Same for me. Console logs are hardly distinguishable now.
I got same problem with
Palenight Theme
after update to version 1.48,console
entries now became poorly visible among other code, console word was yellow previouslyWhy we need to make a issue for typescript, if the problem concerns not it?
The problem is that you have taken away from us the ability to specify the color for a specific token. And this token is quite global, and if you lose sight of it in the code, then there may be problems in the code on production servers, so data leakage may occur due to a banal oversight. Yes, you can set the linter (e.g. eslint) on the console, but it shouldn’t be a solution to a simple line in the editor’s visual theme. If you care about grammar, the console is an object (at least in JavaScript).
Add a token
support.objects.console.XXX
, and everyone will be happy. Instead of the first keysupport
you can add any other words you want.Just add a token, that’s all we ask, why complicate…
P.S. I love VS Code, i think it’s best code editor in world. And i make theme for him, and the code becomes clearer and more readable with it, but from now I lose the ability to customize my theme and it’s sad. P.S.S. Sorry about my English.
enabling
semanticTokenColorCustomizations
also changes a bunch of other stuff that I don’t really want. I don’t think that’s a viable solutionFinally found a workaround for this issue.
you have to enable semanticHighlighting and then add a property that will change the color manually
create a folder called .vscode create a file called settings.json add the following code:
hope this helps peeps in distress 😝
Before:
Now:

Before the patch the console would be highlighted as any other native function or reserved word, like
const
orrequire
. Now it gets highlighted as a regular object / variable.Can you please explain why the color is wrong?
@mjbvz
That’s not correct. As I posted here, the context was coming from
support.variable.object.node
.Last I checked,
console
was still a support variable in Node.JS.As an alternative to setting this in each folder’s .vscode subfolder you can do it at the user level. One way is to run the
Preferences: Open Settings (JSON)
command.@bantingGamer good tip. Looks like the
variable.defaultLibrary
semantic token arrived in #91090 and @aeschli made the TS/JS semantic colorer assign it in https://github.com/aeschli/typescript-vscode-sh-plugin/commit/8582a31baecfd2bfa609279a13558c20a4d1508e