Repository navigation
Improve syntax highlighting for string interpolation #3318
Description
Further to issue 305, currently, if additional string interpolation is used inside the expression, then only the inner most expression is highlighted, for example with "${(() => '1')()}" the entire expression is highlighted but if you add a nested string interpolation like "${(() => '1 ${2}')()}";, now only the 2 is highlighted. Instead all expressions should be highlighted.
Also, expression code should be highlighted in the same way as normal code. For example, currently with "${String.fromCharCode(36)}" the expression will be highlighted with a single colour. Instead the expression should be highlighted in the same way as String.fromCharCode(36), which uses different colours for the class, method, and integer.
It might also be more clear to highlight the $ and {}.
Activity
[-]Improve syntax highlighting nested string interpolation[/-][+]Improve syntax highlighting for string interpolation[/+]DanTup commentedon May 20, 2021
This appears to be caused by the underlying textmate grammar, as if I disable that things look consistent:
With the grammar also enabled, we get:
Fixing this may be tricky - if we remove strings entirely from the textmate grammar then they won't be coloured for the period between opening a file and getting semantic tokens, but otherwise semantic tokens don't seem to have a have a way to block the interpolated parts fro inheriting the string colouring.
DanTup commentedon May 20, 2021
I have a fix - though it requires changes in both the SDK and Dart-Code. The SDK changes are at https://dart-review.googlesource.com/c/sdk/+/200863/ which give us tokens for the interpolating parts of a string (that aren't already getting additional colouring) and the change here uses those tokens to reset the colouring (so it doesn't inherit the string colouring from the textmate grammar).
So you'll need both an updated Dart-Code and updated Dart/Flutter SDK before you see the fix so unless you're using a dev/master SDK you might not see the fix immediately with the next Dart-Code release. With the fixes, things look like this:
[analyzer] Add semantic token type/modifier for interpolated expressions