Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Occurrences highlighting on template string literals selects entire stringΒ #62444

@jreidgreer

Description

@jreidgreer

πŸ”Ž Search Terms

"occurrences highlighting", "angular"

πŸ•— Version & Regression Information

⏯ Playground Link

No response

πŸ’» Code

You can see this with the basic Angular demo:

import {Component} from '@angular/core';
import {FormsModule} from '@angular/forms';
import {bootstrapApplication} from '@angular/platform-browser';

@Component({
  selector: 'app-root',
  template: `
    <label for="name">Name:</label>
    <input type="text" id="name" [(ngModel)]="name" placeholder="Enter a name here" />
    <hr />
    <h1>Hello {{ name }}!</h1>
  `,
  imports: [FormsModule],
})
export class Demo {
  name = '';
}

bootstrapApplication(Demo);
Image

πŸ™ Actual behavior

When you click on the template (with or without Angular Language Service being enabled), despite it being a multi-line template literal (marked as html by ALS if enabled), the occurrences highlighting causes the entire string to be highlighted.

πŸ™‚ Expected behavior

The string would not be highlighted entirely, and occurrences highlighting would work as expected for other languages embedded in template literal strings.

You can fix this by disabling Editor: Occurrences Highlight in the settings, but then you miss out on occurrences highlighting.

Additional information about the issue

I believe at one point this was fixed in #46531

But as is pointed out in an issue on the Angular repo, it seems like the test covering this case has been changed: angular/vscode-ng-language-service#2078 (comment)

Metadata

Metadata

Assignees

No one assigned

    Labels

    BugA bug in TypeScriptHelp WantedYou can do this

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions