Syntax highlighting breaks after an $any cast

[TrygveUrdahl]

🐞 bug report

Is this a regression?

I believe this used to work, however it does not work with versions of the Angular Language Service >=16.0.0 as far as I have tested.

Description

In an Angular template, cast an $event with $any() and then index into it (e.g. $any($event).detail.value, if you only do $any($event) it still works), and the syntax highlighting breaks from that point on in the document.

Bug Type

What does this bug affect

• [x] Angular Language Service VSCode extension
• [ ] Angular Language Service server

Reproduction

Steps to reproduce the behavior: In an Angular template, cast an $event with $any(), and the syntax highlighting breaks.

Screenshots

Not working:

Same code, just without the $any($event):

🌍 Your Environment

Angular Version:

Angular CLI: 17.0.9
Node: 20.10.0
Package Manager: yarn 4.0.2
OS: darwin arm64

Angular: 17.0.8
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1700.9
@angular-devkit/build-angular   17.0.9
@angular-devkit/core            17.0.9
@angular-devkit/schematics      17.0.9
@angular/cdk                    17.0.4
@angular/cli                    17.0.9
@schematics/angular             17.0.9
rxjs                            7.8.1
typescript                      5.2.2
zone.js                         0.14.2

Extension Version:

v17.0.3

VSCode Version:

Version: 1.85.1 (Universal)
Commit: 0ee08df0cf4527e40edc9aa28f4b5bd38bbff2b2
Date: 2023-12-13T09:48:06.308Z
Electron: 25.9.7
ElectronBuildId: 25551756
Chromium: 114.0.5735.289
Node.js: 18.15.0
V8: 11.4.183.29-electron.0
OS: Darwin arm64 23.2.0

Operating System:

MacOS Sonoma 14.2.1, Apple MacBook Pro 14" 2023, M2 Pro

[TrygveUrdahl]

This seems to have started working again. As far as I know, only the Angular monorepo has been updated (to 17.0.9), no changes to VScode or anything else.

[TrygveUrdahl]

Never mind, somehow the problem is still here. I must have seen wrong when I closed the issue. Now using version 17.1.0 of the Angular monorepo.

[inabahare]

Yeah I'm having this exact same problem and it's annoying as all hell :v

[mi-col]

Ran into this as well. As a workaround wrapping the $any cast around with another set of brackets seems to help.

[atscott]

This looks like a conflict with the Vue extension, which is capturing the terminating character of the function call and making it punctuation.attribute-shorthand.bind.html.vue. If you are using Vue for syntax highlighting as well, this can be resolved by disabling the Vue extension. Closing, as this is unrelated to the Angular extension.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}