Object keys are now red instead of intended yellow on Monokai about babel-sublime HOT 2 CLOSED

I dug into this, and the Monokai rule is:

{
    "name": "Tag name",
    "scope": "entity.name.tag | meta.mapping.key string.unquoted",
    "foreground": "var(red2)"
},

So the current version of Monokai is deliberately targeting things like JS object keys and highlighting them red. I checked the last ST3 release and the rule is different:

{
    "name": "Tag name",
    "scope": "entity.name.tag",
    "foreground": "var(red2)"
},

So this is a deliberate change in the core Monokai syntax, not a regression in babel-sublime. Granted, it is a visible change in behavior for babel-sublime/Monokai users.

It would be possible to restore the yellow color by removing the meta.mapping.key scope. This would have to be done by modifying JS Custom's string_object_keys extension. From the look of it, it would be a fairly intrusive change because the meta.mapping.key scope is applied at a higher level.

On the other hand, there's an easy workaround: if you use Monokai, and you prefer the old highlighting, then you can customize Monokai with an added rule:

{
    "name": "JS object bare key",
    "scope": "meta.mapping.key string.unquoted.js",
    "foreground": "var(yellow)"
},

The babel-sublime v10 rewrite went out of its way to preserve the original highlighting of bare keys a) to make the v9–v10 transition more seamless for users, b) to reduce the number of highlighting changes to make regressions more visible, and c) because the string.unquoted scope is arguably more correct than the core syntax's scoping. The string_object_keys extension is small and unintrusive, so it wasn't a big deal to add.

On the other hand, this change a) is due to a change in Monokai and is not a regression in babel-sublime, b) would have happened in v9 anyway, c) would be fairly intrusive to change, and d) might make highlighting worse in non-Monokai color schemes. In addition, Sublime Text 4 makes it easy to tweak color schemes and even offers a built-in command for doing so (“UI: Customize Color Scheme”).

Therefore, I'm not inclined to change babel-sublime to restore the yellow highlighting under Monokai, and at some point I should update the example images in the readme to reflect the current version of Monokai. But I'm available if anyone needs help tweaking their color scheme.

from babel-sublime.

Thanks for looking into this @Thom1729!

For the reference of anyone else that decides to use the workaround, here are the steps I followed:

1. Create the file ~/Library/Application Support/Sublime Text/Packages/User/Monokai.sublime-color-scheme
2. Add the following contents:

{
  "rules": [
    {
      "foreground": "var(yellow)",
      "name": "JS object bare key",
      "scope": "meta.mapping.key string.unquoted.js"
    }
  ]
}

from babel-sublime.