Template literal changes syntax highlighting colour of nearby generic

[craig-pyrra]

Issue Type: Bug

Using Typescript:

func<string[]>(`hello`)
func<string[]>`hello`

On the second line the colour of <string[]> (specifically the < [ ] > characters) changes to the colour used for template literals. I don't think it should change like that?

I am using the Dark+ theme.

VS Code version: Code 1.67.2 (Universal) (c3511e6c69bb39013c4a4b7b9566ec1ca73fc4d5, 2022-05-17T18:20:57.384Z) OS version: Darwin arm64 21.4.0 Restricted Mode: No

System Info

|Item|Value| |---|---| |CPUs|Apple M1 Pro (10 x 24)| |GPU Status|2d_canvas: enabled
canvas_oop_rasterization: disabled_off
direct_rendering_display_compositor: disabled_off_ok
gpu_compositing: enabled
metal: disabled_off
multiple_raster_threads: enabled_on
oop_rasterization: enabled
opengl: enabled_on
rasterization: enabled
raw_draw: disabled_off_ok
skia_renderer: enabled_on
video_decode: enabled
video_encode: enabled
webgl: enabled
webgl2: enabled| |Load (avg)|5, 4, 4| |Memory (System)|16.00GB (1.29GB free)| |Process Argv|--crash-reporter-id 4b2c2ae4-0c9d-453b-8f4d-61202d2bf14d| |Screen Reader|no| |VM|0%|

Extensions (16)

Extension|Author (truncated)|Version ---|---|--- vscode-openapi|42C|4.9.5 vscode-eslint|dba|2.2.2 gitlens|eam|12.1.0 prettier-vscode|esb|9.5.0 rest-client|hum|0.24.6 vscode-docker|ms-|1.22.0 python|ms-|2022.8.0 vscode-pylance|ms-|2022.6.10 jupyter|ms-|2022.4.1021342353 jupyter-keymap|ms-|1.0.0 jupyter-renderers|ms-|1.0.8 remote-containers|ms-|0.238.2 prisma|Pri|3.15.0 vscode-yaml|red|1.8.0 vscode-status-bar-format-toggle|tom|3.0.0 vim|vsc|1.22.2

A/B Experiments

``` vsliv368:30146709 vsreu685:30147344 python383cf:30185419 vspor879:30202332 vspor708:30202333 vspor363:30204092 pythonvspyl392:30443607 pythontb:30283811 pythonptprofiler:30281270 vshan820:30294714 vstes263cf:30335440 pythondataviewer:30285071 vscod805:30301674 binariesv615:30325510 bridge0708:30335490 bridge0723:30353136 vsaa593:30376534 vsc1dst:30438360 pythonvs932:30410667 wslgetstarted:30449410 vscscmwlcmt:30465135 cppdebug:30492333 vsclangdc:30486549 ```

[VSCodeTriageBot]

Thanks for creating this issue! It looks like you may be using an old version of VS Code, the latest stable release is 1.68.1. Please try upgrading to the latest version and checking whether this issue remains.

Happy Coding!

[craig-pyrra]

I upgraded to the latest VSCode and also tested the current Insiders build. This issue occurs in both.

[OpportunityLiu]

When the type parameter is an object definition of multiple lines, it affects lines after it.

func<{
    token: string
}>`hello`;

const x = 1;
const y = 2;

[sheetalkamat]

The scoping is working as intended. theme needs to handle those correctly @mjbvz for looking into this.

func`hello`
 ^^^^
 source.ts string.template.ts entity.name.function.tagged-template.ts
     ^
     source.ts string.template.ts punctuation.definition.string.template.begin.ts
      ^^^^^
      source.ts string.template.ts
           ^
           source.ts string.template.ts punctuation.definition.string.template.end.ts

And

>func<string[]>`hello`
 ^^^^
 source.ts string.template.ts entity.name.function.tagged-template.ts
     ^
     source.ts string.template.ts meta.type.parameters.ts punctuation.definition.typeparameters.begin.ts
      ^^^^^^
      source.ts string.template.ts meta.type.parameters.ts support.type.primitive.ts
            ^
            source.ts string.template.ts meta.type.parameters.ts meta.type.tuple.ts meta.brace.square.ts
             ^
             source.ts string.template.ts meta.type.parameters.ts meta.type.tuple.ts meta.brace.square.ts
              ^
              source.ts string.template.ts meta.type.parameters.ts punctuation.definition.typeparameters.end.ts
               ^
               source.ts string.template.ts punctuation.definition.string.template.begin.ts
                ^^^^^
                source.ts string.template.ts
                     ^
                     source.ts string.template.ts punctuation.definition.string.template.end.ts

[mjbvz]

It feels a little strange that the entire span func<string[]>`hello` is marked as a string. Could that span have a different id, while just the string itself is marked as string?

We have to work around this issue in VS Code to enable suggestions for the template function name: https://github.com/microsoft/vscode/blob/990a496681948ec274da5503b35cd49a7d06c0a2/extensions/typescript-basics/package.json#L80