This commit updates the TypeScript configuration across the project to use `moduleResolution: "bundler"`. This modernizes our module resolution strategy to align with current TypeScript best practices and bundler behaviors.
The following changes are included:
- Updated `tsconfig.json` files to set `moduleResolution` to `"bundler"`.
- Updated the `rules_angular` bazel dependency to a version compatible with these changes.
- Adjusted related test files and golden files to reflect the new module resolution strategy.
PR Close#64125
Type checking of host bindings was added in v20. We're now confident enough in it to enable it by default.
BREAKING CHANGE:
* Previously hidden type issues in host bindings may show up in your builds. Either resolve the type issues or set `"typeCheckHostBindings": false` in the `angularCompilerOptions` section of your tsconfig.
PR Close#63654
In the context of TypeScript (TS), a re-exported symbol is considered a distinct symbol.
This means that a developer can choose to import either the re-exported symbol or
the original symbol. However, in the context of Angular, the re-exported symbol
is treated as the same component because it uses the same selector.
This pull request will utilize the most recent re-export component file to
resolve the module specifier.
PR Close#62585
Deprecated diagnostics can appear on the context guard becaues the
directive itself may be deprecated.
For example, context guards look like `if (i1.NgForOf.ngTemplateContextGuard(_t8, _t9) /*331,378*/) {...}`
and typescript will report the deprecation on the whole element, from
start to end tag, because the span for that node includes it.
fixes https://github.com/angular/vscode-ng-language-service/issues/2203
PR Close#63054
using the `getSymbol` instead of the `type.symbol`, for the primitive type,
the `type.symbol` returns the `undefined` value. The return type of `getSymbol`
includes `undefined`, while `type.symbol` does not.
For example:
```ts
class BarComponent {
/**
* @deprecated
*/
name = ""
}
```
The type of `name` is `string`, the `type.symbol` for the `string`
returns `undefined` here.
e3ef7ff50d/src/services/types.ts (L111)e3ef7ff50d/src/compiler/types.ts (L6445)
PR Close#63002
In the Typescript Language Service, these diagnostics are reported as suggestion diagnostics.
This will report the deprecated `Component`, `Directive`, etc.
Fixes https://github.com/angular/angular/issues/59343
PR Close#62054
Currently when there's a parser error in interpolated text, the compiler reports an error on the entire text node. This can be really noisy in long strings.
These changes switch to reporting the errors on the specific expressions that caused them.
PR Close#62258
Adds support for `getEncodedSemanticClassifications` to the language service.
The service now classifies components in a template as the `class` type.
PR Close#60260
When providing the code action for the directive that is exported by multiple modules
in different files, the directive must save all the TS completion entry data
for every module to compute the module specifier.
When providing a completion item, because the LS only supports displaying one directive
at a time, the first one will be picked.
PR Close#62100
Support to add the missing required inputs into the element and append
after the last attribute of the element.
But it skips the structural directive shorthand attribute. For example,
`<a *ngFor=""></a>`, its shorthand is `<ng-template ngFor>`, the `valueSpan`
of the `ngFor` is empty, and the info is lost, so it can't use to insert
the missing attribute after it.
PR Close#50911
This works for the code actions and completion. When the ls wants to complete
all importable angular metadata in the template, the ls will invoke the function
`ls.getCompletionsAtPosition` and filter the item about the angular. When the
developer selects an item, the ls will get the module specifier from the code action
return by the `ls.getCompletionEntryDetails`.
PR Close#61122
Follow-up to #61240 that adds renaming support for selectorless components/directives both from the template and from the TypeScript source.
PR Close#61307
As part of the Bazel toolchain migration we noticed that implicit types
generated by the TypeScript compiler sometimes end up referencing types
from other packages (i.e. cross-package imports).
These imports currently work just because the Bazel `ts_library` and
`ng_module` rules automatically inserted a `<amd-module
name="@angular/x" />` into `.d.ts` of packages. This helped TS figure
out how to import a given file. Notably this is custom logic that is not
occuring in vanilla TS or Angular compilations—so we will drop this
magic as part of the toolchain cleanup!
To improve code quality and keep the existing behavior working, we are
doing the following:
- adding a lint rule that reduces the risk of such imports breaking. The
failure scenario without the rule is that API goldens show unexpected
diffs, and types might be duplicated in a different package!
- keeping the `<amd-module` headers, but we manually insert them into
the package entry-points. This should ensure we don't regress
anywhere; while we also improved general safety around this above.
Long-term, isolated declarations or a lint rule from eslint-typescript
can make this even more robust.
PR Close#61312
Adds an initial implementation for finding references and renaming to selectorless components/directives.
Finding references should work everywhere, whereas renaming only currently works when initiated from the template.
PR Close#61240
Adds the logic to resolve the template targets for the selectorless component and directive nodes. This is a prerequisite for other functionality.
PR Close#61240
This commit adds the support for the `in` keyword as a relational operator, with the same precedence as the other relational operators (<,>, <=, >=)
BREAKING CHANGE: 'in' in an expression now refers to the operator
PR Close#58432
When we switch to relative imports, shared `.d.ts` chunks can be
generated.
We need to also pull these into our mock virtual FS testing
environments. Notably this does not cause a test slow-down because we
are talking about very few extra `.d.ts` chunk files. In our experiments
before, with no dts bundling, we saw test time increase from e.g.
20seconds to 100seconds. The 20s are still the same locally!
In addition, since code for definitions can now reside in shared `.d.ts`
chunks, the language service tests need to be adjusted in cases where
they assert for code definition locations in `@angular/core`. A new
helper prepares for more code to be moved into arbitrary `.d.ts` files;
we should simply assert the definition comes out of
`node_modules/@angular/core`.
PR Close#60487
Reworks the language service to enable features like quick info and definitions inside host bindings.
**Note:** for the full range of language service features to work, the changes from https://github.com/angular/vscode-ng-language-service/pull/2155 have to be released.
PR Close#60433
Instead of relying on Microsoft's API extractor for `d.ts` bundling,
we are switching to Rollup-based `.d.ts` bundling.
This allows us to support code spliting, even for `.d.ts` files,
allowing for relative imports to be used between entry-points, without
ending up duplicating `.d.ts` definitions in two files. This would otherwise cause
problems with assignability of types.
It also nicely integrates into our existing rollup configuration, and
overall simplifies the `ng_package` rule even further!
Notably `tsup` also uses this rollup plugin, and it seems to work well.
Keep in mind that Microsoft's API extractor is pretty hard to integrate,
caused many problems in the past, and isn't capable of code splitting.
This aligns our d.ts bundling with the .mjs bundling (great alignment).
PR Close#60321
Prior to this commit, the tags from the type definition were dropped.
Tags may include, but are not limited to, deprecation information from
the jsdoc.
PR Close#59524
Add support for the `void` operator in templates and host bindings.
This is useful when binding a listener that may return `false` and
unintentionally prevent the default event behavior.
Ex:
```
@Directive({
host: { '(mousedown)': 'void handleMousedown()' }
})
```
BREAKING CHANGE: `void` in an expression now refers to the operator
Previously an expression in the template like `{{void}}` referred to a
property on the component class. After this change it now refers to the
`void` operator, which would make the above example invalid. If you have
existing expressions that need to refer to a property named `void`,
change the expression to use `this.void` instead: `{{this.void}}`.
PR Close#59894
In the past two-way bindings used to be interpreted as `foo = $event` at the parser level. In #54065 it was changed to preserve the actual expression, because it was problematic for supporting two-way binding to signals. This unintentionally ended up causing the TCB to two-way bindings to look something like `someOutput.subscribe($event => expr);` which does nothing. It largely hasn't been a problem, because the input side of two-way bindings was still being checked, except for the case where the input side of the two-way binding has a wider type than the output side.
These changes re-add type checking for the output side by generating the following TCB instead:
```
someOutput.subscribe($event => {
var _t1 = unwrapSignalValue(this.someField);
_t1 = $event;
});
```
PR Close#59002
Fixes that `getCodeActions` wasn't implemented for the unused imports fixer which meant that it wouldn't show up in the most common cases.
PR Close#58719
