Skip to content

feat(language-service): add Angular-specific Inlay Hints (LSP 3.17)#66755

Open
kbrilla wants to merge 4 commits intoangular:mainfrom
kbrilla:feat/inlay-hints
Open

feat(language-service): add Angular-specific Inlay Hints (LSP 3.17)#66755
kbrilla wants to merge 4 commits intoangular:mainfrom
kbrilla:feat/inlay-hints

Conversation

@kbrilla
Copy link
Contributor

@kbrilla kbrilla commented Jan 26, 2026

PR Checklist

  • The commit message follows our guidelines
  • Tests for the changes have been added
  • Docs have been added / updated

PR Type

  • Feature
  • Refactoring (small infrastructure extraction to simplify review)

What is the current behavior?

Issue Number: #66730

What is the new behavior?

This PR adds Angular-specific template inlay hints end-to-end across the language service and VS Code extension.

It also includes a small server-side workspace configuration helper refactor so inlay hint settings can be pulled and refreshed cleanly.

Highlights:

  • Angular template inlay hints for variables, bindings, events, pipes, and control flow.
  • LSP textDocument/inlayHint and inlayHint/resolve support in the extension server.
  • Angular inlay hint settings in the VS Code extension with runtime refresh behavior.
  • Request guards to avoid Angular inlay hint requests on unsupported TypeScript regions.
  • Unit and integration regression coverage.

Does this PR introduce a breaking change?

  • Yes
  • No

Other information

  • This PR no longer has an external dependency on a separate workspace-configuration PR.

Screenshots

image image image image

@pullapprove pullapprove bot requested a review from devversion January 26, 2026 16:18
@angular-robot angular-robot bot added detected: feature PR contains a feature commit area: language-service Issues related to Angular's VS Code language service labels Jan 26, 2026
@ngbot ngbot bot added this to the Backlog milestone Jan 26, 2026
@kbrilla kbrilla marked this pull request as draft January 26, 2026 16:59
Comment on lines 234 to 239
const tsHints = languageService.provideInlayHints(scriptInfo.fileName, span, tsPreferences);

for (const tsHint of tsHints) {
const position = scriptInfo.positionToLineOffset(tsHint.position);
hints.push(convertTsInlayHint(tsHint, position));
}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

From my testing, this should be omitted. Typescript provides its own inlay hints and we should not duplicate them.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I removed TS inlay hints from Angular response

"default": true,
"markdownDescription": "When enabled, the Angular Language Service will delegate file watching to VS Code instead of creating its own internal file watchers. This can significantly improve performance (greater than 10x faster initialization) and reduce resource usage in large repositories."
},
"angular.inlayHints.forLoopVariableTypes": {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think all of these should be defaulted to their "off" equivalents

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done. I switched Angular inlay hint options to off by default. I also cleaned up config handling so toggles apply live without requiring extension restart.

"default": true,
"markdownDescription": "When enabled, the Angular Language Service will delegate file watching to VS Code instead of creating its own internal file watchers. This can significantly improve performance (greater than 10x faster initialization) and reduce resource usage in large repositories."
},
"angular.inlayHints.forLoopVariableTypes": {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Now that we have so many options, we could benefit from better grouping like typescript has

Image

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added Inlay Hints subcategory, and grouped existing settings into Preferences subcategory. Should we split it even more? Suggestions, Diagnostics?
image

@devversion devversion removed their request for review February 11, 2026 17:29
@atscott
Copy link
Contributor

atscott commented Feb 18, 2026

@kbrilla Do you plan on continuing work on this PR?

@kbrilla
Copy link
Contributor Author

kbrilla commented Feb 20, 2026

, I was not able to look into it today, but will continue tomorrow

@angular-robot angular-robot bot added area: docs Related to the documentation area: vscode-extension Issues related to the Angular Language Service VsCode extension labels Feb 21, 2026
@kbrilla kbrilla force-pushed the feat/inlay-hints branch 3 times, most recently from c1e6168 to abefeba Compare February 23, 2026 10:52
@kbrilla kbrilla marked this pull request as ready for review February 23, 2026 11:15
@kbrilla kbrilla requested a review from atscott February 23, 2026 11:15
@kbrilla
Copy link
Contributor Author

kbrilla commented Feb 23, 2026

Updated PR description and added screenshots

@kbrilla kbrilla force-pushed the feat/inlay-hints branch 6 times, most recently from 3129013 to a088340 Compare February 24, 2026 12:40
…ettings grouping

Add shared workspace configuration helper utilities and move extension settings to grouped configuration sections, without inlay-hint feature options yet.
Add Angular template inlay hints end-to-end across language-service and VS Code extension server/client wiring, including inlay-specific configuration mapping, request guards, and refresh behavior.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area: docs Related to the documentation area: language-service Issues related to Angular's VS Code language service area: vscode-extension Issues related to the Angular Language Service VsCode extension detected: feature PR contains a feature commit

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants