Severity
Details
- CVSS score
- 6.1
- CVSS vector
- CVSS:3.1/AV:N/AC:L/PR:N/UI:R/S:C/C:L/I:L/A:N
- CWE ID
Overview
About vulnerability
Summary
An XSS vulnerability exists in @angular/platform-server during server-side rendering (SSR) HTML serialization of ProcessingInstruction DOM nodes (<?target data?>, nodeType === 7) when nested inside fallback raw-content elements (<noscript>, <iframe>, <noembed>, <noframes>). While processing instruction data escaped > to >, it did not check for or escape matching closing tags of ancestor fallback elements (e.g., </noscript>). When rendered in a browser with scripting enabled, an unescaped closing tag sequence in a processing instruction prematurely closes the fallback raw-content tag and causes subsequent sibling elements to execute as live HTML.
Technical Description
In HTML5 parsing, fallback raw-content elements (<noscript>, <iframe>, <noembed>, <noframes>) place the browser’s HTML tokenizer into RAWTEXT mode. In RAWTEXT mode, processing instruction tokens (<?...?>) are treated as literal raw text rather than bogus comments, and the parser ignores > or ?>. The only token sequence that terminates the container is an end tag matching the container tag name (</noscript, </iframe, etc.).
During server-side HTML serialization, processing instruction nodes previously only replaced > with > (preventing bogus comment breakouts in normal HTML data states) but left < untouched. Crucially, processing instruction serialization never inspected ancestor fallback raw-content tags. As a result, if a ProcessingInstruction node inside <noscript> contained </noscript in its data payload, it was emitted unescaped as <?x </noscript ?>.
Impact & Reachability
- Reachability: Processing instruction nodes cannot be authored directly through standard Angular template syntax (which parses
<?...>into comment nodes in DOM position). Reaching this vulnerability requires application or library code callinginject(DOCUMENT).createProcessingInstruction(target, data)orRenderer2DOM insertion methods with untrusted user input passed todatainside a fallback raw-content container. - Impact: In applications that programmatically construct processing instruction nodes inside fallback elements during server-side rendering, an attacker controlling the processing instruction data can break out of the container and execute arbitrary JavaScript in victims’ browsers.
Proof of Concept (Minimal Reproduction)
import { Component, ElementRef, Renderer2, inject, DOCUMENT, AfterViewInit } from '@angular/core';
@Component({
selector: 'app-root',
standalone: true,
template: `<noscript id="host"></noscript>`
})
export class AppComponent implements AfterViewInit {
private r = inject(Renderer2);
private el = inject(ElementRef);
private doc = inject(DOCUMENT);
ngAfterViewInit() {
const host = this.el.nativeElement.querySelector('#host');
// Attacker-controlled input passed as Processing Instruction data
const pi = this.doc.createProcessingInstruction('x', '</noscript ');
this.r.appendChild(host, pi);
// Sibling markup that should remain inert inside <noscript>
const img = this.r.createElement('img');
this.r.setAttribute(img, 'src', 'x');
this.r.setAttribute(img, 'onerror', 'alert("SSR_PI_XSS")');
this.r.appendChild(host, img);
}
}
Vulnerable SSR Output:
<noscript><?x </noscript ?><img src="x" onerror="alert('SSR_PI_XSS')"></noscript>
Workarounds
- Avoid passing untrusted user input into
document.createProcessingInstruction(target, data)when the node is inserted into<noscript>,<iframe>,<noembed>, or<noframes>during server-side rendering. - Manually sanitize or replace
<with<in any untrusted data passed to processing instruction nodes on the server.
Details
- Affected product:
- AngularJS , angular-animations , angular-build , angular-common , angular-compiler , angular-compiler-cli , angular-core , angular-create , angular-devkit-build-angular , angular-devkit-core , angular-devkit-schematics-cli , angular-elements , angular-estree-parser , angular-forms , angular-localize , angular-platform-browser , angular-platform-browser-dynamic , angular-platform-server , angular-pwa , angular-router , angular-service-worker , angular-ssr , angular-upgrade , create-storybook , domino , ng-packagr , ngtools-webpack , nguniversal , sb , schematics-angular , sentry-angular , sentry-astro , sentry-deno , sentry-ember , sentry-gatsby , sentry-javascript , sentry-replay , sentry-wasm , storybook , storybook-addon-a11y , storybook-addon-actions , storybook-addon-backgrounds , storybook-addon-controls , storybook-addon-docs , storybook-addon-essentials , storybook-addon-highlight , storybook-addon-interactions , storybook-addon-jest , storybook-addon-links , storybook-addon-mdx-gfm , storybook-addon-measure , storybook-addon-onboarding , storybook-addon-outline , storybook-addon-storysource , storybook-addon-themes , storybook-addon-toolbars , storybook-addon-viewport , storybook-angular , storybook-blocks , storybook-builder-manager , storybook-builder-vite , storybook-builder-webpack5 , storybook-channels , storybook-cli , storybook-client-logger , storybook-codemod , storybook-components , storybook-core , storybook-core-common , storybook-core-events , storybook-core-server , storybook-core-webpack , storybook-csf-plugin , storybook-csf-tools , storybook-docs-tools , storybook-ember , storybook-experimental-addon-test , storybook-experimental-nextjs-vite , storybook-html , storybook-html-vite , storybook-html-webpack5 , storybook-instrumenter , storybook-manager , storybook-manager-api , storybook-nextjs , storybook-node-logger , storybook-preact , storybook-preact-vite , storybook-preact-webpack5 , storybook-preset-create-react-app , storybook-preset-html-webpack , storybook-preset-preact-webpack , storybook-preset-react-webpack , storybook-preset-server-webpack , storybook-preset-svelte-webpack , storybook-preset-vue3-webpack , storybook-preview , storybook-preview-api , storybook-react , storybook-react-dom-shim , storybook-react-native-web-vite , storybook-react-vite , storybook-react-webpack5 , storybook-router , storybook-server , storybook-server-webpack5 , storybook-source-loader , storybook-svelte , storybook-svelte-vite , storybook-svelte-webpack5 , storybook-sveltekit , storybook-telemetry , storybook-test , storybook-theming , storybook-types , storybook-vue3 , storybook-vue3-vite , storybook-vue3-webpack5 , storybook-web-components , storybook-web-components-vite , storybook-web-components-webpack5
- Affected packages:
- @angular/core @ 8.0.3 (+3059 more)