Updates `DomElementSchemaRegistry` to strip `:svg:` and `:math:` namespace prefixes
from tag names before querying `SECURITY_SCHEMA` at compile-time. This allows SVG
and MathML attributes to correctly match their security contexts during compilation.
PR Close#68926
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.
The fix introduces a runtime validation step:
- A new [ɵɵValidateAttribute](cci:1://file:///usr/local/google/home/alanagius/git/angular/packages/core/src/sanitization/sanitization.ts:276:0-288:1) instruction is used when `attributeName` is bound on SVG animation elements.
- If executed, a `RuntimeError` is thrown, preventing the binding.
- The compiler now identifies `attributeName` on SVG animation elements as security-sensitive and injects this validation.
Additionally, the DOM security schema has been updated to include a comprehensive list of MathML and SVG elements that accept `href` or `xlink:href` attributes, ensuring they are correctly treated as `SecurityContext.URL` and sanitized. This prevents malicious URLs from being bound to these attributes.
http://b/463880509
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
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
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
This deprecates `BootstrapOptions` since `NgZone` can now be configured
in the providers. This is a necessary step because when zoneless becomes
the default, developers will have to add ZoneJS via
`provideZoneChangeDetection` and that will override anything defined in
`BootstrapOptions`.
PR Close#62690
Currently when loading external resources in JIT, when `fetch` fails,
the `text` is empty and the component is loading. This hides the actual
underlying fetch error. We should properly detect this and error out.
PR Close#62992
When animate.leave is used, stylesheet pruning causes issues. Stylesheets with the appropriate animations get pruned before the animations can run. This will delay the removal in the case that the registry is present.
fixes: #62942
PR Close#62943
This adds a test module configuration to define whether animations should be enabled or disabled in test. By default, they are disabled.
PR Close#62764
Currently when testing a component using `TestBed.createComponent`, we always create the component as a `div` which isn't aligned with the runtime. The runtime tries to parse out the tag name from the first selector in `@Component` and only falls back to `div` if there isn't one. This behavior difference can cause components to not behave like they would in production which reduces the usefulness of the tests.
These changes add the `inferTagName` option to `TestBed.createComponent` and `TestBed.configureTestingModule` that allows apps to opt into inferring the tag name from the selector in the same way as the runtime. Currently the new option is set to `false`, but we intend to change it to `true` in a future version.
PR Close#62283
This way, an arbitrary service can implement Angular's service requirements without a hard dependency on @angular/core
ex:
class Foo {
bar = inject(Bar);
}
registerInjectable(Foo);
PR Close#62087
Similar to `DestroyRef`, this adds the `destroyed` property to
`EnvironmentInjector`. It also has the ability to register callbacks with
`onDestroy`, which throws if `destroyed` is already `true`.
This also omits the bit about whether those callbacks have executed
since I realized the property is set to `true` before executing the
callbacks.
PR Close#61951
Adds support for passing in `Binding` objects into `TestBed.createComponent`. This makes it easier to test components by avoiding the need to create a wrapper component. Furthermore, it keeps the behavior consistent between tests and the actual app. For example, given a custom checkbox that looks like this:
```typescript
@Component({
selector: 'my-checkbox',
template: '...',
host: {'[class.checked]': 'isChecked()'}
})
export class MyCheckbox {
isChecked = input(false);
}
```
A test for the `isChecked` input would look something like this:
```typescript
it('should toggle the checked class', () => {
@Component({
imports: [MyCheckbox],
template: '<my-checkbox [isChecked]="isChecked"/>',
})
class Wrapper {
isChecked = false;
}
const fixture = TestBed.createComponent(Wrapper);
const checkbox = fixture.nativeElement.querySelector('my-checkbox');
fixture.detectChanges();
expect(checkbox.classList).not.toContain('checked');
fixture.componentInstance.isChecked = true;
fixture.detectChanges();
expect(checkbox.classList).toContain('checked');
});
```
Whereas with the new API, the test would look like this:
```typescript
it('should toggle the checked class', () => {
const isChecked = signal(false);
const fixture = TestBed.createComponent(MyCheckbox, {
bindings: [inputBinding('isChecked', isChecked)]
});
const checkbox = fixture.nativeElement.querySelector('my-checkbox');
fixture.detectChanges();
expect(checkbox.classList).not.toContain('checked');
isChecked.set(true);
fixture.detectChanges();
expect(checkbox.classList).toContain('checked');
});
```
PR Close#62040
Since `DestroyRef.onDestroy` throws if the `DestroyRef` is already
destroyed, there is a need to be able to tell if it is already destroyed
before attempting to register a callback.
PR Close#61849
Refactor createSignal to return a tuple instead of a signal getter. createSignalTuple will be removed in a follow up pr once createSignalTuple usages in google3 are migrated to createSignal.
PR Close#61705
`Resource.error` used to return `unknown`. Now it's `Error | undefined`.
For non-`Error` types they are encapsulated with the `Error` type.
PR Close#61441
When passing bindings as arguments or storing them before use in
`createComponent`, it's handy to be able to reference this type.
The current workaround is to use `ReturnType<typeof inputBinding>`.
PR Close#61351
This commit exposes the experimental enableProfiling() API that
enables Angular integration with the Chrome DevTools performance
panel. Previously this integration was exposed on the ng. namespace
only but there are legitimate cases where developers might want to
expose the integration earlier (ex.: bootstrap profiling).
PR Close#61465
Our intention was to remove TestBed.flushEffects() in Angular v20
as it was a developer preview API that doesn't need to follow our
deprecation policy. It turned out, though, that the angular.dev
documentation wasn't displaying the @developerPreview annotation
properly so some of the developers might have been unaware of the
non-stable nature of this API.
This commits re-introduces the TestBed.flushEffects() API. This
API call will delegate to TestBed.tick().
PR Close#61462
After nearly a decade of existence, there are 0 uses of
`autoDetectChanges(false)` internally. All uses of
`autoDetectChanges(true)` can be migrated directly to
`autoDetectChanges()` instead.
PR Close#61429
Add createSignalTuple function to match Wiz array destructuring signal return. This will be the implementation for createSignal once createSignal usages in google3 are migrated to createSignalTuple.
PR Close#60903
This change renames the afterRender to afterEveryRender and marks the
renamed API as stable.
BREAKING CHANGE: afterRender was renamed to afterEveryRender.
PR Close#60999
This commit introduces the `TestBed.tick()` method that,
similarly to the `ApplicationRef.tick()`, synchronizes state
with the DOM. It can be used in unit tests to mimic framework's
logic executed in production applications. The `TestBed.tick()`
should be used instead of the removed `TestBed.flushEffects()`.
BREAKING CHANGE: the `TestBed.flushEffects()` was removed - use
the `TestBed.tick()` instead.
PR Close#60993
Alan Agius