Fixes the visibility of the copy link button in API documentation headings.
The button now appears on hover, improving the user experience.
(cherry picked from commit 15e3407dab)
Add aria-hidden="true" to decorative icon elements in the ARIA menu documentation
example to prevent screen readers from announcing both icon names and labels.
This improves the accessibility experience by ensuring only meaningful text
is announced to screen reader users.
Fixes: #65768
(cherry picked from commit 1c6049584e)
Replaces custom docs-code blocks with fenced Markdown code blocks and reformats examples to improve readability, consistency, and copy-paste behavior.
(cherry picked from commit d0a34a6ca5)
The triple backtick code block parser now extracts the linenums attribute
from metadata and applies it to enable line number display in code examples
(cherry picked from commit 1f29577077)
We recently allowed users to have a dynamic input `type` with signal forms, but the logic that infers the value type falls back to `string` even though in theory it can be any of the other types.
These changes expand the inferred type to `string | number | boolean | Date | null` if we detect a dynamic `type` binding.
(cherry picked from commit 8a3f3a91cf)
Wrap operationsCounter method calls (recordCreate, recordDestroy, reset)
with ngDevMode guards to ensure they are tree-shaken in production builds.
This aligns with the existing pattern where operationsCounter is only
initialized in development mode, and eliminates unnecessary method call
overhead in production.
The optional chaining (?.) is retained as TypeScript doesn't narrow types
based on ngDevMode checks, but the entire expression will be removed during
production builds.
(cherry picked from commit 80dbd74ae8)
Ideally this tutorial would have used signals but didn't. That's a bigger change than
we are able to make right now and there are other things we would like
to update at the same time. This fix is a temporary patch to the
existing content until there is time to redo the tutorial and videos
entirely.
fixes#65863
(cherry picked from commit 200d923436)
Updates the `ng-container` documentation page to use the correct `angular-html` code format and removes an unused CLI documentation file.
(cherry picked from commit 9a6b8e0315)
This shows a more prominent warning when multiple versions of Angular
are detected in the workspace and we are forced to choose one to use for
the language server. This also logs those versions with their locations
and directs the user to view the output panel.
fixes#65466
(cherry picked from commit c9dfc6c484)
This PR makes a number of changes to the metadata API to address design
flaws in the previous API. Some of the changes include:
- Replaces the previous `MetadataKey` and `AggregateMetadataKey` with a
single unified `MetadataKey` that is used for all metadata.
- The new `MetadataKey` is only defined for fields that explicitly set
it in their schema logic
- All metadata now has reducer / aggregate behavior
- The new `MetadataKey` has an option to create a managed key which
wraps the result of its computed aggregate into some other structure
such as a `Resource` or `linkedSignal`
- There are now two APIs to create metadata keys
- `createMetadataKey` for pure computed metadata
- `createManagedMetadataKey` for metadata that manages its computation
internally
(cherry picked from commit ebc5c2b083)
Add CSS rule to hide the last empty line in code blocks to prevent displaying
unnecessary empty lines when source files end with a newline character.
The empty line remains in the DOM for proper copy-paste functionality.
(cherry picked from commit 4b9fffaa79)
FormUiControl states that hidden, pending and dirty will be bind in custom controls, but this is currently not the case.
Fixes#65575
(cherry picked from commit 9fe9566581)
This change replaces all remaining occurrences of `typeof ngDevMode !== undefined`
with the correct `typeof ngDevMode !== 'undefined'` form. This aligns the codebase
with JavaScript typeof semantics and maintains consistency with other Angular code.
(cherry picked from commit 96b79fc393)
Replace the 'any' type with ClassDebugInfo for the debugInfo parameter in
stringifyTypeFromDebugInfo function. This removes the TODO comment that was
tracking the need for proper typing without creating circular dependencies.
The change improves type safety while avoiding circular imports since
stringify_utils.ts doesn't export anything that definition.ts imports.
(cherry picked from commit 5fd75410a9)
Introduces the new complexity badge in recommendation cards.
The implementation utilizes CSS variables and `color-mix` to efficiently
handle color themes (Basic, Medium, Advanced) and dark mode support.
Closes#65378
(cherry picked from commit 253dc95d63)
This commit updates the CONTRIBUTING.md file to provide clearer
guidelines for new contributors, including sections on code style,
testing, and the pull request process.
(cherry picked from commit ce4ddf4b47)
Adds the ability to hide the copy button on code snippets.
Updates documentation to use the new `hideCopy` option with the new
markdown code fence syntax.
(cherry picked from commit a4563044ad)
Intercept the WebContainer preview overlay open-in-editor requests and relay them to the editor via postMessage so errors open the matching file.
(cherry picked from commit 789f91bd4f)
Updates the linkedSignal documentation to specify that it updates its value when the source changes or when any signal referenced in the computation changes, ensuring the description accurately reflects its behavior.
(cherry picked from commit e311f3df72)
- Use getComponentDef in debugStringifyTypeForError to clean up TODO
- Remove outdated comment from stringify_utils
(cherry picked from commit 0bb8924ab6)
Previously, navigating a `FieldTree` in signal forms involved reactive reads
of the value of the parent field(s), both directly and via `.childrenMap()`.
This meant that on _any_ change to the value of a field, reactive
notifications would trigger updates of computeds, reruns of effects, etc.
So for example, this effect would run on every change to the form:
```ts
const f = form(signal({data: 'abc', unrelated: 0}));
effect(() => {
// accessing f.data incurs a dependency on f().value() which changes
// on every change in the whole form
console.log(f.data().value());
});
```
This is deeply counterintuitive and troublesome when attempting to write
effect logic, and also results in `computed`s unnecessarily updating.
This change introduces the concept of a "reader" computed, which memoizes
the access of a field at a given key via the reactive graph. With this, the
same `f.data` access above now depends on the `data` reader in `f` only,
which is effectively a constant computed. As a result, the effect only
reruns on changes to `data`'s value, as intended.
PR Close#65802
Previously, several values were being passed into the creation of
`FieldNodeStructure`s that were only used in the creation of child nodes.
Separately, we also passed a `createChildNode` function which these values
were passed back into.
Instead, this moves the small bit of logic from structure.ts behind the
`createChildNode` callback, which reduces the passing of values back-and-
forth and gives `createChildNode` a much more suitable signature.
PR Close#65802
This updates the docs infrastructure to avoid incorrectly linking the `readonly` keyword in TypeScript examples.
Fixes#65632
(cherry picked from commit 7f8ffa3304)
Extends the `FormUiControl` interface to allow `InputSignalWithTransform` in addition to `InputSignal` for its properties.
Fixes#65756
(cherry picked from commit 7d1e502345)
Move the instructions used to dynamically bind a `Field` directive to a
form control onto the `Field` itself. This way the instructions are only
retained if the app uses the `Field` directive.
PR Close#65599
When registering providers, the DI system assumes that `viewProviders` are registered before plain `providers`. This was reinforced by components always being first in the array of directive matches, only one component being allowed per node and the fact that only components can have `viewProviders`.
This breaks down if there are host directives with `providers` on the component, because they'll execute earlier, throwing off the order of operations.
These changes fix the issue by separating out the resolvers for `viewProviders` and plain `providers` and explicitly running the component's `viewProviders` resolver before any others. This also has the benefit of not attempting to resolve `viewProviders` for directives which are guaranteed not to have them.
Fixes#65724.
(cherry picked from commit 886cf6c452)
Previously, the XSRF interceptor only added the XSRF token to requests with relative URLs.
This commit updates the interceptor to also add the token to requests with absolute URLs, provided they match the current origin.
(cherry picked from commit 0659d11c85)
Adds some type checking code which verifies that the bound `value` on a `Field` radio button is a string.
Fixes#65726.
(cherry picked from commit 6773d3b97d)
This commit adds a `.catch()` handler to `transition.finished` from `document.startViewTransition` to prevent unhandled promise rejections. The finished promise can reject with `TimeoutError` or `InvalidStateError` when transitions fail during or after the animation phase.
Based on the Blink source code, the `finished` promise can reject with:
* `TimeoutError`: "Transition was aborted because of timeout in DOM update"
* `InvalidStateError`: "Transition was aborted because of invalid state"
This may happen when the DOM update phase exceeds the browser's internal timeout threshold.
(cherry picked from commit b74a0693f2)
Prevent the overlay box showing diagnostics errors until after the initial setup of the node runtime is completed.
Fixes#52649
(cherry picked from commit 819b640c2d)
Previously we extracted the regions and only made the visible region visible on the page, but since there is not a need for the
non-visible code to be presented, we don't need to include it in the generated code snippets.
(cherry picked from commit 9b3b5fb4cf)
The end of the Router navigation is a block of synchronous logic that
can be compressed into a single operator rather than splitting it across
several, making it harder to step through. The only benefit from the
split is automatic unsubscribe/cancellation, which we can replicate
with an additional 'shouldContinue' check before proceeding.
(cherry picked from commit b7d21e209a)
Currently when the signal debug name transform sees something like `const foo = signal(0);`, it transforms the signal into `signal(0, {...(ngDevMode ? { debugName: 'foo' } : {})})`. After minification this becomes `signal(0, {})` which will allocate memory for the empty object literal.
These changes rework the logic to produce `signal(0, ...(ngDevMode ? [{ debugName: 'foo' }] : []))` which will be fully tree shaken away to `signal(0)`.
(cherry picked from commit e30e61b789)
In the case that a component injector is destroyed before the animation
queue runs, the animation queue would fail to run because it was using a
destroyed injector. This commit changes the animation queue to run in the
context of the EnvironmentInjector, which is not destroyed until the app
is destroyed.
fixes: #65628
(cherry picked from commit d8ab83ca82)
This is necessary to exclude a race condition where the MutationObserver initialized by the instruction fired before the inputs are binded.
fixes#65678
(cherry picked from commit f35b2ef47c)
Move the header id tracking into the renderer context rather than a global state. Since the RendererContext is
initialized for each execution of the marked parser, we can store the context of which header ids have been seen within
a single page there which allows us to run these parse interactions in parallel.
(cherry picked from commit a16a70ca74)
Rather than manually calling the transformer we use for headings from within a render function, we now properly call into the Renderer to do them
via the tokens they are require instead. This is being done to allow us to have a per Renderer instance of state instead of a global state, which will
allow us to run marked async and hopefully speed up the pipeline
(cherry picked from commit 8b296543ae)
Enables copying a direct link to any section by clicking its anchor. Also updates the aria-label to remove the code tag
(cherry picked from commit 4e89bc6244)
Replaced plain code-form usage of `inject` with a link to the
API docs (`/api/core/inject`) to improve navigation and
help readers access detailed reference information more easily.
(cherry picked from commit 7b33554d24)
Updated various template examples to use self-closing component tags
(e.g., `<my-comp />`) instead of the expanded form (`<my-comp></my-comp>`),
improving consistency across the documentation and aligning with current
Angular style recommendations.
(cherry picked from commit a464406ebf)
Improves the symbol linking logic to handle Angular component selectors (e.g., ngCombobox). It attempts to convert Angular selector patterns to their corresponding class names, improving navigation to Angular API documentation.
(cherry picked from commit 2d854e01bc)
Long TOC entries now truncate with …, and a title attribute is added to display the full label on hover.
Fixes: #65727
(cherry picked from commit 313454bf17)
Fixed documentation issues in content projection examples.
- Component decorator without '@'
- Self-closing tag for ng-content
Fix#65675
(cherry picked from commit f18dd5e54c)
Add Cmd+S/Ctrl+S keyboard shortcut to the adev code editor that prevents
the annoying browser save dialog from appearing. The shortcut is a no-op
since the editor already has auto-save functionality that persists changes
after 500ms of inactivity.
(cherry picked from commit cb04cee7b2)
This commit implements a security fix to prevent XSS vulnerabilities where SVG animation elements (`<animate>`, `<set>`, etc.) could be used to modify the `href` or `xlink:href` attributes of other elements to `javascript:` URLs.
(cherry picked from commit 1c6b0704fb)
With the change we specifically analyse `boostrapApplication` with a config that uses `mergeApplicationConfig`.
fixes#65408
(cherry picked from commit c1dfd9cde6)
When signals throw errors on read, the devtools will show the same error message as the signal custom formatter.
We also don't log errors anymore to the console as those might be surprising to see as errors and are buggy behavior of the devtools.
(cherry picked from commit a0930e166c)
Add test coverage for bundling dynamic component creation API like
`createComponent()` and `inputBinding()`. This will be used to test that
Signal Forms related features for #64632 can be tree-shaken when unused.
(cherry picked from commit add8c41e5b)
Improves the rendering of `DocsPillRow` to correctly display inline code snippets (using backticks) within the pill labels.
(cherry picked from commit ef034c15c1)
The XSRF interceptor previously failed to detect protocol-relative URLs (starting with `//`) as absolute URLs. This allowed requests to such URLs to include the XSRF token, potentially leaking it to external domains.
This change updates the interceptor to correctly identify protocol-relative URLs as absolute and exclude them from receiving the XSRF token.
(cherry picked from commit 40790ef980)
Adds a mark for signal forms so we can track adoption. Also moves the call for `@let` into `declareLet` since we don't need it to fire as often as in `storeLet`.
(cherry picked from commit c994267f17)
This ensures that the right document is used and that `CSP_NONCE` can be used in `provideAppInitializer` and `provideEnvironmentInitializer`.
Closes#65624
(cherry picked from commit 3b1fa8235b)
Escape @-prefixed template control flow constructs during doc extraction so JSDoc parsing keeps description text intact. Add regression coverage for @for snippets.
(cherry picked from commit 5bfa027d41)
Adds a DI configuration option for signal forms that allows the
developer to specify CSS classes that should be automatically added
by the `Field` directive based on the field's status.
(cherry picked from commit c70e246c23)
The type checker will no longer prohibit binding the Signal Forms `[field]`
directive to an input with a dynamic `[attr.type]` or `[type]` binding.
(cherry picked from commit 3a1eb07c46)
The analytics tracking example contained unused and missing imports,
and it incorrectly referenced the page's URL.
This update fixes the imports and ensures the handler uses `event.url`,
allowing the example to work correctly.
(cherry picked from commit a294e3b94d)
We track all effects that are created for debugging purposes in the `resolverToEffects` map. This ends up leaking memory for effects registered on long-living resolvers (e.g. on the root injector), because they stay in the array, even if the effect itself has been destroyed.
These changes add a callback to clean up the references.
Fixes#65265.
(cherry picked from commit ca6ab6c914)
Support binding `[field]` to directives that implement
`FormValueControl` or `FormCheckboxControl`.
The `[field]` binds to whichever directive (or component) matches first in the
event there are multiple implementations. We are considering whether to make
this an error state, which could be reported during type checking.
Closes#63910, Closes#64992
(cherry picked from commit f97a1d4856)
Migrate docs-alert to be inline instead of block, this ensures that the content is placed within a <p> tag as expected. This is important
for ensuring that the iconography is placed correctly within the wrapper div generated for the alert. Additionally, we refactor the matcher
code to be more efficient, running with fewer loops.
(cherry picked from commit 046501fd33)
Currently when we detect a `field` binding on a native element, we treat it as a built-in native control. This might not be the case if it's a pre-existing `ControlValueAccessor` relying on the CVA interop.
These changes try to detect any CVA-like directive on the element and disable the additional type checking if there are any.
Fixes#65468.
(cherry picked from commit 6b8720de91)
the common-to-standalone migration only matched [ngTemplateOutlet] and
[ngComponentOutlet] bindings and missed their structural forms
(*ngTemplateOutlet and *ngComponentOutlet). This caused missing imports
when removing CommonModule. This change adds structural directive
patterns so the migration correctly identifies needed imports.
(cherry picked from commit a4f50bdd54)
Ensures the example viewer header displays correctly by keeping the "Show code"
button aligned to the right and preventing metadata text from wrapping.
Improves layout consistency across documentation examples.
(cherry picked from commit b26fe73a91)
This commit updates the release script to support cherry-picking changelog updates to the main branch when releasing from a patch branch. It also introduces a marker in the changelog to separate releases and ensures the GitHub release uses the formatted changelog from disk.
(cherry picked from commit c843a46912)
- splits the injector inspector into its own guide
- update the screenshots
- add defer block section
- add hydration section
(cherry picked from commit b5ae62c02b)
Replaced <docs-code language="html" with fenced html for improved readability and consistency across documentation.
(cherry picked from commit 0203dad09b)
Tab selection relied on the tabs being visible whe nthe example is loaded. That didn't work when `hideCode` was used.
fixes#65550
(cherry picked from commit 119c6ddaeb)
Replace absolute URLs (https://angular.dev/...) with relative URLs
(/...) to prevent internal documentation links from being treated
as external links and opening in new tabs.
(cherry picked from commit 8f89507a0b)
Replaced `status=deprecated` with the correct numeric value `status=8`
to ensure the Deprecated APIs link resolves properly in the docs.
(cherry picked from commit 16a0b7dfdb)
The example incorrectly persisted the error message after a successful
navigation retry because the stream only emitted NavigationError events.
This update removes the filter and returns an empty string for non-error
events, allowing the signal to clear the message on normal navigation.
(cherry picked from commit 72b1f7fd43)
Replaced <docs-code language="json" header=".postcssrc.json"> with fenced
JSON code blocks using ```json {header: '.postcssrc.json'} for improved
readability and consistency across documentation.
(cherry picked from commit 68aa83e8cf)
Extends the Markdown parser to support `loading`, `decoding`, and `fetchpriority` attributes for images via curly brace syntax.
(cherry picked from commit 46269be842)
Rather than using multiple view modes for code examples, we can just treat the previous snippet mode as
as multifile mode that just only has one file in it.
(cherry picked from commit f61e61ac4f)
Within examples, we now link to the github URL using the commit that was made to create adev, rather than
always on main, which may change over time.
(cherry picked from commit a8f46e598a)
Update the strictInputAccessModifiers documentation to clarify that:
- The flag applies to both @Input() decorator and input() signal-based inputs
- The checking only applies to inputs, not outputs
- format interface with fenced block
Fixes docs part of #65243
(cherry picked from commit 34fa11ec9d)
Updates syntax highlighting rules to properly handle inline templates defined within decorators, improving readability and consistency in code examples
(cherry picked from commit 1672493d1a)
Standalone components are now the default, so explicitly specifying
`standalone: true` is no longer required. Updated relevant documentation
examples to avoid redundant configuration and keep the guides concise.
(cherry picked from commit f825547353)
Ignore files that fail fs.exists() rather than throw ENOENT. Some applications deliberately create "broken" symbolic links that are not relevant to compilation (e.g. emacs lock files that link to owner "user@host").
(cherry picked from commit 1628125bcb)
Updated outdated link guide/forms/signal-forms/ to the correct path guide/forms/signals/ to ensure proper navigation.
Fixes: #65461#65462
(cherry picked from commit 68f5ceeb46)
Adds the missing ARIA usage patterns and links to the relevant API reference
sections to improve accessibility guidance and ensure examples follow recommended
best practices.
(cherry picked from commit cea19803d8)
Previously, the Algolia index name was hardcoded in the configuration, requiring manual updates for every new major release branch.
This commit automates the index name selection by deriving the version directly @angular/core. It dynamically assigns:
- `angular_next_dev` for pre-releases (`-next`, `-rc`) and local snapshots (`0.0.0`).
- `angular_vXX` (e.g., `angular_v19`) for stable releases.
(cherry picked from commit 2ddf26e699)
Update e2e test runner to VS Code 1.102.0, streamline test activation, and manage temporary directories via `TEST_TMPDIR`.
(cherry picked from commit 1a094ddb2b)
Updated to align the v20 active end date with the v21 release date and fix the v21 LTS to be 1-year after the active period ends.
(cherry picked from commit 2ecdb221d3)
This commit updates the Tailwind CSS integration guide (`adev/src/content/guide/tailwind.md`) to introduce `ng add tailwindcss` as the primary, automated method for integrating Tailwind CSS.
(cherry picked from commit 396c25ef5a)
Although the prior commit has made more profiler events guaranteed symmetric
through the use of finally-blocks, there continue to be some situations
that could potentially result in asymmetric events, e.g. application
bootstrap doesn't guarantee symmetric events. This commit makes the profiler
lenient to these situations by unrolling the stack past the asymmetric event
data, eventually reaching the expected start event.
(cherry picked from commit 913cde8ab4)
Profiler events are expected to be symmetric, yet in the case of errors this symmetry may break
if events aren't always kept in sync with their corresponding start event. This commit moves
various end events to be run from a finally-block, allowing them to notify the profiler even
when an error has occurred.
Fixes#62947
(cherry picked from commit 3760045e3e)
The @ts-ignore comment is no longer needed as the module resolution
issue has been fixed in the playground editor configuration.
(cherry picked from commit bea7358225)
toSignal predates the debugName option for signals to name the signals in the Angular dev-tools This adds the debugName option to toSignal.
(cherry picked from commit 0812ac3bec)
This guide currently contains Karma/Jasmine specific code examples.
Adding a note to inform readers that Vitest equivalents are being worked on.
(cherry picked from commit 80202bffee)
This commit adds the `translate="no"` attribute to the icon elements to ensure they are preserved in their original form and not modified by translation tools.
Closes#65406
(cherry picked from commit 42c05650ff)
This commit moves documentation for Zone.js-dependent testing utilities
(`waitForAsync`, `fakeAsync`, `tick`, `discardPeriodicTasks`, `flushMicrotasks`)
from `testing/utility-apis.md` to a new dedicated guide:
`testing/zone-js-testing-utilities.md`.
(cherry picked from commit e77fb1fb14)
The `getControlDirective` is called multiple times, both at init and during each update run. Under the hood it performs a linear search for the `Field` directive.
We can speed this up by finding its index once and reusing it since the array of directive matches is static.
(cherry picked from commit 5e6d8573f4)
We removed the ability to customize the interpolation some time ago. These changes remove the remaining code related to them.
(cherry picked from commit 81ce1ba1d9)
Removes the ability to specify container blocks when creating an i18n parser. We were only passing in `switch` and it likely won't change.
(cherry picked from commit b6c141bf8b)
This commit introduces several improvements to the release process:
- Adds a clear warning and instructions to test the extension before merging the release PR
- Removes the explicit `vsce login` command.
(cherry picked from commit 22ad71d752)
Adds a parallel example for style bindings alongside the existing class binding example, demonstrating the preferred syntax of [style.property] and [style] over [ngStyle] directive.
(cherry picked from commit 7e5fca2608)
Hide the field when the user unfocuses from it; Fill the input with the file name when renaming; Fix file path renaming
(cherry picked from commit 0a33a18fa4)
Force adev and devapp to run in non-TTY mode so it doesn't create a prompt that can't be interacted with. This will initially have no effect,
but the fix is expected to land in CLI to make this work as expected in the next few days.
Show the signal graph button only when a signal-graph-eligible node from the directive explorer is selected; Fix client app error when a `defer` node is selected (related)
(cherry picked from commit e7a6e31a70)
Added recommendation in advanced section for redirectTo and canMatch will generate an error. These properties are incompatible together
fixes#65267
(cherry picked from commit c757fd6c29)
This commit improves the release process for the vscode-ng-language-service by adding automated changelog generation and updating the package.json version.
This PR converts the custom <docs-code> blocks to standard Markdown code blocks with TypeScript syntax highlighting.
(cherry picked from commit 7a2d5116f2)
Following https://github.com/angular/angular/pull/64509 we started
choking on unbalanced closing parentheses in declaration blocks,
specifically in quoted background-image urls. This was reported in
https://github.com/angular/angular/issues/65137.
This occured because we previously (and now again) traverse the entire
declaration block when selecting for :host-context() selectors to shim.
This is an oddity of how we parse styles today, and is likely something
we'd want to remove if we parsed selectors properly.
This change adds a new flag to _splitOnTopLevelCommas which allows it to
continue past unbalanced closing parentheses in the declaration block,
returning _convertColonHostContext to its previous behavior while
keeping support for the extra nesting in :host-context().
(cherry picked from commit 9e7ddcaa10)
We didn't get much report on the feature itself so we feel confident about promoting it to stable. In parallel we'll also land #62959 but one is not blocking the other.
fixes#64996
(cherry picked from commit c15836c8c7)
It can be useful for a developer to set `NaN` as the value for a number
input, as a way to say "clear the input". However, directly setting this
value to the `.valueAsNumber` causes a console warning. This PR fixes
the console warning by just doing `.value = ''` when we would otherwise
to `.valueAsNumber = NaN`
(cherry picked from commit f47637426f)
An early piece of feedback received regarding custom controls hosted on
native inputs was that they required a lot of boilerplate to bind
`FieldState` properties. Each property required an input to accept the
property, and a host binding to forward it to the native control.
(cherry picked from commit c727df5d38)
Although the prior commit has made more profiler events guaranteed symmetric
through the use of finally-blocks, there continue to be some situations
that could potentially result in asymmetric events, e.g. application
bootstrap doesn't guarantee symmetric events. This commit makes the profiler
lenient to these situations by unrolling the stack past the asymmetric event
data, eventually reaching the expected start event.
(cherry picked from commit da9911f2b4)
Profiler events are expected to be symmetric, yet in the case of errors this symmetry may break
if events aren't always kept in sync with their corresponding start event. This commit moves
various end events to be run from a finally-block, allowing them to notify the profiler even
when an error has occurred.
Fixes#62947
(cherry picked from commit af1ba52587)
Updated shell command examples to use fenced code blocks (```shell) instead of <docs-code> components, improving formatting consistency and aligning with current documentation standards.
(cherry picked from commit dff9d12bc3)
Adds target="_blank" and rel="noopener noreferrer" to prevent tab-nabbing and follow modern security best practices.
(cherry picked from commit 1aed9408a4)
Updated bash command examples to use fenced code blocks (```bash) instead of <docs-code> components, improving formatting consistency and aligning with current documentation standards.
(cherry picked from commit 7ea60052f0)
The actual numerical data can only be checked in the prop edit mode. This fixes that and makes the real value visible all the time.
(cherry picked from commit d6be289603)
Ensure the content script forwards Angular detection results to the service worker so the popup/icon reflects the page state.
(cherry picked from commit 7d41716703)
* Apply any debounce rules to updates from interop controls (if configured).
* Add tests to ensure debouncing works for all control types (native, custom,
and interop).
(cherry picked from commit b1037ec2f0)
Updated shell command examples to use fenced code blocks (```shell) instead of components, improving formatting consistency and aligning with current documentation standards.
(cherry picked from commit 576f9ba889)
- Replaced <a><button></button></a> with a proper <a> containing text and
aria-label to ensure links have discernible text.
- Added main tag in home page to provide
a consistent main landmark, improving accessibility for screen readers
and satisfying WCAG and Lighthouse requirements.
Fixes#65181.
(cherry picked from commit ee5947db38)
Code blocks with `bash` language identifier were not rendering the `$`
prefix, while `shell` blocks did.
This ensures consistent command-line prompt rendering across both
`bash` and `shell` code blocks in the documentation.
(cherry picked from commit f462684211)
This commit updates the testing documentation to include `bun` as a package manager option in all relevant code examples.
Additionally, it standardizes the presentation of package manager commands by:
- Consistently using a multi-tab format (`<docs-code-multifile>`).
- Enforcing a consistent order: `npm`, `yarn`, `pnpm`, `bun`.
These changes improve the user experience by providing clear instructions for multiple package managers and ensuring consistency across the testing guides.
(cherry picked from commit 599b72ec5a)
This commit updates the unit testing, code coverage, and debugging guides to align with the Vitest test runner, which is now the default for new Angular CLI projects.
Key changes include:
- **Unit Testing Overview**: Revised to focus on Vitest, including details on DOM emulation (jsdom/happy-dom), browser testing setup, and custom Vitest configuration via `runnerConfig`. A prominent note links to the Karma-to-Vitest migration guide.
- **Code Coverage**: Updated to reflect Vitest-specific prerequisites (`@vitest/coverage-v8`), command-line flags, and `angular.json` configuration for coverage reporting and threshold enforcement.
- **Debugging**: Completely rewritten to provide instructions for debugging Vitest tests in both Node.js and browser environments using the `--debug` flag.
- **Navigation Reordering**: The 'Testing' section in `sub-navigation-data.ts` has been reordered to present a more logical educational flow, starting with core concepts and progressing to advanced topics and migration.
(cherry picked from commit f5a7719373)
The example viewer has some `::ng-deep` styles that are used to reset global styles that leak into the live examples. It works by applying a style like `.docs-example-viewer-preview * {all: revert;}`.
The problem with this is that depending on when the first example is rendered, the styles will be lower or higher in the cascade, thus making the reset unreliable. Furthermore, it can affect structural styles from the CDK which intentionally have low specificity.
These changes move the resets into the global stylesheet to make them more predictable.
(cherry picked from commit 1ba50caefc)
Removed redundant "src/app/" prefix from file headers (e.g.,
"src/app/open-close.component.ts" → "open-close.component.ts")
to make code examples cleaner and more focused.
(cherry picked from commit b3adb6001c)
This commit updates the elements and tailwind guides to use the standardized `docs-code-multifile` format for package manager commands. This change introduces `yarn`, `pnpm`, and `bun` alternatives to the existing `npm` commands, providing a consistent experience for users across different package managers.
(cherry picked from commit 6208016026)
If we're calling `min` on a path that's guaranteed to be `number` we
don't want to make the users validator function handle the `null` or
`string` cases.
This uncovered an issue in the `SchemaTreePath` type which needed to be
fixed by preventing the model type from being distributed over.
PR Close#65212
Relaxes the constraints on which paths can be used with the `min` &
`max` validation rules, since people may want to validate a
potentially-null number, or a numeric value represented as a string
PR Close#65212
The `type_check_block.ts` file was getting quite large and difficult to navigate. These changes split up the different pieces of functionality into separate files.
(cherry picked from commit 81bd455de8)
Test that a component with a bound `[field]` input is not treated as a
control, and that `fieldBinding` does not include the corresponding
`Field` instance.
(cherry picked from commit acb78eeb7a)
This PR fixes a parameter mismatch in the `apiClientFactory` function documentation example. The factory was previously passing only http and `userService` to the ``ApiClient`` constructor, but the constructor actually requires http, `baseUrl`, and `rateLimitMs` as separate parameters.
Key Changes:
Extracts baseUrl and rateLimitMs from UserService using getter methods
Updates the ApiClient instantiation to pass all three required constructor parameters
Adds a comment explaining the assumption about UserService providing these values
(cherry picked from commit 6f716e400e)
The regex for caching generated files in firebase.json has been updated to
include lowercase letters and underscores in the 8-character hash. This
ensures that files with names like `chunk-CrXHmw_W.js` are correctly
cached.
(cherry picked from commit e840cd547d)
In cases the `ngDevMode` flag hasn't been set, still enable the formatter. What matters is if `ngDevMode` is `false ` we tree shake that away.
(cherry picked from commit 1b895fece6)
Add an `AbortSignal` parameter to `Debouncer`. Implementations may
choose to accept this parameter to be informed when a debounced
operation is aborted. This may be useful for canceling pending timers or
avoiding unnecessary work.
(cherry picked from commit 98ce9a7b17)
Replaced the <docs-code> wrapper with a Markdown fenced code block to improve
copy/paste usability, syntax highlighting consistency, and alignment with current
documentation formatting standards.
Inspired by #65043
(cherry picked from commit 3cfd4361a5)
Replaced the <docs-code> wrapper with a Markdown fenced code block to improve
copy/paste usability, syntax highlighting consistency, and alignment with current
documentation formatting standards.
Inspired by angular#65043
(cherry picked from commit caaa5ec8e6)
This commit introduces a new guide for migrating existing Angular projects from Karma/Jasmine to Vitest.
The guide covers:
- Manual steps for installing dependencies and updating `angular.json`.
- Handling custom `karma.conf.js` configurations.
- Removing Karma-related files and packages.
- Configuring browser mode for Vitest.
- Details on the `refactor-jasmine-vitest` schematic for automated test refactoring.
The guide also clarifies that while Vitest is the default for new projects, migration for existing projects is experimental. It emphasizes reviewing changes and provides guidance on adapting custom Karma configurations to Vitest.
Renames `experimental-unit-test.md` to `migrating-to-vitest.md` and updates `sub-navigation-data.ts` accordingly.
(cherry picked from commit 258c295b92)
Reworks the way we approach type checking of signal forms to be closer to the behavior at runtime. There are a couple of scenarios that we handle:
1. For native controls, we now produce simplified type checking code that looks as follows:
```
var t1 = null! as number | string; // Type depends on the input `type`.
t1 = someField().value();
```
2. For custom controls we generate bindings to the individual inputs, rather than checking conformance against `FormValueControl`/`FormCheckboxControl`. This is closer to the behavior at runtime and it allows us to handle generic directives properly.
(cherry picked from commit f7e58577a4)
This change configures pnpm to allow any version of `@angular/*` packages to satisfy peer dependencies. This is necessary because `@angular/*` packages are managed within this monorepo, and this rule prevents issues with peer dependency resolution when different versions might be present during development or testing.
(cherry picked from commit 46099910c0)
:nth-child() (and its siblings) support complex expressions, e.g.
`:nth-child(2n of :is(.foo, .bar))`. Previously we'd choke because of
the `:is()`. Now, we reuse the `_parenSuffix` subexpression to match
nested parentheses the same way we do for :host() and :host-context().
Note that we only support 3 levels of nesting, so a selector like
`:nth-child(n of :is(:has(:not(.foo))))` will still break.
I'll say yet again that we really should add a proper parser so we stop
getting bug reports like this :)
Fixes#64913
(cherry picked from commit 24cfd5a0ed)
Refactor to use async/await for clearer asynchronous operations and enhanced error handling.
Simplify resource caching and streamline the resolution of component templates and styles.
Update in the router to align with the new async resource resolution.
(cherry picked from commit 4ed8781301)
The `debounce()` rule allows developers to control when changes to a
form control are synchronized to the form model.
This feature necessitated some changes to `FieldState`:
* `controlValue` is a new signal property that represents the current
value of a form field as it appears in its corresponding control.
* `value` conceptually remains unchanged; however, its value may lag
behind that of `controlValue` if a `debounce()` rule is applied.
The `debounce()` rule essentially manages when changes to `controlValue` are
synchronized to `value`. The intent is that an expensive or slow
validation rule can react to the debounced `value`, rather than a more
frequently changing `controlValue`.
Directly updating `value` immediately updates `controlValue`, and cancels any
pending debounced updates.
When multiple `debounce()` rules are applied to the same field, the last
currently active rule is used to debounce an update. These rules are
applied to child fields as well, unless they override them with their
own rule.
(cherry picked from commit d337cfb68f)
This removes the need to specify type arguments for
`reducedMetadataKey()` when the value returned from the `getIntial`
callback is a subtype of the accumulated type.
(cherry picked from commit 8866934334)
The flag `skipFormatting` got renamed to `ngSkipFormatting` during review of https://github.com/angular/angular/pull/64000, but a couple usages got missed, causing some unfortunate UI recursion.
(cherry picked from commit 490435bf76)
The `fullInheritane` flag from the metadata and the `CopyDefinitionFeature` that it controls appear to no longer be used since `fullInheritance` is always false. The feature appears to have been there to support ngcc which was removed some time ago.
(cherry picked from commit 8277906455)
Prior to this commit, attempting to resolve a `ChangeDetectorRef` after views or app have been destroyed would result in an error. In this commit, we clean up listeners once the view is destroyed, before the placeholder loads or fails to load.
(cherry picked from commit feb86e3fde)
Wraps InjectionToken names with `typeof ngDevMode !== 'undefined' && ngDevMode`
checks to enable tree-shaking of descriptive token names in production builds.
This ensures debug-only strings are removed from production bundles, reducing size.
Also removes unused imports found during refactor.
(cherry picked from commit b0b834d7f1)
Annotate the `new Version(...)` call with `/* @__PURE__ */` to signal to optimizers that the constructor is side-effect free.
Without this hint, bundlers such as Terser or ESBuild may conservatively retain the `VERSION` instantiation even when unused. With the annotation, the constant can be tree-shaken away in production builds if not referenced, reducing bundle size.
(cherry picked from commit d3f67f6ca8)
Replaces the <docs-code> component with standard markdown code fences in the service worker documentation. This improves the readability and maintainability of the documentation.
(cherry picked from commit d42f9ce3a9)
Replace `@Optional() link: RouterLink` constructor parameter with
`link = inject(RouterLink, {optional: true})` to enable tree-shaking
of the `Optional` decorator and its factory scaffolding.
Bundle size reduction: `Optional` is a runtime value created by
`makeParamDecorator()`. Even in production builds, ESBuild and other
bundlers must keep their factory code because it is referenced via
`Optional`. With `inject()`, this class is no longer referenced,
allowing it and the `makeParamDecorator` scaffolding to be tree-shaken
when unused elsewhere.
Note: This updates the constructor signature but should not be
considered a breaking change. Angular's official guidance is that
directives, components, and pipes should be instantiated by the
framework, not by user code. Directly calling `new RouterLinkActive(...)`
is an unsupported pattern that goes against Angular's design principles.
(cherry picked from commit 7724a9460d)
Added `language="shell"` to installation command examples to display
the shell prompt `$` icon consistently across npm, pnpm, yarn, and bun
code blocks.
(cherry picked from commit 27d54654e3)
Removed redundant "src/app/" prefix from file headers (e.g.,
"src/app/open-close.component.ts" → "open-close.component.ts")
to make code examples cleaner and more focused.
(cherry picked from commit e0a4bdd72b)
Previously, the URLs in the generated sitemap contained double slashes between the host and the path. It's not the case anymore.
fix#65022
(cherry picked from commit afe5fc0399)
I took a quick look at my recent changes to see if I had inadvertently
fixed this bug, but I couldn't seem to reproduce it even before my
changes. Seems like it's working, though.
Closes#58436
(cherry picked from commit 4b871b139b)
`new RegExp()` with computed strings can't be analyzed statically. The bundler can't prove the template string evaluation has no side effects; as thus this expression is considered a side-effect.
(cherry picked from commit 7f95f02d05)
Remove an unnecessary TODO comment. The native `<select>` tracks its
`value` by keeping track of the selected `<option>`. Thus if the value
was set *before* the corresponding option is created, the `<select>`
will ignore it, but the framework doesn't know that and will cache the
bound value anyways. Therefore, checking if the value changed since it
was last bound when the mutation that creates the selected `<option>`
occurs would in fact prevent a needed update, leaving the `<select>` and
field values out of sync.
Furthermore, we know the control type is a native `<select>` element, so
we can update its value directly instead of going through
`updateNativeControl()` which would perform a redundant input type
check.
(cherry picked from commit 44cd18c183)
https://github.com/angular/angular/pull/64590 implemented change
detection for field bindings, but only for those bound to native or
custom form controls. This change extends that optimization to apply to
field bindings on interoperable controls built using Reactive Forms as well.
(cherry picked from commit 850f0d6b3d)
Fixes some type checking errors in the signal forms tests that accumulated while there wasn't any type checking.
(cherry picked from commit 10915f2f5f)
Currently the logic for detecting `Field` directives only works if it's imported from `@angular/forms/signals` which doesn't cover our own tests.
These changes make the check more robust.
(cherry picked from commit 0b6b78ca74)
Adds some logic that won't report the `value` or `checked` inputs as missing when the `Field` directive is present since it will bind to the inputs implicitly.
(cherry picked from commit 165634264e)
Switches to checking against `FormValueControl<any>` instead of `FormValueControl<unknown>` when checking whether custom controls conform to the interface.
Fixes#64946.
(cherry picked from commit 4d0778529f)
This addresses a potential memory leak in plugin-factory.ts.
The require call inside the create function reloads the entire language
service module for every new project, which is inefficient and could be a cause of the memory leak during branch
switching. This ensures the module is loaded only once and the same
instance is shared across all projects.
(cherry picked from commit 4405725943)
The file is no longer included in the VSCode extension package.
This change updates the golden file and the file to reflect this exclusion.
PR Close#64991
This commit introduces a golden file test to verify the contents of the VSCode extension package.
The test ensures that the list of files included in the extension package remains consistent.
A new Bazel rule is added to generate the list of files, and is used to compare it against the golden file. A helper script is also added to facilitate the generation of the golden file.
PR Close#64991
This change adds support for commas in :host() arguments (e.g.
`:host(:not(.foo, .bar))` as well as in nested parens when the argument
is applied without parens (e.g. `:host:not(:has(.foo, .bar))`).
Previously these selectors would receive an extra `[nghost]` attr, e.g.
`[nghost]:not(.foo, [nghost].bar)`.
I didn't file a bug for this one, but it's also blocking on an internal
LSC. Like the other CSS changes, I'll run a TGP to confirm this isn't
breaking.
(cherry picked from commit 680c3c7bff)
Replaced multiple component tags such as `<example></example>` with
self-closing syntax (`<example />`) across documentation examples.
This improves readability and aligns with the current Angular
style conventions.
(cherry picked from commit a2cd36777a)
The current section `Services with dependencies` within the testing services
guide is non-functional and has been removed. The example service is using
`inject` but the test code is using constructor-based injection. The further
sections discuss the use of TestBed to adjust providers which better handles
these cases.
(cherry picked from commit e3143036ba)
This commit updates the testing documentation to reflect the introduction of Vitest as the default test runner, while ensuring Karma testing instructions are still available.
Key changes include:
- Adding a new guide for "Testing with Karma" (`guide/testing/karma.md`).
- Updating the "Code Coverage" guide (`guide/testing/code-coverage.md`) to use `angular.json` for coverage enforcement and referencing Vitest documentation.
- Modifying the "Testing Overview" guide (`guide/testing/overview.md`) to introduce Vitest as the default, update `ng test` output examples, and link to the new Karma guide.
- Updating navigation data to include the new Karma testing guide.
(cherry picked from commit 2a2397acc4)
By intersecting with `object` instead of `unknown` in the primitive and
`FormControl` cases, we get TypeScript to show nicer type errors that
mention `FieldTree<...>` insetad of `() => FieldState<...>`
(cherry picked from commit 0efb3f6d1f)
Currently we maintain the pathKeys internally, but do not expose them
through the `FieldContext`, this PR updates the `FieldContext` to expose
this property.
(cherry picked from commit 2fd8dc9195)
Eliminates the unnecessary injection and usage of Platform ID in the renderer factory logic, along with related test scaffolding cleanup
(cherry picked from commit 5343001835)
This commit removes `ngGroupStatusHost` variable because it's a side-effect, ending up preserving `ngControlStatusHost` and `ngGroupStatusHost`.
(cherry picked from commit 9f76fb61df)
Previously we supported one level of nested parentheses inside of a
`:host()` selector, e.g. `:host(:not(p))`. This caused a breakage in g3
when I migrated a selector from `:host:not(:has(p))` to
`:host(:not(:has(p)))`. This change adds support for just one more level
of nesting.
It'd be nice to move everything to a real CSS parser (or even update it
to count parentheses like I did with :host-context()), but I wasn't able
to get that to work in ~20 minutes and I'm focusing on other things at
the moment.
This change punts the problem until somebody tries to use just one more
level of nesting in a selector.
Fixes#64830
(cherry picked from commit 444143758e)
We automatically generate the sitemap for the angular.dev deployment and include it in the assets pushed
to firebase.
Co-authored-by: Matthieu Riegler <kyro38@gmail.com>
Improves support for using `Object.keys` (and related methods) and
`Symbol.iterator` to work with a `FieldTree` of unknown shape.
(cherry picked from commit e87f423d90)
When we set the `value` on a `<select>` element we're really just
setting the selected `<option>`. It treats the selected option as the
source of truth, rather than the actual value. This means that if
options are added or removed or their value changes, the `<select>` may
wind up with a different `value` than what's in our model.
This PR resolves this issue by adding a `MutationObserver` to the select
that is used to resync its value to the model whenever the options may
have changed.
(cherry picked from commit 194b41199b)
Update the diff relase package script to properly recursively apply the chmod and support a flag for writing the
diff to a file instead of only logging it to the console.
(cherry picked from commit de1f22cf2c)
Long code blocks overflow the headings on narrow screen (like mobiles), this messes up the global layout of the page. With the ellipsis with fix that.
fixes#64845
(cherry picked from commit 7f44345db3)
Adds TCB-specific tests for the generated code in signal forms since they tend to be a bit easier to read and follow.
(cherry picked from commit 748caf9a74)
Generates additional type checking code to ensure that custom control conform to either `FormValueControl` or `FormCheckboxControl`.
(cherry picked from commit 3c7751020e)
Adds the `ɵExtractFormControlValue` type that we can use during template type checking to extract the type of a custom control.
(cherry picked from commit 4b68bddd62)
Sets up the logic for inferring the type of the signal form that is set on a native `input`, `textarea` or `select`.
(cherry picked from commit 6b51fc3e9d)
We accounted for skipping leave animations during moves, but not swaps.
This accounts for the swap cases and updates how we deal with swaps and
moves. Now we always queue animations and then essentially dequeue them
if we attach them back in the same render pass.
fixes: #64818fixes: #64730
(cherry picked from commit 373d263834)
Updates the typescript dependency to 5.9.3 in vscode-ng-language-service/package.json
and updates pnpm-lock.yaml accordingly.
(cherry picked from commit 3ef2edc076)
For each field state property, check if it has changed since the last
time it was checked before writing it the corresponding form control
property.
The `pattern` and `required` properties of the field state now return a
default value rather than `undefined` if not defined by metadata.
(cherry picked from commit 41be02da2f)
In https://github.com/angular/angular/pull/64745, a fix was introduced for templates referenced with a trailing semicolon. However, templates are still incorrectly removed when there are whitespace characters before the template name.
This commit updates the control flow migration logic to ensure templates referenced with preceding whitespace are not removed.
Fixes#64854
(cherry picked from commit 5b210e97af)
Removes redundant `standalone: true` declarations from code examples.
Standalone components are now the default in Angular, so the flag is
no longer necessary in documentation snippets.
(cherry picked from commit c4c7fb88ac)
Adds a new landing page for developer events, starting with the v21 page. It also includes an ICS file link for calendar invites. Also updated the tests for the docs-pill to support two new attributes so developers can add the event to their calendars.
(cherry picked from commit 7a422c209a)
Adds preconnect links for Google Fonts domains to establish early
connections, reducing latency and improving font loading speed
(cherry picked from commit ffa19ddd3f)
Currently when a required input is missing, we produce a diagnostic on the entire start tag. This can be really noisy if there are already some attributes on the element.
This change switch to only highlighting the tag name instead.
(cherry picked from commit f233f7420a)
Consolidate separate scripts for updating Aria, CDK, and CLI documentation into a single, unified script. This change streamlines the documentation update process and improves maintainability. The workflow file has been updated to use the new consolidated script.
PR Close#64792
Fixed the import error message in the editor section. The build would complete successfully, but an error message would be incorrectly reported.
PR Close#64701
When a firebase command line execution fails, the github action should be shown as failing instead of continuing to attempt to run and resulting in
an exit code of 0 and success
PR Close#64801
isValidUserId = true is logically wrong to use to disable the Save button.
So is logically wrong to use isValidUserId = false to enable the Save button.
Also the default state of this button should be most likely disabled, if we are bothering to check, so the initial value of the signal should most likely be set to true.
To resolve these 2 issues, I propose to use:
- isInValidUserId instead of isValidUserId and:
- isInValidUserId = signal(true); // isValidUserId = signal(false);
After these 2 changes the snippet should make logical sense.
(cherry picked from commit b5dae85b27)
Interfaces with no extends clause were incorrectly rendered with a trailing extends keyword followed by nothing, resulting in invalid TypeScript syntax
(cherry picked from commit f3d056a065)
The DocViewer component's getCodeSnippetsFromMultifileWrapper method was not
extracting the header attribute from nested <docs-code> elements, causing the
ExampleViewer to fall back to displaying file paths instead of custom headers
in tab labels.
This change adds title extraction from the header attribute when processing
multifile code snippets, ensuring that custom headers are properly displayed
in the code viewer tabs.
Fixes#64760
(cherry picked from commit 5d8b76b4fa)
This commit fixes a behavior where under certain conditions, the migration script ignored
a template reference with a trailing semicolon and incorrectly removed the definition
of a referenced template.
Fixes#64741
(cherry picked from commit 64cb08529d)
In some cases the logic order was not preserved properly when using `apply`. In particular this occurs when some logic is registered on a child of the root, followed by an apply to the root, followed by further logic registered on a child. In this case the final registered logic wound up running before the applied logic.
This happened because `FieldPathNode` for a child path was caching its `LogicNodeBuilder` at creation time. This meant that if the parent's `LogicNodeBuilder` changed (e.g., due to an `apply` call), the child would still be using the old one.
This commit fixes the issue by dynamically resolving the `LogicNodeBuilder` for a child path whenever it is accessed.
(cherry picked from commit fa13a167f1)
- Deletes the old Karma configuration and test entry point.
- Updates `angular.json` to use the `@angular/build` builders.
- Adjusts test files to align with the new setup.
This commit changes arrays in a parent array to be tracked the same way
as primitive values like strings and numbers. This is necessary because
the tracking key symbol used to maintain identity for objects in an
array does not survive the array spread operation:
```
return {...oldValue} // tracking symbol preserved ✅
return [...oldValue] // tracking symbol lost ❌
```
(cherry picked from commit f80b51a738)
This change updates the rollup configuration for the core schematics to exclude all `@angular/*` packages from the bundle. This is possible following https://github.com/angular/angular/pull/64703
This significantly reduces the size of the `@angular/core` schematics bundle, resulting in a size reduction to 5.8mb.
(cherry picked from commit b4e798ed87)
migration schematics will pull from `compiler-cli/private/migrations`
core tests will pull from `compiler-cli/private/testing`
(cherry picked from commit 8e50cdb930)
The navigation list component was using `routerLinkActive` with
`{ exact: true }`, which required an exact URL match including query
parameters. When visiting `/update-guide?v=19.0-20.0&l=1`, the link
`/update-guide` didn't match, so the active class wasn't applied.
Updated `routerLinkActiveOptions` to ignore query parameters while
maintaining exact path matching so the navigation item stays highlighted
when interacting with the update guide form.
(cherry picked from commit 33a872d90a)
Enables propagating a trace across XHR callbacks by providing a hook for
wrapping the callback with a function bound to the send trace context.
(cherry picked from commit 07b8e953f4)
Changed terminal output code block in installation.md from shell
language to plain text to prevent rendering of shell prompt ($).
The block displays read-only log output that users should not
execute as commands.
(cherry picked from commit e9b29c359d)
Since `input()` defaults to `undefined`, the explicit initializer was unnecessary.
This improves clarity and reduces boilerplate.
(cherry picked from commit 8291760f9b)
If a component template contains an icu expression it is being retained until the next change detection cycle for that template. This results in a net retention of only ever a single copy of the given lView but that creates an opportunity for compounding leaks.
Change the icu i18n_icu_container_visitor to free the IcuIteratorState retained lView when the stack is empty so that garbage collection can occur when the view is discarded.
(cherry picked from commit 59e648913c)
Enhances user experience by displaying a snackbar notification when clipboard copy fails, and logs detailed error information via the message bus
(cherry picked from commit bfcaf17005)
The schematics bundle size is reduced by externalizing @angular/compiler. This reduces the package size from 11mb to 9.1mb.
(cherry picked from commit 9d00c6892f)
Previously we supported one level of nested pseudo-element selectors
inside :host-context(), e.g. :host-context(:is(.foo, .bar)). This was
based on a regex-based approach. We could support deeper levels of
nesting by updating the regex, but using a regex approach prohibits us
from supporting arbitrary nesting.
Rather than just adding one more level to the existing expression, I've
added a new generator function which splits selectors on commas in a
parenthesis-aware way. This allows us to support arbitrary nesting.
It's likely we'll want to reuse this in other places where we're not as
careful today. We'll probably do this on a request-based basis, though.
Fixes#59176
(cherry picked from commit b478e91068)
This commit moves the best-practices.md file from adev/src/context to packages/core/resources. The BUILD.bazel files and other configuration files have been updated to reflect this change.
(cherry picked from commit 25e8bcbdf6)
The ExampleViewer component was extracting only innerHTML from code
blocks in multifile examples, which lost the shell class applied by
the formatCode function. This caused the $ prompt to not appear for
shell commands in multifile blocks even when language="shell" was set.
Modified the Snippet interface to track shell language state and
updated getCodeSnippetsFromMultifileWrapper and getStandaloneCodeSnippet
methods to preserve the shell class. Updated example-viewer template
to conditionally apply the shell class to the code wrapper element.
Fixes inconsistency between standalone and multifile shell code blocks.
(cherry picked from commit 27e183330e)
This commit introduces a number of changes to streamline the build configuration for adev, the documentation application.
(cherry picked from commit 53287bce9b)
Previously we would look in the DI tree for a token named 'Router' and resolve its value.
Now we use the already existing getRouterInstance, which depends on ng global debug APIs to get the router instance of an application.
(cherry picked from commit c963569c0e)
This adds a (private) provider for integrating with the browser Navigation API.
This provider ensures that interactions with the `Location` service
use the underlying platform navigation rather than the history and
location APIs.
(cherry picked from commit dd09da8ba2)
This commit moves the best-practices.md file from adev/src/context to packages/core/resources. The BUILD.bazel files and other configuration files have been updated to reflect this change.
(cherry picked from commit 07a51872d5)
This commit enables the 'auto' merge strategy for pull requests.
This strategy automatically determines the best merge method based on the
pull request's commits.
The auto merge strategy can:
- Delegate to the autosquash merge strategy if the PR has fixup/squash
commits against multiple normal commits.
- Squash commits if the PR has only one normal commit and some
fixup/squash commits.
- Rebase commits if the PR has no fixup/squash commits.
This improves the developer experience by automating the merge process. A
key benefit is that PRs that can be cleanly rebased will now appear as
'merged' in GitHub's UI, providing a clearer history than the previous
'unmerged' status that could occur with squashing.
Additionally, `dev-infra` and `bazel` are removed from the exempted scopes
for target labels as they are no longer necessary.
PR Close#64624
The directive implemnetation might set CVA values during the template evaluation. Since the template is a reactive context we need to untrack when setting the CVA values to prevent writing to signals in a reactive context.
fixes#64614
PR Close#64618
When working with a proxy object such as signal forms' `Field`,
accessing the `lenght` or `Symbol.iterator` may trgger a reactive read.
This change ensures that `@for` properly captrues this before clearing
the active consumer.
PR Close#64113
Renames the field state related to metadata to reflect the new
"metadata" name. In particular:
- `property(...)` is renamed to `metadata(...)`
- `hasProperty(...)` is renamed to `hasMetadata(...)`
PR Close#64603
Renames logic functions related to metadata to align with the new
"metadata" name. Notably:
- `property(...)` => `metadata(...)`
- `aggregateProperty(...)` => `aggregateMetadata(...)`
PR Close#64603
These have been renamed to `MetadataKey` and `AggregateMetadataKey`
respectively. The team consensus is that the term "property" is so
overloaded that it makes the topic difficult to explain & discuss, hence
the rename.
PR Close#64603
Previously, the `DefaultUrlSerializer` would incorrectly parse URLs with a parenthesized outlet that did not have a name, such as `/(left)`. This would result in an `undefined` outlet name in the serialized URL.
This commit fixes the issue by ensuring that parenthesized outlets without a name are treated as primary outlets.
fixes#58516. Based on the description, either the URL was constructed
manually or by custom serializer.
PR Close#64507
test functions
This improves the fakeAsync error message when importing it, describe,
etc from jest
We will not be further expanding the ZoneJS patches to support
additional use-cases.
fixes#47603
PR Close#64497
We were clearing duplicate nodes when `animate.enter` fired fast, but not when solely `animate.leave` is fired and rapid toggles occur. This ensures that the `cancelLeavingNodes` function is called in all cases instead of just enter animations.
fixes: #64581
PR Close#64592
This adds a new compilation error if someone attempts to put legacy animations and `animate.enter` or `animate.leave` in the same component.
PR Close#64569
Fixes a bug in the missingStructuralDirective diagnostic where structural directives with missing imports were not reported when the element using the structural directive contained other directives
Fixes#64467
co-authored-by: Matt Lewis <npm@mattlewis.me>
PR Close#64579
The `requireSynchronousElementRemoval` property was not being passed in all the locations it was needed. This was preventing leave animation timing from behaving properly in some cases.
fixes: #64525
PR Close#64565
Prior to this change, `FieldState` defined a signal for each built-in
property. This unfortunately meant that the `Field` directive had no way
of knowing which property had actually been defined in the schema, and
would thus attempt to propagate them all to the bound form control. This
meant that the default values of these signals would override the
default or template defined values of these control properties.
Now these properties are `undefined` by default, and only initialized if
defined in the schema. Thus the `Field` directive will not attempt to
bind any properties that aren't explicitly managed by the schema.
PR Close#64446
Note that unlike the other built-in properties, `pattern` is not
propagated to native controls so the lack of symmetry with other
property tests is intentional.
PR Close#64446
In certain scenarios `Element.animate` fails, manifesting in an exception (Firefox)
or a null return value (Chromium). The null value is not conform WebIDL but handled
gracefully in this commit regardless.
Closes#64486
PR Close#64506
Updates the selector for `RouterOutlet` to allow for it to be set on an `ng-container`. This allows it to not render the host node which can affect the layout.
Fixes#64553.
PR Close#64562
Previously, query parameters passed to `router.createUrlTree` were simply converted to strings. This meant that any custom serialization logic in a custom `UrlSerializer` was not applied. This could lead to inconsistencies between navigations triggered from the URL bar (which are parsed by the serializer) and navigations triggered programmatically.
This change ensures that query parameters are normalized using the provided `UrlSerializer`. The values are serialized and then parsed to ensure they are in the same format as if they had come from a URL. This allows custom serializers to handle complex objects in query parameters consistently.
Fixes https://github.com/angular/angular/issues/47307
PR Close#64449
Currently it's easy to make a mistake when accessing properties on `SimpleChanges`, because the keys aren't typed. These changes add an optional generic to the interface so that users can get a compilation error if they make a typo.
A few things to note:
1. The generic argument is optional and we revert to the old behavior if one isn't passed for backwards compatibility.
2. All of the keys are optional, because they aren't guaranteed to be present for any `ngOnChanges` invocation.
3. We unwrap the values of input signals to match the behavior at runtime.
Fixes#17560.
PR Close#64535
This change omits the injection of the template syntaxes inside any
existing block scope. The injection is not needed because the template
and expression scopes are included explicitly as patterns where
appropriate under the template-blocks definitions.
This change prevents the interpolation curly braces from superseding the
match for the open curly of the block body. This issue also happens with
ICUs (#62697), but those do not have any named scopes to exclude as of
today.
fixes https://github.com/angular/vscode-ng-language-service/issues/1991
PR Close#64392
This further simplifies the `loadComponent` logic in the Router by using
the promise returned from the config loader directly instead of
converting it to an observable.
PR Close#64450
These methods are only intended to be used internally within framework
instructions. Prefix them with `ɵ` to indicate that they are
framework-private and should not be called from user code.
PR Close#64471
Add support for interoperability between signal forms and reactive forms that
commit effccffde0 had removed.
A signal forms field can once again be bound to any element or component with a
`ControlValueAccessor`.
PR Close#64471
From my investigation what I know for sure:
- when the graph pans or zooms it updates the transform property on the g element, which in turn causes the browser to repaint the visible space in the g element
- stroke-dasharray is the cause of major performance issues in large graphs.
What I suspect:
- When the g element repaints, it also has to repaint all of the child svg elements. When the dashed line path svgs repaint, the stroke-dasharray calculation is not GPU accelerated, but instead occurs on the CPU, causing extreme lag whenever the svg graph is panned or zoomed.
Temporary solution: remove this dashed edge functionality. We can investigate alternatives for communicated that a path is lazy loaded.
Future long term solution: migrate to canvas based graph renderer for router tree and injector graph.
PR Close#64532
Fixes a bug in the missingStructuralDirective diagnostic where structural directives with missing imports were not reported when the element using the structural directive contained other directives
Fixes#64467
PR Close#64470
The existing implementation of `PlatformLocation` uses a custom URL parsing mechanism that can be brittle and doesn't properly update the `href` property. This change refactors the URL parsing to use the native `URL` constructor, providing more robust and accurate parsing of URLs, which also correctly updates the `href` property.
The tests for `PlatformLocation` have also been moved to a dedicated file to improve organization and clarity.
PR Close#64494
This further simplifies the `loadComponent` logic in the Router by using
the promise returned from the config loader directly instead of
converting it to an observable.
PR Close#64450
Previously, query parameters passed to `router.createUrlTree` were simply converted to strings. This meant that any custom serialization logic in a custom `UrlSerializer` was not applied. This could lead to inconsistencies between navigations triggered from the URL bar (which are parsed by the serializer) and navigations triggered programmatically.
This change ensures that query parameters are normalized using the provided `UrlSerializer`. The values are serialized and then parsed to ensure they are in the same format as if they had come from a URL. This allows custom serializers to handle complex objects in query parameters consistently.
Fixes https://github.com/angular/angular/issues/47307
PR Close#64449
Ensures the repository reference uses the correct name to prevent confusion and maintain consistency across generated documentation entries.
PR Close#64487
Removes a number of commit message scopes that are no longer in use.
- `bazel`: Now part of `dev-infra`
- `changelog`: The changelog is autogenerated and doesn't have dedicated commits.
- `packaging`: Is handled by `dev-infra` as well.
PR Close#64492
In some rare cases, it seems the animation queue disappears despite being afterEveryRender. This updates the animation scheduler to be afterNextRender instead and only schedules it when we need to.
fixes: #64423
PR Close#64441
Improves user experience by displaying UI notifications when attempting to view source for unsupported routes, replacing developer-only console warnings with visible snackbars
PR Close#64458
Introduces a migration that replaces CommonModule usage with individual imports from @angular/common, aligning with Angular's standalone component approach and improving module import clarity
PR Close#64138
This fixes a performance regression from #63754, which is almost a revert of the
prior performance fix in #57291; the latter was provided as quick fix to address
the severe performance overhead this extended diagnostic used to have, with #57337
as follow-up change to address the false negatives that were introduced in #57291.
That follow-up never landed, though, so this commit is re-applying the changes
from #57337 to fix the performance regression.
Fixes#64403
PR Close#64410
When adding and removing items in a `@for` loop, the `animate.leave` event binding instruction was not updated to use the same logic as the class function when the animation queue was added. We were not returning the correct signature for the `animate.leave` function, which caused the animation to not trigger correctly. This updates the event binding instruction to use the same logic as the class function when adding the animation to the queue.
fixes: #64336
PR Close#64413
This replaces the error we were throwing before the change. This allows component with defer triggerrs to be used on both SSR'd and CSR.
fixes#64184
PR Close#64185
In some cases, the leave animation stylesheets were getting pruned too early due to the renderer removal happening before the animation function was run. This ensures that while queuing a leave animation, we guarantee the lView is referenced in the leaving animations set. This guarantees the style sheet pruning knows about the animations existing and skips the prune step.
fixes: #64326
PR Close#64335
When a directive injects a `ViewContainerRef`, the runtime inserts a container that was throwing off the logic that recognizes native controls.
These changes switch to check if the node is a native control through the `TNode`. This also makes it a bit less prone to breaking during SSR.
Fixes#64362.
PR Close#64368
This commit adds `applicationProviders` to the `bootstrapModule` options
object. This allows specifying additional providers at the location of
bootstrap, which makes default providers much easier to accomplish.
Using this, we can refine the approach taken for downgrade_module to use
this more direct API rather than the additional provider variable dance.
PR Close#64354
This fixes the code to retain ZoneJS by default in the providers for
downgradeModule when the `bootstrapModule` is used. Prior to this
change, the async `bootstrapModule`/`compileNgModuleFactory` could be
called multiple times through `downgradeModule` before
`bootstrapModuleFactory` got called and used the zone providers.
Note: marked refactor since this only applies to the -next release and
we shouldn't have this change in the changelog as a fix.
PR Close#64354
Caches information about the kind of form control that a `TNode`
represents in `TNodeFlags`. This avoids redundant computations on
subsequent template create and update passes.
Renames the `INVALID_CONTROL_HOST` error code to
`INVALID_FIELD_DIRECTIVE_HOST` for clarity and adds a test for it.
PR Close#64351
Warns when @defer blocks define unreachable or redundant triggers, such as multiple main triggers, ineffective prefetches, or timer delays not scheduled before rendering.
PR Close#64069
Replaces inline comments with structured Before and After sections
to enhance readability and consistency. This helps developers better
understand the transformation from non-self-closing to self-closing
tags during migration.
PR Close#64388
Adds support for the `referrerPolicy` option in `HttpResource`, allowing developers to control how much referrer information is sent with each HTTP request.
PR Close#64283
This simplifies code by using async/await instead of rxjs in the config
loading internals. While loadChildren/loadComponent could _technically_
return a synchronous value, the expectation is that this would be used
for dynamic imports, which are necessarily async.
PR Close#64322
Renames the control directive and the input that users set to bind a
field to a UI control.
Previously users would do:
```
<input [control]="someField">
```
Now users will do:
```
<input [filed]="someField">
```
PR Close#64300
When the migration command was run for inputs, if the input had more than one reference in a method the migration would generate incorrect code
Fixes#63018
PR Close#64367
Replaces old deep-linked MDN tutorial URLs with top-level documentation
links for JavaScript, HTML, and CSS to provide more general and reliable references.
PR Close#64383
Updated examples to align with the latest Angular style:
- Removed `standalone: false` since it is unnecessary.
- Dropped module-based implementation in favor of standalone.
PR Close#64167
This commit updates the scripts to use the version from `package.json` for snapshot builds, ensuring that the git tags are aligned with the package version. This change simplifies referencing snapshot builds in the `package.json` file.
PR Close#64350
This commit introduces a mechanism to use snapshot builds for @angular/language-service dependencies when building the VSCode extension.
A new --//:enable_snapshot_repo_deps flag allows swapping the stable versioned dependency with a snapshot build from the angular/language-server-builds GitHub repository. This enables testing and development against the latest unreleased version of the language service.
PR Close#64334
Previously, the example returned a plain value instead of an object,
causing destructuring in the `stream` function to fail. Updated to
`params: () => ({ userId: this.userId() })` for correctness.
fixes: #64313
Update adev/src/content/ecosystem/rxjs-interop/signals-interop.md
Co-authored-by: Matthieu Riegler <kyro38@gmail.com>
PR Close#64327
Adding some typing to infer the expected types and drop the usages of `arguments` which isn't really typesafe.
The argument mis-match didn't result in an issue because they didn't end up being used futher down the line.
fix 63973
PR Close#64260
When the scroll position is being restored, this change upates the
behavior to use 'instant' rather than the default 'auto', which will
be whatever the browser behavior is for 'window.scrollTo'. The 'smooth'
behavior does not match how browsers behavior when performing a
traversal navigation for MPAs, which is 'instant'.
related to #58258
PR Close#64299
The `xvfb.start()` and `xvfb.stop()` methods are asynchronous but were being called synchronously. This can lead to race conditions where the tests start running before the virtual frame buffer is fully initialized, or the process exits before it's fully stopped.
This commit promisifies the `start` and `stop` methods to ensure they are properly awaited, making the e2e test setup more robust.
PR Close#64310
Currently if `TestBed.overrideComponent` is used on a class that uses initializer APIs (e.g. `input()`), the initializer metadata will be wiped out, because `overrideComponent` re-compiles the class with the information set by `setClassMetadata`. `setClassMetadata` only captures decorated members at the moment.
These changes introduce some logic to capture the new initializer-based APIs in `setClassMetadata` as well.
Fixes#57944.
PR Close#63957
Reworks the logic that tracks the decorator metadata for members to do so using the output AST, rather than wrapping the TypeScript AST. This makes it easier to programmatically generate new members that weren't part of the TypeScript AST before.
PR Close#63957
This commit migrates the vscode-ng-language-service to use the in-repo `ts_project` macro, which has strict dependency checking enabled. This improves build-time dependency validation and helps ensure that all dependencies are explicitly declared.
As part of this change, redundant `tsconfig.json` files have been removed in favor of a centralized configuration, and `jasmine_test` rules have been updated to the standard macro. A minor code adjustment in `server/src/session.ts` was also made to improve error handling.
PR Close#64306
This change updates the build configuration to include the
@angular/language-server package in the standard framework release
output.
By integrating it into the release train, we ensure that it is versioned and published consistently with the rest of the Angular framework.
PR Close#64306
This commit updates the VSCode Angular Language Service extension to use the `@angular/language-service` package built from source within the workspace, rather than a version downloaded from npm.
This change simplifies development and testing by ensuring the extension always uses the latest code from the local repository. The Bazel build configuration, VSCode launch settings, and e2e tests have been updated to reflect this change.
PR Close#64306
The `@angular/language-service` package was not needed for integration tests or benchmarks. Removing this dependency simplifies the build configuration.
PR Close#64306
Adds support for customizing the `IntersectionObserver` options for the `on viewport`, `prefetch on viewport` and `hydrate on viewport` triggers.
Note that the options need to be a static object literal, e.g. `@defer (on viewport(trigger, {rootMargin: '123px'})`.
Fixes#52799.
PR Close#64130
Currently we produce the string value of a defer `on` trigger by concatenating the string values of all of its tokens. This ends up ignoring whitespaces which in turn throws off source spans.
These changes switch to producing the string by taking the text between the start and end tokens, as well as tracking the start index.
PR Close#64130
Set `pointer-events` of the `iframe` to `none` while dragging. This should stop the events context interference and make resizing of the panel easier.
PR Close#64307
I've updated the test to assert what I believe it was trying to assert
before. Without this change, the CSS is invalid so it's unclear what
behavior we're demonstrating.
PR Close#64036
Fix a bug where the min property of a form field was not correctly
propagated to custom controls. Also ensure that min and max are only
bound to native input elements that support them.
PR Close#63884
Fix several typos caught by the added test cases:
* `disabled` attribute for native controls
* `readonly` property for custom controls
Note that the `name` test cases have been marked `pending()` due to
https://github.com/angular/angular/issues/63882.
PR Close#63884
The legacy `workspace` integration test asset folder has been removed as it was unused and no longer representative of modern Angular CLI workspaces.
In line with this cleanup, the Bazel dependency definitions for the integration tests have been reorganized. Runtime data dependencies have been moved from the `js_test` rules to the `data` attribute of their corresponding `ts_project` rules. This is a cleaner and more appropriate approach as it co-locates a test's runtime data dependencies with its source code definition, making the relationship between the code and its required assets more explicit and improving the overall maintainability of the build configuration.
PR Close#64271
Introduces a referrer policy option for HTTP requests to allow specifying the referrer information sent, improving privacy and security controls.
PR Close#64116
The repository URL in `package.json` is updated to point to the `angular/angular` monorepo. This ensures that the package metadata correctly reflects its location within the main repository.
PR Close#64220
The supported Node.js versions for the language service server are updated to align with the versions supported by Angular. This ensures a consistent and stable environment for developers.
PR Close#64220
This commit revamps the debugging setup and enabling developers to set breakpoints directly in the source TypeScript files.
Key changes include:
- Updated `launch.json` with source map path overrides to correctly map compiled output back to the original source code.
- Switched from `external` to `linked` sourcemaps in the Bazel build configuration for better debugging support.
- Consolidated the recommended VSCode settings into the main `launch.json` and `tasks.json`, removing the separate `recommended-*.json` files.
- Updated the debugging documentation to reflect the new, simplified workflow.
These changes significantly improve the developer experience for contributors working on the language service, making it much easier to debug and troubleshoot issues.
This applies to both the framework packages and vscode-ng-langugage-service.
PR Close#64220
This commit refactors the VSCode extension's build and launch configurations to align with `vsce` and `pnpm` workspaces.
The following changes are included:
- Updated `.vscode/launch.json` to use new `vsce:` prefixed tasks and simplified launch configurations.
- Updated `.vscode/tasks.json` to use `pnpm` workspace commands for watching and packaging the extension.
- Adjusted `BUILD.bazel` and `package.json` files to reflect the new build output paths.
These changes streamline the development workflow for the VSCode extension, making it easier to build, debug, and package.
PR Close#64220
Previously, the router tree would not properly clean up css classes placed on nodes which would lead to some nodes being incorrectly visualized after each update.
PR Close#63979
Our code ensuring host binding composition for animations was causing the early exit and removal of
elements when multiple transitions were present on the same element. This commit fixes the issue by
ensuring that we properly keep track of all the promise resolvers on the LView and then only
call them once we've properly waited for the longest animation to finish.
fixes: #64209
PR Close#64225
There may be cases where the longest animation info has been cleaned up before the end animation fires. We should still do the end processing in that case.
PR Close#64225
These tests were not properly validating against the host binding changes due to the fact that the styles were on the wrong components in some of the host binding cases.
PR Close#64225
Use `implements ErrorHandler` instead of extending the base class to follow Angular
conventions. Marked injected dependencies as `readonly`, made `openErrorSnackBar`
private, and improved overall code consistency.
PR Close#64237
Now that the control flow migration is running as a part of `ng update`, we need to be a bit forgiving about there not being any matching files since it can break the entire update process.
These changes switch the error to a warning and it counts the files for the entire workspace, not the individual projects.
PR Close#64253
Caches the downloaded vscode binary in the CI workflows to speed up the e2e tests for the vscode extension. This avoids downloading vscode on every CI run.
PR Close#64219
Previously this would take ~3500ms adev.
This updated logic avoids the constant JSON.stringify implementation and instead checks for serializable values directly.
After this change this code path for adev takes less than 20ms.
(Benchmarks taken on an M1 Macbook Pro)
PR Close#64234
Move most of the implementation of the `Control` directive into core
framework instructions. This allows field state changes to be propagated
to their corresponding UI controls directly during execution of a
template update block, instead of relying on `effect()`s to synchronize
each change later during the update (and too late in the case of
required inputs).
* Define a private API in `@angular/core` for signal forms to implement:
* `ɵControl` for the `Control` directive.
* `ɵFieldState` for the control's associated `FieldState`.
* Emit specialized instructions when compiling a `[control]` binding:
* `ɵɵcontrolCreate` sets up the `ɵControl` directive if present,
determines whether it's bound to a native control element or a
custom control component, and adds the appropriate event listeners
to notify the `ɵFieldState` of UI changes.
* `ɵɵcontrol` propagates changes from `ɵFieldState` properties to their
corresponding UI control properties (in additional to binding the `control`
property itself).
PR Close#63773
* Emit a `ɵɵcontrol` instruction in place of `ɵɵproperty` for property
bindings named "control". This instruction cannot be chained, but is
otherwise functionally equivalent.
* Upcoming changes will use the `ɵɵcontrol` instruction to bind a signal
form field to a UI control (be it a native element or custom directive).
PR Close#63773
There was a bug in the logic for checking if a leave animation exists for a node. This was affecting timing of nodes with enter animations.
PR Close#64226
There are two primary reasons for this renaming:
1. It better reflects the actual nature of the proxy object, namely that
the form is represented as a tree, and that this object is used for
navigating the tree structure (while `FieldState` is used for getting
the state at a particular point in the structure).
2. This frees up the name `Field` to be used for the directive that
binds a `FieldTree` to a UI control.
PR Close#64214
This commit updates the internal transition to handle context retention
through the abort function. This retention chain included the
previousNavigation and setting this to a noop function resolves the
issue.
fixes#63983
PR Close#64141
Ensures that file names remain visible even if the associated code block
is collapsed or hidden, improving readability and context in the docs.
PR Close#64204
Content Projected nodes are not destroyed and recreated, like every other
situation. Enter and Leave animations were ephemeral and are
expected to run once, and then be cleared. This means that for content projection
cases, the animations would only ever work the first time they were shown / hid.
In order to resolve this, we move to an animation queue that re-runs the animation
functions stored in the LView. In most cases, this animation will run once on creation.
For content projection, the enter and leave animations will fire more than once. Animations
are stored on the LView, but indexed and scheduled by whichever RNode needs to be animated.
So we only run animations for an affected RNode, rather than potentially all in the LView.
This also moves the queue to afterRender, which is safer than right after template
execution in refreshView.
fixes: #63418fixes: #64065fixes: #63901
PR Close#63776
Improve error handling when `rawDelays` contains fewer items than `transitionedProperties`, preventing a toLowerCase of undefined error in `parseCssTimeUnitsToMs`.
PR Close#64181
Since HTTP/2, responses no longer contain a status text besides the status code, which caused our default value of 'OK' to be used in HttpErrorResponse.message.
DEPRECATED: `HttpResponseBase.statusText` is deprecated
PR Close#64176
Stop multiple component tree traversals if the app root is the body tag. This caused the devtools ui to duplicate the component information, if the app root was the body tag
PR Close#64161
BREAKING CHANGE: Fix signal input getter behavior in custom elements.
Before this change, signal inputs in custom elements required function calls to access their values (`elementRef.newInput()`), while decorator inputs were accessed directly (`elementRef.oldInput`). This inconsistency caused confusion and typing difficulties.
The getter behavior has been standardized so signal inputs can now be accessed directly, matching the behavior of decorator inputs:
Before:
- Decorator Input: `elementRef.oldInput`
- Signal Input: `elementRef.newInput()`
After:
- Decorator Input: `elementRef.oldInput`
- Signal Input: `elementRef.newInput`
closes#62097
PR Close#62113
Removed `standalone: true` since it is now the default
and no longer necessary.
refactor(common): update ngComponentOutlet and ngTemplateOutlet examples and remove redundant standalone flag
Removed `standalone: true` since it is now the default
and no longer necessary.
PR Close#64155
The Angular Package Format has been updated to group all TypeScript declaration files (`.d.ts`) under a single `types/` directory within the package. Previously, these files were located at the package root or within entry-point specific directories.
This commit updates the APF documentation to reflect this new structure, including:
- The example file layout.
- The file purpose description table.
- The `package.json` exports field example.
- The legacy typings field example.
This brings the documentation in line with the current package structure, providing accurate guidance for library authors and tool developers.
PR Close#64168
Content Projected nodes are not destroyed and recreated, like every other
situation. Enter and Leave animations were ephemeral and are
expected to run once, and then be cleared. This means that for content projection
cases, the animations would only ever work the first time they were shown / hid.
In order to resolve this, we move to an animation queue that re-runs the animation
functions stored in the LView. In most cases, this animation will run once on creation.
For content projection, the enter and leave animations will fire more than once. Animations
are stored on the LView, but indexed and scheduled by whichever RNode needs to be animated.
So we only run animations for an affected RNode, rather than potentially all in the LView.
This also moves the queue to afterRender, which is safer than right after template
execution in refreshView.
fixes: #63418fixes: #64065fixes: #63901
PR Close#63776
Fixes two issues that were preventing template literals from being recovered properly if one of the interpolated expressions is broken:
1. We weren't updating the expected brace counter when an interpolation starts which in turn was throwing off the recovery logic in `skip`.
2. When producing tokens for template literals, we were treating the closing brace as an operator whereas other places treat it as a character. Even after fixing the first issue, this was preventing the recovery logic from working correctly.
Fixes#63940.
PR Close#64150
Prevents migration of @input() properties that contain references to 'this' in their initializer functions. This ensures that functions accessing class members via 'this' remain unchanged, preventing potential build errors.
PR Close#64142
Updated pipe examples to explicitly import the pipe for clarity and
correctness. Also removed `standalone: true` since it is now the default
and no longer necessary.
PR Close#64135
The VS Code extension build is failing due to some dependency issues. This commit updates the dependencies and build configuration to fix the build.
- Update `pnpm-lock.yaml` to reflect the dependency changes.
- Update `BUILD.bazel` files to adjust the external dependencies for `esbuild` and to correctly package the VSIX file.
PR Close#64154
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
Some properties (like gets) might throw when we try to read them.
With this commit we fail gracefuly and show a warning message for the property that can't be read.
fixes#56755
PR Close#64096
The paths for `pre_apf_project` and `pre_standalone_project` in the renovate configuration were missing the `package.json` suffix. This resulted in renovate not being able to find and disable updates for these projects as intended.
This commit corrects the paths to include `package.json`.
PR Close#64102
The language service integration tests were modifying files in the source tree, which made them flaky and non-hermetic. This also required the tests to be run with `no-remote-exec` and `no-sandbox` tags in Bazel.
This commit refactors the tests to copy the test projects to a temporary directory before running the tests. This makes the tests more robust, isolated, and allows them to be run remotely and in a sandbox.
Additionally, dependencies for the `pre_apf_project` and `pre_standalone_project` test fixtures have been reverted to older Angular versions. This is to ensure we are correctly testing against legacy project setups as was originally intended.
PR Close#64098
The lsp integration tests had a circular dependency with other integration tests, which made the build setup complex and fragile. This was previously handled by using 'copy_to_bin', which is not ideal as it hides the true dependency graph.
This commit refactors the build configuration to break this cycle by introducing a dedicated 'ts_project' for the lsp tests with its own 'tsconfig.json'. This change simplifies the build logic and makes dependencies explicit.
PR Close#64091
The event listeners for animationstart and animationend weren't properly checking whether the animation event fired matched the node we're bound to, since animation events bubble. This resulted in child node animation events bubbling up and causing elements to get prematurely removed.
fixes: #64084
PR Close#64088
The lsp integration test is flaky and can fail intermittently. This change marks the test as `flaky = True` to prevent it from failing the build.
Additionally, the `no-remote` tag is updated to `no-remote-exec`. The former disables remote caching, while the test can still benefit from it.
PR Close#64085
This commit configures the Bazel RBE setup action to use the 'RBE_TRUSTED_BUILDS_USER' secret for authentication. This is necessary to ensure that the CI can properly connect to the remote build execution environment.
PR Close#64070
`git config` only lists the configured value, but `git remote get-url` actually resolves the URL and is more stable.
I had a local configuration which aliased `gh:` to the appropriate GitHub URL:
```
[url "git@github.com:"]
insteadOf = "gh:"
pushInsteadOf = "git@github.com"
```
In this scenario, `git config` returns `gh:dgp1130/angular`, but `git remote get-url` returns `git@github.com:dgp1130/angular`, which is what the subsequent regex expects.
PR Close#64062
This commit updates several dependencies to their latest versions and adjusts the build configurations accordingly.
Key changes include:
- Upgraded various development and runtime dependencies.
- Removed outdated jasmine test runner configuration.
- Updated Bazel build files to align with new dependency structures.
Some dependencies like `vscode-language*` have been added to Renovate's ignore list as they require a more significant refactoring effort that is planned for a future update.
PR Close#64073
The control flow migration was incorrectly removing `ng-template` elements in scenarios where they were referenced by multiple `*ngIf` directives' `else` clauses and also used independently via `ngTemplateOutlet`.
PR Close#63996
When `noUncheckedIndexedAccess` is not enabled, indexed accesses do not include `undefined` in the type.
This makes the OptionalChainNotNullableCheck inconvenient when wanting to safe guard an indexed access (and when the typings isn't helping you).
Ideally project should enable `noUncheckedIndexedAccess` for better typesafety, but this is often inconveninent (we do not enable it by default) and often not the resort of the developer.
So more better coding convinience, `OptionalChainNotNullableCheck` will not raise an error/warning on indexed Acessed followed by an optional chaining when `noUncheckedIndexedAccess` is not enabled.
See also #63809 which will detect more cases
PR Close#64007
Previously we would visualize route config "types" by colouring different nodes.
Now the we only colour nodes to represent the active route path. Lazy loaded routes are represented with dashed line edges that point in the direction of loading.
PR Close#63980
This commit changes `Resource.hasValue()` and its derived types to improve narrowing
of resources whose generic type either does not include `undefined` (i.e. when a default
value has been provided) or when the generic type is `unknown`. This fixes the undesirable
behavior where `hasValue()` would cause the `else` branch of an `hasValue()` conditional
to have a narrowed type of `never`, given that the `hasValue()`'s type guard covers the
entire type range already (meaning that the type in the else-branch cannot be inhabited
in the type system, yielding the `never` type).
By making the `hasValue()` method only a type guard when the generic type includes `undefined`
these problems are avoided.
Fixes#60766Fixes#63545Fixes#63982
PR Close#63994
Fixes an error where using an alias in a defer block caused the compiler CLI to fail when parsing. The resolution logic in ComponentDecoratorHandler was updated to correctly handle deferred dependencies with aliased imports.
PR Close#63966
Since those are top level APIs, `ngDevMode` might not be available at runtime if they're invoked before the variable is set.
fixes#62796
PR Close#63875
This adds an optional flag to the renderer on `removeChild` called `requireSynchronousElementRemoval`, which can tell any downstream renderer that elements need to be removed synchronously. This gets passed down to the legacy animation renderer to ensure that any elements that set this flag aren't impacted by that renderers changes to timing.
fixes: #63893
PR Close#63921
An invalid APP_ID could be responsible to generating broken CSS selectors. (eg `:` is an example for a character that breaks a selector by being a separator for pseudo-selectors.)
We now throw an error if the provided value is not alphanumerical
PR Close#63252
https://github.com/angular/angular/pull/62630 made it so that all ARIA
property bindings would write to their corresponding attribute instead.
The primary motivation for this change was to ensure that ARIA
attributes were always rendered correctly on the server, where the
emulated DOM may not correctly reflect ARIA properties as attributes.
Furthermore, this change added support for binding to ARIA attributes
using the property binding syntax (e.g. `[aria-label]`).
Unfortunately, https://github.com/angular/angular/pull/62630 relied on
the incorrect assumptions that an ARIA property name could be converted
to its attribute name (without hardcoding the conversion), and that the
value of an ARIA property matched its corresponding attribute. For
example, the `ariaLabelledByElements` property's value is an array of
DOM elements, while the corresponding `aria-labelledby` attribute's
value is a string containing the IDs of the DOM elements.
This partially reverts https://github.com/angular/angular/pull/62630 so
that only property bindings with ARIA attribute names (begin with
`aria-`) are converted to attribute bindings.
* `[ariaLabel]` will revert to binding to the `ariaLabel` property.
* `[aria-label]` will continue binding to the `aria-label` attribute.
Note the only difference between `[aria-label]` and `[attr.aria-label]`
is that the former will attempt to bind to inputs of the same name while
the latter will not.
PR Close#63925
Fixes a bug in the standalone migration where 2 imported modules have the same class name but 1 is imported with an alias and would not be added to the component imports array when migrating
Fixes#63913
PR Close#63934
During a previous PR review, it was noted that the `next` tag was causing confusion. This commit updates the dependencies for the integration tests to resolve this ambiguity and ensure clarity going forward.
Additionally, this change uses the `link:` protocol to ensure that `pnpm i` does not fail when lockfiles or dependencies are updated outside of Bazel.
PR Close#63937
This commit introduces several optimizations to the adev CI workflows:
- The adev preview build now uses a more powerful runner and creates a production build.
- Remote execution is disabled for adev builds to improve performance.
Note: Bazel cache is still being used, and the built times are reduces by about 10mins when the cache is missed.
PR Close#63941
Currently if `TestBed.overrideComponent` is used on a class that uses initializer APIs (e.g. `input()`), the initializer metadata will be wiped out, because `overrideComponent` re-compiles the class with the information set by `setClassMetadata`. `setClassMetadata` only captures decorated members at the moment.
These changes introduce some logic to capture the new initializer-based APIs in `setClassMetadata` as well.
Fixes#57944.
PR Close#63904
Reworks the logic that tracks the decorator metadata for members to do so using the output AST, rather than wrapping the TypeScript AST. This makes it easier to programmatically generate new members that weren't part of the TypeScript AST before.
PR Close#63904
This commit removes Yarn as a package manager for integration tests and migrates to pnpm. This change aims to standardize package management across the project, leveraging pnpm's efficiency and consistent behavior for dependency resolution and installation.
PR Close#63902
This removes the Zone providers from the `BrowserTestingModule`. These
already exist by default in all other entrypoints to Angular
environments (TestBed compiler, bootstrapModule, and createApplication).
PR Close#63872
Previously, HOST_TAG_NAME had its __NG_ELEMENT_ID__ set at the top level. This
prevented tree-shaking, since the bundler had to keep the assignment as a
potential side effect even when the token was never used.
This change moves the token creation and __NG_ELEMENT_ID__ assignment into a
@__PURE__ IIFE. If HOST_TAG_NAME is not injected anywhere, the IIFE result is
unused and can be dropped entirely by the optimizer. If it is used, the token
still behaves the same at runtime.
PR Close#63861
Prior to this change the template type-check generator would incorrectly apply inputs
and attributes to a structural directive, where only the bindings as present in microsyntax
are actually bound to the directive. This introduced a problem where usages of template
variables could not be resolved, because the template variables are out-of-scope of the
template element itself.
Closes#49931
PR Close#52453
pnpm v10.17.0 adds support for wildcards in 'minimumReleaseAgeExclude'. This simplifies the configuration by allowing the use of '@angular-devkit/*' and '@angular/*' instead of listing each package individually.
PR Close#63870
This change configures pnpm's `minimumReleaseAge` setting to 1 day (1440 minutes). This is a security measure to mitigate dependency chain attacks, where malicious actors publish a new version of a dependency with malicious code and then trick users into updating to it before it can be discovered and reported.
By delaying the adoption of new releases, we reduce the window of opportunity for such attacks. The list of excluded packages contains trusted and frequently updated dependencies from the Angular team, which are considered safe to use without this delay.
PR Close#63862
The zoneless scheduler is always enabled, so if hydration works with zoneless, it works
for all Angular apps. There is no need for detection of custom zone implementations
PR Close#63847
Previously we used a configuration flag for adev, instead we now separate into two different targets since our flag didn't
need to cause a full reanalysis to run since everything before the final target should be a cache hit.
PR Close#63845
This commit drops special-case handling for old-style "zoneless" that
would disable the internal scheduler when zoneless was not explicitly
enabled but Zone was not defined. This scheduler is now enabled in _all_
applications, providing consistent expectations for developers.
BREAKING CHANGE: Using a combination of `provideZoneChangeDetection`
while also removing ZoneJS polyfills will no longer result in the
internal scheduler being disabled. All Angular applications now
consistenly use the same scheduler, and those with the Zone change detection
provider include additional automatic scheduling behaviors based on
NgZone stabilization.
PR Close#63846
This makes the zoneless-by-default change a flag flip that can be
individually enabled in tests, createApplication, and bootstrapModule
for gradual rollout. In addition, the "require on CD provider" check is
also made individually flippable for gradual rollout.
PR Close#63382
This change removes the internally provided `ZoneJS`-based change
detection scheduler. This makes Angular Zoneless by default and allows
tree-shaking of the Zone change detection providers.
BREAKING CHANGE: Angular no longer provides a change detection scheduler
for ZoneJS-based change detection by default. Add
`provideZoneChangeDetection` to the providers of your
`bootstrapApplication` function or your `AppModule` (if using
`bootstrapModule`). This provider addition will be covered by an
automated migration.
PR Close#63382
Non-typed `transform` functions were stripped by the migration prior to this commit (while still logging an error).
This behavior will now only happen with `--best-effort`.
#63541
PR Close#63547
In production builds, `ngDevMode` is replaced with `false`, so the guard compiles to `return;`. However, bundlers like ESBuild still keep the remaining statements after the return as unreachable code instead of removing them. This leaves behind unnecessary dead code in the output.
Technically, the body is unreachable. But to prove that, the bundler must be 100% certain that:
- `return` cannot be removed by some transform
- there's no later transformation that changes control flow
As thus, it's always conservative.
This also allows dropping `assertDefined`, which was previously
referenced only inside `prependTokenToDependencyPath`. With the
function now fully inlined and dev-only, `assertDefined` is also
eliminated from production builds, further reducing bundle size.
PR Close#63354
Copy-pasting commands like `$ pnpm lint` caused errors in shells (e.g. zsh). Updated docs to use `pnpm lint` directly so they run without modification.
PR Close#63795
To avoid the need for specifying `provideZoneChangeDetection` in any/all
modules used with `downgradedModule`, this change adds the zone-based change detection
providers by default. This also adds the zone providers to
`UpgradeModule` by default as well.
PR Close#63814
To avoid the need for specifying `provideZoneChangeDetection` in any/all
modules used with `downgradedModule`, this change adds the zone-based change detection
providers by default.
PR Close#63814
To avoid the need for specifying `provideZoneChangeDetection` in any/all
modules used with `downgradedModule`, this change adds the zone-based change detection
providers by default.
PR Close#63814
The `checkNoChanges` method previously used an early-return guard:
if (!ngDevMode) return;
// dev-only code ...
In production builds, `ngDevMode` is replaced with `false`, so the
guard compiles to `return;`. However, bundlers like ESBuild
still keep the remaining statements after the return as unreachable
code instead of removing them. This leaves behind unnecessary dead
code in the output.
This commit updates the method to instead wrap the full body:
if (ngDevMode) {
// dev-only code ...
}
With this change, the method collapses to an empty function in
production builds:
checkNoChanges() {}
This ensures that the dev-only logic and its dependencies
(e.g. `checkNoChangesInternal`, `UseExhaustiveCheckNoChanges`) can be
fully tree-shaken, reducing bundle size.
PR Close#63387
This option was deprecated by #55778.
BREAKING CHANGE: The `interpolation` option on Components has been removed. Only the default `{{ ... }}` is now supported.
PR Close#63474
The diagnostic will raise an error when required initializers (input, model, queries) are invoked the context of property initializers and contructors.
Docs will be provided in a follow-up
fixes#63602
PR Close#63614
The diagnostic that flags signals which haven't been invoked has some logic to skip over inputs, however it was looking at the used directives across the entire template, not the ones on the specific node.
Fixes#63739.
PR Close#63754
This change updates the Gemini model version from 2.0 Flash to 2.5 Flash on the AI overview page to align with the official Genkit documentation.
The source documentation at https://genkit.dev/docs/frameworks/angular/ has been updated, and this commit ensures our documentation reflects that change accurately.
PR Close#63800
The contribution guide is updated to provide clearer instructions on when to use the `docs-infra` scope versus the `docs` type.
This change helps contributors understand that `docs-infra` should only be used for infrastructure-related changes (application code, tooling, configuration) within the `/adev` directory. For simple content modifications, such as editing a `.md` file, `docs` without a scope is the correct choice.
PR Close#63799
This is a pure re-organization of the animations code. No functionality changes, but it should be easier to navigate now. Utility classes have been moved to a `utils.ts` file. The related functions in the instructions have been grouped closer together.
PR Close#63775
Adds the 'target: automation' label to the 'update-cdk-apis' and 'update-cli-help' jobs in the 'update-cdk-apis-and-cli-help.yml' workflow. This will help to better track and manage automation tasks.
PR Close#63753
The logic to update the renovate config during the release to switch the target labels from target: rc to target: patch has been removed. Instead, a static target: automation label is added to the default renovate preset.
PR Close#63752
When a user has `animate.leave` on a list of items in a `@for`, but are only showing a subset using a computed, removing the second to last item results in a move operation on the last item. There's no native atomic move API in the browser. So this results in the element being detached and attached at its new index. The detaching of the node resulted in leave animations firing.
This fix addresses this by adding a flag in the `LView[ANIMATIONS]` `AnimationLViewData` interface to allow for skipping animations. During list reconciliation, we set this flag so that the animations are skipped over. The flag is flipped back after the move operation is complete.
There is one complication that results from this. The index adjustment of elements in the list happens synchronously while the leave animation is asynchronous. This results in the leaving item getting shifted to the end of the list. This is not ideal but likely can be addressed in a future refactor.
fixes: #63544
PR Close#63745
Previously we relied on the default port of 4200, but if it was already in use then we would run into issues where the cli provided a prompt which we were unable to respond to. Instead we now request port 0 which will automatically find an available port.
PR Close#63740
Documents how to create custom service worker scripts to handle push notifications, background sync, and other events by importing and extending Angular's default behavior
PR Close#63629
When a new branch is created for a feature, it may not exist in the downstream repo. For example, during an exceptional minor release. In such scenarios, we fallback to the last known branch. This was previously handled in a catch block, but this change makes the fallback more explicit.
PR Close#63733
This makes it possible to batch effects, where we can "reopen" consumers
during initial render and then finalize them after we are finally done
adding all the effects to a batch:
```
function createBatch() {
const effect = // ... create effect node
resetConsumerBeforeComputation(effect);
return effect;
}
// pseudo-code
function appendEffect(effectBatch, updater) {
if (value is a signal) {
const prevConsumer = setActiveConsumer(effectBatch.node);
const output = value();
setActiveConsumer(prevConsumer);
effectBatch.push({ signal, updater });
return output;
}
}
function finalizeBatch(effectBatch) {
if (effectBatch.length > 0) {
finalizeConsumerAfterComputation(effectBatch.node);
}
}
const effectBatch = createBatchEffectNode();
appendEffect(signal1, (newValue) => /* something */);
appendEffect(signal2, (newValue) => /* something different */);
finalizeBatch(effectBatch);
```
PR Close#62549
In the `deploy-docs-site` GitHub action, esbuild fails to resolve `pnpapi` during the bundling process. This is because `pnpapi` is a dependency that is available in the Node.js environment at runtime and should not be bundled.
This commit marks `pnpapi` as an external dependency for esbuild to prevent it from being bundled and resolve the build failure.
```
✘ [ERROR] Could not resolve "pnpapi" [plugin bazel-sandbox]
```
See: https://github.com/angular/angular/pull/63722#issuecomment-3278922553
PR Close#63723
The reviewer note for Firefox addons included a message that was intended for manual releases. This is no longer necessary with the automated release process.
PR Close#63731
Dropping `any` in favor of `Node` for better type safety and clarity.
BREAKING CHANGE: `ngComponentOutletContent` is now of type `Node[][] | undefined` instead of `any[][] | undefined`.
fixes#63538
PR Close#63674
This updates the enter and leave logic to use the stored LView data to dispatch the enter and leave animations at the right points in the lifecycle. This should fix issues with signals not being available yet, parallel animations, and also eliminate the need for the element registry.
fixes: #63391fixes: #63388fixes: #63369
PR Close#63450
In order to point the right context, links in error messages will target the archived version of the online doc site (v*.angular.io).
See #44650
PR Close#63512
In some cases, such as when a new exceptional minor branch is created. The branch may not exist in the downstream repo. For example, during an exceptional minor release (e.g. FW 20.3.x and Components: 20.2.x).
This commit introduces a fallback mechanism to handle such scenarios. If the current branch is not found in the downstream repository, the script will now fall back to the last known branch from the build information. This ensures that the files can be updated properly.
PR Close#63678
This commit introduces a new `pnpm run devtools:release` command to streamline the Angular DevTools release process.
The command automates the entire release workflow, including checking for new commits, updating version numbers, creating a release commit, and guiding the user through the publishing steps for both Chrome and Firefox extensions.
The `devtools/docs/release.md` documentation has been updated to reflect the use of this new command, providing a single entry point for the release process.
A new script `devtools/tools/release.mts` has been added to implement the release logic, and `package.json` has been updated to include the new script.
PR Close#63599
Keep the selected node (component/element) visible when the directive tree component resizes (e.g. signal graph pane becomes visible).
Closes#63670
PR Close#63681
This will allow manually subscribed animation events to still fire when using `animate.leave`. Otherwise they were being cleaned up before the animations happened.
fixes: #63391
PR Close#63414
This updates tests and examples only to prepare for zoneless by default.
These changes were identified and made as part of #63382. Anything that
failed gets `provideZoneChangeDetection` unless the fixes were easily
and quickly determined.
It also adds the zoneless provider to the `initTestEnvironment` calls
for tests in this repo to prevent regressions before #63382 is merged.
PR Close#63668
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
Add some documentation that's mentioned in the material.angular.dev version of the component hanress docs, but was missing from the adev version.
PR Close#63620
This commit updates the `runs-on` configuration in the CI workflows
(`ci.yml`, `manual.yml`, `pr.yml`) from specific `ubuntu-latest-Xcore`
labels to the more general `ubuntu-latest`. This change reduces
resource consumption. This change should not be needed for RBE and remote cache.
PR Close#63656
Add some documentation that's mentioned in the material.angular.dev
version of the drag & drop docs, but was missing from the adev version.
PR Close#63619
This commit introduces a number of changes to the server bootstrapping process to make it more robust and less error-prone, especially for concurrent requests.
Previously, the server rendering process relied on a module-level global platform injector. This could lead to issues in server-side rendering environments where multiple requests are processed concurrently, as they could inadvertently share or overwrite the global injector state.
The new approach introduces a `BootstrapContext` that is passed to the `bootstrapApplication` function. This context provides a platform reference that is scoped to the individual request, ensuring that each server-side render has an isolated platform injector. This prevents state leakage between concurrent requests and makes the overall process more reliable.
BREAKING CHANGE:
The server-side bootstrapping process has been changed to eliminate the reliance on a global platform injector.
Before:
```ts
const bootstrap = () => bootstrapApplication(AppComponent, config);
```
After:
```ts
const bootstrap = (context: BootstrapContext) =>
bootstrapApplication(AppComponent, config, context);
```
A schematic is provided to automatically update `main.server.ts` files to pass the `BootstrapContext` to the `bootstrapApplication` call.
In addition, `getPlatform()` and `destroyPlatform()` will now return `null` and be a no-op respectively when running in a server environment.
PR Close#63562
Moves the control directive under api/ since it is part of the public
API. Also removes the interop abstract control from the public API
PR Close#63616
Tests validate the current behaviour of the injector tree feature.
- Nodes should be displaying on entering the tab
- Hide framework / Hide injectors with no providers flags should filter the tree properly
- Providers side tab should be able to be opened and filtered properly using the 2 filter input fields for token and type
PR Close#62844
Adds additional handling for input types that handle numbers:
- number
- range
- datetime-local
As well as input types that handle dates:
- date
- month
- week
- time
- *not* datetime-local which does not allow setting valueAsDate
This PR allows binding either a `Field<string>` or `Field<number>` to
the number type inputs and a `Field<string>`, `Field<numebr>`, or
`Field<Date | null>` to the date type inputs. Binding uses the
corresponding `.value`, `.valueAsNumber`, or `.valueAsDate` according to
the type of the `Field`.
When reading new values out of the input, the `Control` directive will
read the property that aligns with the type of the existing value in the
`Field` and write back the same type.
PR Close#63585
Updates the version range to drop support for TypeScript 5.8.
BREAKING CHANGE:
* TypeScript versions less than 5.9 are no longer supported.
PR Close#63589
TransferState is only written into the DOM once during SSR and is not kept in sync with the runtime state on the client. Pressing the refresh button always re-reads the initial serialized script tag, which never changes after bootstrap.
PR Close#63592
The logic to track if the transfer state has been serialized is simplified by removing the need for `APP_ID`. Instead of maintaining a `Set` of application IDs, a simple boolean flag is used.
PR Close#63525
The `TRANSFER_STATE_SERIALIZED_FOR_APPID` provider was previously configured at the platform level, causing its state to be shared across all concurrent server-side rendering requests. This created a race condition where one request could see the `appId` from a different, concurrent request, leading to false warnings about duplicate state serialization.
This commit changes the provider's scope to ensure that each application instance gets its own unique state. This correctly isolates the serialization check to each individual request, resolving the issue of false warnings in concurrent environments.
Closes#63524
PR Close#63525
Addresses some cleanup items for the router tree:
- No longer loads router ng global APIs as a side effect of importing the router. Rather this is now a runtime step that occurs when provideRouter is called.
- No longer depends on router.navigateByUrl in Angular DevTools. There is now a dedicated global util for this
- Router instance logic no longer depends on token name
- Prevents navigating to lazy or redirect routes (these don't have an associated component)
PR Close#63081
This fixes a bug introduced in #63485 where `firstValueFrom` was used. This
doesn't work in all situations here because some observables don't
emit before completing. These errors should result in the route matching
logic moving on to the next route.
Note: This is marked as a refactor rather than fix because the commit above is not in
any release yet.
PR Close#63546
Removes the deprecated `ApplicationConfig` export from `@angular/platform-browser`.
This export was deprecated in a prior version and developers should import `ApplicationConfig` from `@angular/core` instead.
BREAKING CHANGE:
The deprecated `ApplicationConfig` export from `@angular/platform-browser` has been removed.
Please import `ApplicationConfig` from `@angular/core` instead.
PR Close#63529
This option was introduced out of caution as a way for developers to opt out of
the new behavior in v18 which scheduled change detection even when
events happened outside the NgZone. After monitoring the results post-release, we
have determined that this feature is working as desired and do not believe it
should ever be disabled by setting this option to `true`.
This option was deprecated in v18.2, less than 3 months after it was
introduced in v18. We do not really expect it to be used.
BREAKING CHANGE: `ignoreChangesOutsideZone` is no longer available as an
option for configuring ZoneJS change detection behavior.
PR Close#62700
Fix the runtime errors caused by the tree visualizer node auto-snapping when a tab is changed. The errors are caused since we only visually hide the tabs.
PR Close#63531
The internal error handler in TestBed rethrows errors to prevent them
from being silently ignored in tests. Prior to this commit, tests which
used `provideZoneChangeDetection` in the providers would override the
internal error handler of TestBed and prevent these errors from being
rethrown.
BREAKING CHANGE: (test only) - Using `provideZoneChangeDetection` in the
TestBed providers would previously prevent `TestBed` from rethrowing
errors as it should. Errors in the test will now be rethrown, regardless
of the usage of `provideZoneChangeDetection`. Tests should be adjusted to
prevent or account for these errors. As in previous major versions,
this behavior can be disabled with `rethrowApplicationErrors: false` in
`configureTestingModule` as a last resort.
PR Close#63404
This updates the error thrown when both `provideZoneChangeDetection` and
`provideZonelessChangeDetection` are both used in the application
providers to be a warning instead. The reasons for this are twofold:
1. The migration we need for using zoneless by default isn't perfect and
may add `provideZoneChangeDetection` when the zoneless provider
exists. This change will prevent that from causing an error
2. There might be valid situations where a "default" is used in a common
provider but that can be overridden by individal applications. In
tests, we do allow this type of thing, where `initTestEnvironment`
may have a default but individual tests might want to use a different
one. The same logic might apply to applications in some environments.
PR Close#63457
This option would require one of either the zone or zoneless provider so
applications don't accidentally enable zoneless when the default flips if we
missed it in the migration. It'll be a hard failure at bootstrap, but that's a
lot easier to notice than zoneless getting turned on accidentally since
many things might just work.
PR Close#63486
This allows passing errors and disabled reasons that did not originate
from `@angular/forms/signals` in case the the control is being used
separately from the forms system
PR Close#63455
Removes custom handling of emptiness in several of the validators and
replaces it with a common `isEmpty` check. The common empty check
considered the following values to be empty: `null`, `undefined`, `''`,
`false`, `NaN`
Generally most validators should treat an empty value as valid. This
aligns with both the behavior or native HTML validators and reactive
forms validators.
As an example, consider an optional email field. If the email validator
considered empty string to be an invalid email, there would be no way
for the user to not enter it.
There are several exceptions to this rule:
- `required` whose entire purpose is to ensure that the field is *not*
empty
- `validateStandardSchema` which should subject all values including
empty ones to the specified standard schema. It is up to the schema to
decide whether an empty value is valid or not
- `validate`/`validateAsync` which leaves it up to the user's custom
validation logic to decide if an empty value is valid.
PR Close#63456
This fixes a bug introduced in #62994 where `toPromise` was used. This
doesn't work in all situations here because some observables don't
complete. This only affected the redirect path, since the others are
already behind other rxjs code which takes the first value from the user
guards.
Note: This is marked as a refactor rather than fix because the commit above is not in
any release yet.
PR Close#63485
To aid in hitting external breaking change deadlines without pressure
of fixing everything in g3 first, add an internal opt out flag.
This also adds a privately exported provider to revert to the old
rxjs-based behavior, which can be synchronous, until any issues that
come up are addressed.
PR Close#62994
This is effectively a revert of https://github.com/angular/angular/commit/72e6a948bb8ec58f14b87d297d5f81baf2e1942d.
Debugging the recognize stage is considerably easier with async/await
stacks compared to rxjs. This also improves maintainability and is a
better 1:1 with server-side logic that has been implemented to match
and can be more easily kept in sync.
This also ensures that the recognize step is always async, whereas it
can sometimes be synchronous with rxjs.
BREAKING CHANGE: Router navigations may take several additional
microtasks to complete. Tests have been found to often be highly
dependent on the exact timing of navigation completions with respect to
the microtask queue. The most common fix for tests is to ensure all
navigations have been completed before making assertions. On rare
occasions, this can also affect production applications. This can be
caused by multiple subscriptions to router state throughout the application,
both of which trigger navigations that happened to not conflict with the
previous timing.
PR Close#62994
The new animations was not correctly looking for the `.` when parsing bindings. This resulted in arbitrary event bindings creating animate.leave instruction calls.
fixes: #63466
PR Close#63470
This commit introduces an experimental version of a new signal-based forms API for Angular. This new API aims to explore how signals can be leveraged to create a more declarative, intuitive, and reactive way of handling forms.
The primary goals of this new signal-based approach are:
* **Signal-centric Design:** Place signals at the core of the forms experience, enabling a truly reactive programming model for form state and logic.
* **Declarative Logic:** Allow developers to define form behavior, such as validation and conditional fields, declaratively using TypeScript. This moves logic out of the template and into a typed, testable schema.
* **Developer-Owned Data Model:** The library does not maintain a copy of data in a form model, but instead read and write it via a developer-provided `WritableSignal`, eliminating the need for applications to synchronize their data with the form system.
* **Interoperability:** A key design goal is seamless interoperability with existing reactive forms, allowing for incremental adoption.
* **Bridging Template and Reactive Forms:** This exploration hopes to close the gap between template and reactive forms, offering a unified and more powerful approach that combines the best aspects of both.
This initial version of the experimental API includes the core building blocks, such as the `form()` function, `Field` and `FieldState` objects, and a `[control]` directive for binding to UI elements. It also introduces a schema-based system for defining validation, conditional logic, and other form behaviors.
Note: This is an early, experimental API. It is not yet complete and is subject to change based on feedback and further exploration.
Co-authored-by: Kirill Cherkashin <kirts@google.com>
Co-authored-by: Alex Rickabaugh <alxhub@users.noreply.github.com>
Co-authored-by: Leon Senft <leonsenft@users.noreply.github.com>
Co-authored-by: Dylan Hunn <dylhunn@gmail.com>
Co-authored-by: Michael Small <michael-small@users.noreply.github.com>
PR Close#63408
This commit updates provider definitions that relied on the `deps` array
with `new Optional()` and `new SkipSelf()` to instead use the modern
`inject(..., { optional: true, skipSelf: true })` API.
Previously:
deps: [[KeyValueDiffers, new SkipSelf(), new Optional()]]
Now:
const parent = inject(KeyValueDiffers, { optional: true, skipSelf: true });
**Bundle size reduction**: `Optional` and `SkipSelf` are runtime values
created by `makeParamDecorator()`. Even in production builds, esbuild
and other bundlers must keep their factory code because they are
referenced with `new Optional()` / `new SkipSelf()`. With `inject()`,
those classes are no longer referenced, allowing them and the
`makeParamDecorator` scaffolding to be tree-shaken when unused.
As a result, production bundles can drop both `Optional`, `SkipSelf`, and
their supporting factory code when not used elsewhere, reducing code size
while keeping the same behavior.
PR Close#63386
Add support for the Fetch API's responseType property in HttpResponse and HttpErrorResponse when using HttpClient with the withFetch provider.
PR Close#63043
When toggling visibility on an element over and over, the enter animations were supposed to be cancelled and then the classes removed. There was a race condition happening that resulted in the cancelled animation being the leave animation. Rather than using the animation.cancel functionality, it's safer to just remove the enter classes.
fixes: #63439
PR Close#63442
This commit updates the devtools step by disabling the package manager cache. This change is necessary because Cypress downloads its binary to a cache directory during installation, which requires a post-install script. However, when the cache is hit this is skipped.
This update also disables `pnpm install` in the Cypress action to avoid a redundant installation step. And adds a seperate cache for the downloaded Cypress binary.
See: https://docs.cypress.io/app/get-started/install-cypress#pnpm-configuration
PR Close#63441
Within our module.bazel file when describing the version of typescript to use for rules_ts, we use ts_version instead of ts_version_from to prevent our package.json file from being
part of the set of files used to calculate the sha for the lock file. Any unrelated change to the version of the typescript file would end up causing our lockfile to be out of date.
This amount of churn has proven to be too much for our current setup. We instead now test to validate the versions defined in the package.json and MODULE.bazel files match.
PR Close#63431
Annotate the `new Version(...)` call with `/* @__PURE__ */` to signal to
optimizers that the constructor is side-effect free.
Without this hint, bundlers such as Terser or ESBuild may conservatively
retain the `VERSION` instantiation even when unused. With the annotation,
the constant can be tree-shaken away in production builds if not referenced,
reducing bundle size.
PR Close#63400
This commit prevents lazy injection of the internal `ErrorHandler` from a destroyed injector, which would otherwise result in a secondary "destroyed injector" error.
The `handleUncaughtError` function is used in a wrapped event listener that invokes the `ErrorHandler` if the listener throws. A simple case in a micro-frontend application:
```ts
onNavigationToAnotherApp() {
this.appRef.destroy();
do_some_stuff_ie_loggin_that_may_throw();
}
```
If the function throws an error, Angular attempts to inject the `ErrorHandler` from a destroyed injector.
PR Close#62275
When declaring directives, the standalone flag is set to true by default in current Angular versions.
The docs for the directive decorator should correctly explain the default behavior, while still mentioning when to set it to false.
PR Close#63329
The 4 second removal timeout was applying in all cases, but it should only actually apply to the situation where the event binding syntax is used for animate.leave. This ensures that's the only case in which it'll apply.
PR Close#63393
Deprecated since v5. Use `upgrade/static` instead, which also supports aot.
BREAKING CHANGE: `UpgradeAdapter` is no longer available. Use
`upgrade/static` instead
PR Close#61659
The animate instructions were getting applied to the container comment nodes as well as the element nodes. This prevents that on the compiler level.
fixes: #63371
PR Close#63390
signalGraphEnabled was previously passed down the component tree.
This change refactors the logic to use the settings service instead,
which already holds the value and allows sharing it across components.
PR Close#63374
This commit drops the `X-Request-URL` header. It was a non-standard HTTP response header, deprecated long ago and never part of any official specification. Modern browsers now expose the final URL via the `XMLHttpRequest.responseURL` property, as defined in the WHATWG spec.
PR Close#61943
This fixes the rare case that someone uses binding syntax with `animate.leave` providing a value with a string that has spaces in it. For example:
```
<example `[animate.leave]="'class-a class-b"` />
```
fixes: #63365
PR Close#63366
This updates the adev navigation to consider the new enter-and-leave path to be the definitive animations guide.
It also prefixes all the prior animations package docs with legacy and updates all links.
PR Close#63368
With #63162, we added automatic link creation on API symbols. The side effect was that we created HTML in some specific cases. For example with the docs-card we could have nested anchor elements which is invalid.
This commit prevent creating nested links inside docs-cards.
fixes#63351
PR Close#63352
Change direct deps in bazel targets and import specifiers within files to maintain strict deps requirements ahead of enabling strict deps tests in the repo
PR Close#63323
There's special logic in place to prevent duplicate nodes from showing up in the case when an `@if` toggles a view quickly. This had the unfortunate side effect of causing `@for` leave animations to get cancelled when an add and remove happened simultaneously, even if it was a different index. This fix prevents that from happening in the `@for` loop case.
fixes: #63307
PR Close#63328
The `FormArrayDirective` will allow to have a `FormArray` as a top-level form object.
* `NgControlStatusGroup` directive will be applied to the `FormArrayDirective`
* `NgForm` will still create a `FormGroup`
Fixes angular#30264
BREAKING CHANGE: This new directive will conflict with existing FormArray directives or formArray inputs on the same element.
PR Close#55880
Ts 5.9 introduced a regression coming from 5.8 when parenthesis aren't generated for expressions like (`(a ?? b) && c`).
This fix works around this explicitly specifying that we want to keep those parenthesis that we're aware of in this specific case;
This change can be reverted if the root issue (https://github.com/microsoft/TypeScript/issues/61369) is fixed. (but let's keep the tests in any case for the coverage)
fixes#63287
PR Close#63292
This commit adds `lockfile_mode=error` to the `.bazelrc` file. This change ensures that any future builds will fail if the lock file is not up-to-date with the `BUILD.bazel` file, preventing inconsistencies and encouraging developers to commit updated lock files.
PR Close#63260
This is a first step to create links to API entries automatically.
It adds support for
- code spans (`` `symbol` ``)
- code blocks (`` ```some code here``` ``)
Links are generated from on a K/V map of API entries (symbol => package name).
The map is generated from the API manifest that we're already generating for the API docs.
For the moment, entries with identical names are skipped.
PR Close#63162
Fixes that the HMR extraction logic didn't accoubnt for expressions with type arguments (e.g. `viewChild('foo', {read: TemplateRef<unknown>})`).
Fixes#63240.
PR Close#63261
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
Add "Show graph" button to the signal properties in the side pane only for Angular apps. This required storing the signal graph in a separate service.
PR Close#62853
In the case that someone wants to disable animations via selector specificity, for example by adding an `.animate-disabled` class to a parent node, we need to make sure the animate instructions don't misbehave. Now we detect if animations exist in the provided classes and react accordingly.
fixes: #63161
PR Close#63242
The Tailwind CSS guide already resides within the Angular documentation, making a link to the Angular documentation redundant. This commit removes the unnecessary link.
PR Close#63205
Adds a new guide that explains how to set up and use Tailwind CSS in an Angular project. This guide covers installation, configuration, and provides a basic usage example.
PR Close#63205
Ensure consistency in error message wording by aligning the NG0303
error with other Angular error strings. This improves clarity and
maintains a uniform developer experience
PR Close#63222
Host bindings for `(animate.enter)` and `(animate.leave)` were not firing properly. This fixes the compiler ingest to make sure they do fire.
fixes: #63199
PR Close#63217
Previously, Angular devtools would mistakenly traverse the same DOM elements multiple times while doing traversal for the component tree explorer. This error case would occur when more than 1 Angular application root component was present on the same page and in distinct DOM branches.
Some example cases that did work previously:
```html
<app-root>
...
</app-root>
```
```html
<app-root>
...
<app-root-2></app-root-2>
...
</app-root>
```
An example of where it would enter the irregular behaviour
```html
<app-root>
...
</app-root>
<app-root-2>
...
</app-root-2>
```
Now, we properly ignore duplicate DOM paths when looking for application and non-application root component to begin the Angular DevTools component discovery logic.
PR Close#62719
This applies the same fix that fixed the class version to the event binding version. It prevents duplicate elements from being on screen when animations have been toggled too fast.
fixes: #63127
PR Close#63216
This change fixes an issue where long lists of enum values would display on a single line, running off the screen, especially on mobile devices.
PR Close#63211
The value type was not being displayed when a value had an enum, which was misleading. This change ensures the value type is always shown, so users know whether to expect a single value or an array of values.
PR Close#63211
This commit extracts helper functions to reduce code duplication across animation instructions and adds early return when animations are disabled.
PR Close#63163
Fixes that the pipeline wasn't processing the fallback content of `ng-content` for i18n which resulted in a compiler error further down the line.
Fixes#63065.
PR Close#63156
Similar fix as #63082, but for template attributes. The root cause is the same where we should be using `fullStart` instead of `start` in order to account for whitespaces being skipped.
Fixes#63157.
PR Close#63175
This commit updates the MCP server documentation with the following changes:
- Updates the description of the `ng mcp` command behavior.
- Adds a configuration example for the Gemini CLI.
- Adds a new section for command options, including `--read-only` and `--local-only`.
- Alphabetizes the IDE configuration sections for better readability.
- Alphabetizes the "Available Tools" table.
PR Close#63141
Running the Angular compiler with declaration-only emission is dangerous
because Angular does not yet support this mode as it relies on the Ivy
compilation which does not run in this mode
In the best case, everything works fine as incidentally there's no
difference in the emitted type declarations (e.g. this is the case for
TS files containing no Angular annotations or only `@Injectable`
annotations).
In the worst case, compilation silently fails in that the compilation
succeeds but the resulting type declarations are missing the Angular
type information and are therefore incomplete. This happens for all
components, directives and modules.
BREAKING CHANGE: The Angular compiler now produces an error when the
the `emitDeclarationOnly` TS compiler option is enabled as this mode is
not supported.
PR Close#61609
This commit also include an `ng update` migration to ensure `lastSuccessfulNavigation` is invoked.
BREAKING CHANGE: `lastSuccessfulNavigation` is now a signal and needs to be invoked
PR Close#63057
This commit adds brief documentation for `rxResource` to the "Using
Angular with RxJS" guide. The only available documentation for
`rxResource` today is the API reference, which lacks any code examples.
PR Close#63125
This removes the common pitfall for if blocks in the best practices, as this is no longer true in Angular v20.2, see angular/angular@a409534
PR Close#63132
This will allow us to build adev while the CLI and the FW major versions are mismatched.
we can remove this patch once the CLI has published a v21 pre-release (or a flag to disable that error).
PR Close#63098
This was missing from the RxJS interop guide. I came across it while
cleaning up some Google-internal docs and realized I had nothing on adev
to which I could link.
PR Close#63122
This fix updates the adev `DocViewer` component to support rendering with the `main[docsViewer` selector so that the primary content for the page is inside of a `<main>` element (without introducing an extra DOM element).
PR Close#63121
When using `file:` renovate updates fails due to ` ERR_PNPM_LINKED_PKG_DIR_NOT_FOUND ` this is due to a different behaviour between `link:` amd `file:`. `link:` however will not fail when the directory does not exist.
PR Close#63111
The `pnpm install` command was failing for the `packages/core/test/bundling` project with the error:
`ERR_PNPM_NO_MATCHING_VERSION No matching version found for @angular/compiler-cli@0.0.0-PLACEHOLDER`
This happenes only in renovate updates.
PR Close#63105
During `pnpm install` in a monorepo setup, the `packages/zone.js/test/typings` project would fail with the error: `ERR_PNPM_LINKED_PKG_DIR_NOT_FOUND: Could not install from "/.../node_modules/typescript" as it does not exist.`
PR Close#63105
When parsing expressions inside a bound attribute, we offset all of its spans by an `absoluteOffset` in order to get the right spans in the source file. The offset was incorrect when parsing an attribute with leading spaces during the construction of the Ivy AST, because of the combination of:
1. We were setting the offset by looking at `valueSpan.start`.
2. The Ivy parser sets `leadingTriviaChars: [' ', '\n']` which means that spaces and new lines will be ignored in the `sourceSpan.start`.
These changes resolve the issue by using `valueSpan.fullStart` which includes the leading spaces.
Fixes#63069.
PR Close#63082
# - We trust that people do the right thing and won't approve changes they don't feel confident reviewing
# - We enforce that only approved PRs are merged ensuring that unreviewed code isn't accidentally merged
# - We distribute approval rights as much as possible to help us scale better
# - Groups have one or two global approvers groups as fallbacks:
# - @angular/fw-global-approvers: for approving minor changes, large-scale refactorings, and emergency situations.
# - @angular/fw-global-approvers-for-docs-only-changes: for approving minor documentation-only changes that don't require engineering review
# - A small number of file groups have very limited number of reviewers because incorrect changes to the files they guard would have serious consequences (e.g. security, public api)
#
# Configuration nuances:
@@ -37,27 +34,10 @@
# See reviewer list under `required-minimum-review` group. Team member names and
@@ -14,20 +14,20 @@ appearance, race, religion, or sexual identity and orientation.
Examples of behavior that contributes to creating a positive environment
include:
* Use welcoming and inclusive language
* Respect each other
* Provide and gracefully accept constructive criticism
* Show empathy towards other community members
- Use welcoming and inclusive language
- Respect each other
- Provide and gracefully accept constructive criticism
- Show empathy towards other community members
Examples of unacceptable behavior by participants include:
* Trolling, insulting/derogatory comments, and personal or political attacks
* Public or private harassment
* Publishing others' private information, such as a physical or electronic
- Trolling, insulting/derogatory comments, and personal or political attacks
- Public or private harassment
- Publishing others' private information, such as a physical or electronic
address, without explicit permission
* The use of sexualized language or imagery
* Unwelcome sexual attention or advances
* Other conduct which could reasonably be considered inappropriate in a
- The use of sexualized language or imagery
- Unwelcome sexual attention or advances
- Other conduct which could reasonably be considered inappropriate in a
professional setting
## Our Responsibilities
@@ -69,9 +69,9 @@ members of the project's leadership.
If you are banned you may contest the decision. To do so email conduct@angular.io with the subject line "Repeal Ban for {{your name here}}" and body with the responses to the following:
* Why do you believe you did not violate the Code of Conduct?
* Were other factors involved in this situation the leadership team may have been unaware of?
* Why do you wish to be a part of the Angular community?
- Why do you believe you did not violate the Code of Conduct?
- Were other factors involved in this situation the leadership team may have been unaware of?
- Why do you wish to be a part of the Angular community?
We would love for you to contribute to Angular and help make it even better than it is today!
As a contributor, here are the guidelines we would like you to follow:
- [Code of Conduct](#coc)
- [Question or Problem?](#question)
- [Issues and Bugs](#issue)
- [Feature Requests](#feature)
- [Submission Guidelines](#submit)
- [Coding Rules](#rules)
- [Commit Message Guidelines](#commit)
- [Signing the CLA](#cla)
- [Code of Conduct](#coc)
- [Question or Problem?](#question)
- [Issues and Bugs](#issue)
- [Feature Requests](#feature)
- [Submission Guidelines](#submit)
- [Coding Rules](#rules)
- [Commit Message Guidelines](#commit)
- [Signing the CLA](#cla)
## <a name="coc"></a> Code of Conduct
Help us keep Angular open and inclusive.
Please read and follow our [Code of Conduct][coc].
## <a name="question"></a> Got a Question or Problem?
Do not open issues for general support questions as we want to keep GitHub issues for bug reports and feature requests.
@@ -34,28 +32,25 @@ To save your and our time, we will systematically close all issues that are requ
If you would like to chat about the question in real-time, you can reach out via [the Angular community Discord server][discord].
## <a name="issue"></a> Found a Bug?
If you find a bug in the source code, you can help us by [submitting an issue](#submit-issue) to our [GitHub Repository][github].
Even better, you can [submit a Pull Request](#submit-pr) with a fix.
## <a name="feature"></a> Missing a Feature?
You can *request* a new feature by [submitting an issue](#submit-issue) to our GitHub Repository.
If you would like to *implement* a new feature, please consider the size of the change in order to determine the right steps to proceed:
* For a **Major Feature**, first open an issue and outline your proposal so that it can be discussed.
You can _request_ a new feature by [submitting an issue](#submit-issue) to our GitHub Repository.
If you would like to _implement_ a new feature, please consider the size of the change in order to determine the right steps to proceed:
- For a **Major Feature**, first open an issue and outline your proposal so that it can be discussed.
This process allows us to better coordinate our efforts, prevent duplication of work, and help you to craft the change so that it is successfully accepted into the project.
**Note**: Adding a new topic to the documentation, or significantly re-writing a topic, counts as a major feature.
***Small Features** can be crafted and directly [submitted as a Pull Request](#submit-pr).
-**Small Features** can be crafted and directly [submitted as a Pull Request](#submit-pr).
## <a name="submit"></a> Submission Guidelines
### <a name="submit-issue"></a> Submitting an Issue
Before you submit an issue, please search the issue tracker. An issue for your problem might already exist and the discussion might inform you of workarounds readily available.
@@ -74,50 +69,67 @@ Unfortunately, we are not able to investigate / fix bugs without a minimal repro
You can file new issues by selecting from our [new issue templates](https://github.com/angular/angular/issues/new/choose) and filling out the issue template.
We strongly value open source contribution and pull requests from community contributors. Please note that every pull request is reviewed and merged by an actual person on the team, which does take time and effort. That is time and effort that does take away from other valuable work. With that in mind we have an minimum set of expectations that are required of any community contribution pull request that is opened.
1. Search [GitHub](https://github.com/angular/angular/pulls) for an open or closed PR that relates to your submission.
- You don't want to duplicate existing efforts.
2. Be sure that an issue or pull request clearly describes the problem you're fixing, or documents the design for the feature you'd like to add. Issues require a _minimal_ reproduction.
3. Discussing the design in an issue upfront helps to ensure that we're ready to accept your work. Pull requests are not the right place to do design work.
- When in doubt, open an issue first before doing any sort of speculative implementation work
4. Ideally the PR should be tied to an issue, but this is not required
5. The change should improve code quality (i.e. addressing a TODO) or should impact / improve a feature
6. Micro optimizations will only be accepted if they are validated by an actual benchmark
7. Do not open pull requests that are addressing feature requests that are not labeled as "help wanted" as they usually need additional design work before we could accept pull requests
8. The change should be well tested
If your pull request does not meet these minimum expectations, we may close your PR. Also, if your PR introduces a breaking change, it's possible the level of churn this breaking change causes may block our ability to move forward with it. We may close your PR in that situation, as well. Otherwise, we're excited to see your contributions and enthusiasm for Angular!
### <a name="submit-pr"></a> Submitting a Pull Request (PR)
Before you submit your Pull Request (PR) consider the following guidelines:
1. Search [GitHub](https://github.com/angular/angular/pulls) for an open or closed PR that relates to your submission.
You don't want to duplicate existing efforts.
2. Be sure that an issue describes the problem you're fixing, or documents the design for the feature you'd like to add.
Discussing the design upfront helps to ensure that we're ready to accept your work.
Make sure you author all contributed Git commits with email address associated with your CLA signature.
4. [Fork](https://docs.github.com/en/github/getting-started-with-github/fork-a-repo) the [angular/angular](https://github.com/angular/angular/fork) repo.
2. [Fork](https://docs.github.com/en/github/getting-started-with-github/fork-a-repo) the [angular/angular](https://github.com/angular/angular/fork) repo.
5. In your forked repository, make your changes in a new git branch:
3. In your forked repository, make your changes in a new git branch:
```shell
git checkout -b my-fix-branch main
```
```shell
git checkout -b my-fix-branch main
```
6. Create your patch, **including appropriate test cases**.
4. Create your patch, **including appropriate test cases**.
7. Follow our [Coding Rules](#rules).
5. Follow our [Coding Rules](#rules).
8. Run the full Angular test suite, as described in the [developer documentation][dev-doc], and ensure that all tests pass.
6. Run the full Angular test suite, as described in the [developer documentation][dev-doc], and ensure that all tests pass.
9. Commit your changes using a descriptive commit message that follows our [commit message conventions][commit-message-guidelines].
7. Commit your changes using a descriptive commit message that follows our [commit message conventions][commit-message-guidelines].
Adherence to these conventions is necessary because release notes are automatically generated from these messages.
```shell
git commit --all
```
Note: the optional commit `--all` command line option will automatically "add" and "rm" edited files.
```shell
git commit --all
```
10. Push your branch to GitHub:
Note: the optional commit `--all` command line option will automatically "add" and "rm" edited files.
```shell
git push origin my-fix-branch
```
8. Push your branch to GitHub:
11. In GitHub, send a pull request to `angular:main`.
```shell
git push origin my-fix-branch
```
9. In GitHub, send a pull request to `angular:main`.
### Reviewing a Pull Request
@@ -133,16 +145,15 @@ If we ask for changes via code reviews then:
3. Create a fixup commit and push to your GitHub repository (this will update your Pull Request):
```shell
git commit --all --fixup HEAD
git push
```
```shell
git commit --all --fixup HEAD
git push
```
For more info on working with fixup commits see [here](./contributing-docs/using-fixup-commits.md).
For more info on working with fixup commits see [here](./contributing-docs/using-fixup-commits.md).
That's it! Thank you for your contribution!
##### Updating the commit message
A reviewer might often suggest changes to a commit message (for example, to add more context for a change or adhere to our [commit message guidelines][commit-message-guidelines]).
@@ -150,69 +161,68 @@ In order to update the commit message of the last commit on your branch:
1. Check out your branch:
```shell
git checkout my-fix-branch
```
```shell
git checkout my-fix-branch
```
2. Amend the last commit and modify the commit message:
```shell
git commit --amend
```
```shell
git commit --amend
```
3. Push to your GitHub repository:
```shell
git push --force-with-lease
```
```shell
git push --force-with-lease
```
> NOTE:<br />
> If you need to update the commit message of an earlier commit, you can use `git rebase` in interactive mode.
> See the [git docs](https://git-scm.com/docs/git-rebase#_interactive_mode) for more details.
#### After your pull request is merged
After your pull request is merged, you can safely delete your branch and pull the changes from the main (upstream) repository:
* Delete the remote branch on GitHub either through the GitHub web UI or your local shell as follows:
- Delete the remote branch on GitHub either through the GitHub web UI or your local shell as follows:
```shell
git push origin --delete my-fix-branch
```
```shell
git push origin --delete my-fix-branch
```
* Check out the main branch:
- Check out the main branch:
```shell
git checkout main -f
```
```shell
git checkout main -f
```
* Delete the local branch:
- Delete the local branch:
```shell
git branch -D my-fix-branch
```
```shell
git branch -D my-fix-branch
```
* Update your local `main` with the latest upstream version:
```shell
git pull --ff upstream main
```
- Update your local `main` with the latest upstream version:
```shell
git pull --ff upstream main
```
## <a name="rules"></a> Coding Rules
To ensure consistency throughout the source code, keep these rules in mind as you are working:
* All features or bug fixes **must be tested** by one or more specs (unit-tests).
* All public API methods **must be documented**.
* We follow [Google's TypeScript Style Guide][ts-style-guide], but wrap all code at **100 characters**.
An automated formatter is available, see [building-and-testing-angular.md](./contributing-docs/building-and-testing-angular.md#formatting-your-source-code).
- All features or bug fixes **must be tested** by one or more specs (unit-tests).
- All public API methods **must be documented**.
- We follow [Google's TypeScript Style Guide][ts-style-guide], but wrap all code at **100 characters**.
An automated formatter is available, see [building-and-testing-angular.md](./contributing-docs/building-and-testing-angular.md#formatting-your-source-code).
We have very precise rules over how our Git commit messages must be formatted:
```
<type>(<scope>): <short summary>
```
@@ -224,21 +234,18 @@ See [Commit Message Guidelines][commit-message-guidelines] for details.
Please sign our Contributor License Agreement (CLA) before sending pull requests. For any code
changes to be accepted, the CLA must be signed. It's a quick process, we promise!
* For individuals, we have a [simple click-through form][individual-cla].
* For corporations, we'll need you to
- For individuals, we have a [simple click-through form][individual-cla].
- For corporations, we'll need you to
[print, sign and one of scan+email, fax or mail the form][corporate-cla].
If you have more than one GitHub accounts, or multiple email addresses associated with a single GitHub account, you must sign the CLA using the primary email address of the GitHub account used to author Git commits and send pull requests.
The following documents can help you sort out issues with GitHub accounts and multiple email addresses:
# If that doesn't work, try it with the expunge flag
pnpm bazel clean --expunge
```
## High level architecture
The angular.dev website is a modern Angular application that utilizes Static Site Generation (SSG) to deliver pre-rendered, high-performance content to users.
The architecture is designed for efficiency and maintainability:
Content Sources: The documentation is sourced from two main places within the monorepo. The guides and tutorials are written in Markdown files, while the API reference pages are automatically generated by extracting documentation directly from the TypeScript source code of the Angular framework packages.
Build Process: During the build process, the Markdown files are converted into HTML. Simultaneously, the API documentation is extracted from the code comments. This content is then integrated into the Angular application.
# Generating data for `angular.dev/api` CDK packages
This script updates the Angular CDK api JSON files stored in `adev/src/content/cdk`. This files are used to generate the [angular.dev api](https://angular.dev/api) pages for the CDK packages.
This script updates the Angular CLI help JSON files stored in `adev/src/content/cli/help`. This files are used to generate the [angular.dev CLI](https://angular.dev/cli) pages.
it('should not copy lines marked as deleted when code snippet contains diff',async()=>{
constcodeInHtmlFormat=`
<code>
<divclass="line remove"><spanclass="hljs-tag"><<spanclass="hljs-name">div</span>*<spanclass="hljs-attr">ngFor</span>=<spanclass="hljs-string">"let product of products"</span>></span></div>
<divclass="line add"><spanclass="hljs-tag"><<spanclass="hljs-name">div</span>*<spanclass="hljs-attr">ngFor</span>=<spanclass="hljs-string">"let product of products()"</span>></span></div>
</code>
`;
constexpectedCodeToBeCopied=`<div *ngFor="let product of products()">`;
Some files were not shown because too many files have changed in this diff
Show More
Reference in New Issue
Block a user
Blocking a user prevents them from interacting with repositories, such as opening or commenting on pull requests or issues. Learn more about blocking a user.
Alex Rickabaugh