Routed component host created in SVG namespace after an <svg> sibling (22.1.4)

Inizia con la modifica di createHostElement() di Angular core nel commit 2ab5ff5 e riproduci il problema usando la riproduzione minima collegata. Traccia la propagazione del namespace per un router-outlet creato all'interno di un @if dopo un SVG precedente; il lavoro è completo quando l'host sottoposto a routing usa il namespace HTML e viene renderizzato con il layout normale.

Which @angular/* package(s) are the source of the bug?

core

Is this a regression?

Yes

Description

When a <router-outlet> sits inside an @if block and any <svg> appears
earlier in the same template, the routed component's host element is created in
the SVG namespace. The <svg> is closed and is only a preceding sibling — the
outlet is not nested inside it.

An SVG-namespaced element gets no CSS box in HTML layout, so the routed view
computes to 0x0. The markup is fully present and correct in the DOM, every
computed style looks right, and no error or warning is logged — the page is
simply blank.

The @if is required. Without it the same <svg> causes no problem:

Nesting the <svg> inside another element (e.g. a <button>) makes no
difference; the @if is the deciding factor. Wrapping the outlet in any HTML
element inside the @if restores the HTML namespace and works around it.

Bisected to 2ab5ff5 ("fix(core): preserve namespace for dynamic component
hosts"), which changed createHostElement():

// 22.1.3
const namespace = tagName === 'svg' ? SVG_NAMESPACE : tagName === 'math' ? MATH_ML_NAMESPACE : null;
// 22.1.4
const namespace = tagName === 'svg' ? SVG_NAMESPACE : tagName === 'math' ? MATH_ML_NAMESPACE : hostElementNamespace;

Is this the intended consequence of that change? The outlet is not nested inside
the <svg> — the element is closed before the @if block begins — so it is not
obvious that the SVG namespace should reach the routed host here.

Please provide a link to a minimal reproduction of the bug

https://github.com/hypnotoad08/angular-svg-namespace-repro

Please provide the exception or error you saw

None. There is no exception and no console warning.

Please provide the environment you discovered this bug in (run ng version)

Angular CLI       : 22.1.6
Angular           : 22.1.4
Node.js           : 24.20.0
Package Manager   : npm 11.19.0
Operating System  : win32 x64

┌───────────────────────────┬───────────────────┬───────────────────┐
│ Package                   │ Installed Version │ Requested Version │
├───────────────────────────┼───────────────────┼───────────────────┤
│ @angular/build            │ 22.1.6            │ ^22.1.5           │
│ @angular/cli              │ 22.1.6            │ ^22.1.5           │
│ @angular/common           │ 22.1.4            │ ^22.1.3           │
│ @angular/compiler         │ 22.1.4            │ ^22.1.3           │
│ @angular/compiler-cli     │ 22.1.4            │ ^22.1.3           │
│ @angular/core             │ 22.1.4            │ ^22.1.3           │
│ @angular/forms            │ 22.1.4            │ ^22.1.3           │
│ @angular/platform-browser │ 22.1.4            │ ^22.1.3           │
│ @angular/router           │ 22.1.4            │ ^22.1.3           │
│ rxjs                      │ 7.8.2             │ ^7.8.2            │
│ typescript                │ 6.0.3             │ ~6.0.3            │
│ vitest                    │ 4.1.11            │ ^4.1.10           │
└───────────────────────────┴───────────────────┴───────────────────┘

Anything else?

No response