Typescript syntax highlighting breaks after `Generic<typeof x>`

[connor4312]

Happens on TS 4.1.2 as well as their nightly 4.2.0-dev.20201211. However it doesn't happen in the TS playground, which is why I'm opening an issue here (initially)

1. Have code like:

function foo(): number { return 42; }
let bar: ReturnType<typeof foo>;
bar = 1;
foo();
new Uint8Array();

2. Notice highlighting breaks after the let statement:

   

Playground is okay: https://www.typescriptlang.org/play?#code/GYVwdgxgLglg9mABMOcAUBKAXIsIC2ARgKYBOiA3oqcVCKUgCwBMA3IgL4BQANrYoQCGpHACVa9MABUAngAdiAHijzicYMlQA+VlyHkAvIgCMulOgy6wxAO6IAqjDBQAHAEFSpQTMysgA

[mjbvz]

Works for me:

What language mode are you in?

[connor4312]

This is in a TypeScript file, .e.g something in the vscode repo. Using the latest Insiders.

Tokens/scopes of the variable on the following line:

Versus elsewhere:

[mjbvz]

Hm, can you share the complete code sample. I'm still not seeing this issue:

[denis-sokolov]

I have the same issue, here are my details:

• VSCode Version: 1.53.0-insider (d8a7c31aba3a)
• OS Version: Windows_NT x64 10.0.19042

Steps to Reproduce:

1. Create a file foo.ts with the following contents:

type A = typeof a;
const a = {};

type B = Partial<{}>;
const b = {};

type Z = Partial<typeof z>;
const z = {};

2. Depending on your color scheme, observe the “const”, “=” and “;” on the last row (z) be colored differently than the same parts on previous rows (a and b). Specifically, the tokenization of pieces on the last row is different:
   • “const” has textmate scopes “entity.name.type.ts, meta.type.parameters.ts, meta.type.declaration.ts, source.ts” on row z instead of “storage.type.ts, meta.var.expr.ts, source.ts”, as on rows a and b;
   • “=” has textmate scopes “meta.type.parameters.ts, meta.type.declaration.ts, source.ts” on row z instead of “meta.var.expr.ts, source.ts” as on rows a and b;

This only happens specifically after a combination of a generic type (X) and a typeof operator in a type position. This has only started very recently (at most a few days ago).

Does this issue occur when all extensions are disabled?: Yes

[maximseshuk]

I have the same issue, here are my details:

VSCode Version: 1.53.0-insider (user-setup)
OS Version: Windows_NT x64 10.0.18363

[connor4312]

Here's another code sample where it happens: https://github.com/connor4312/cosmonaut/blob/f825e62d99049dbc66304eaa613fd5282378f1f4/src/model.ts#L100-L105

A bisect reports that this isn't a user extension

Although it's not as bad with the default dark theme, you can still see that things are colored incorrectly

[tamasfe]

It doesn't have to be in generic argument position, this is broken for me as well:

function getLog(): typeof log {
  log.heading = "lerna-watcher";
  return log;
}

ending the typeof expression with any of [=,;,,,},)] will not mess up the scopes afterwards.

Version: 1.53.0-insider
Commit: 4a875e23d20b64504a818834f3fa4c40adb8d480
Date: 2020-12-21T12:39:40.504Z
Electron: 11.1.0
Chrome: 87.0.4280.88
Node.js: 12.18.3
V8: 8.7.220.29-electron.0
OS: Linux x64 5.9.14-100.fc32.x86_64

[andreialecu]

Also reported at:
microsoft/vscode#113657
microsoft/vscode#113345

[pacexy]

Same for me.
Seems that typeof is parsed as a HTML tag (Syntax highlighting works if wrap typeof x with parentheses, Generic<(typeof x)>).