Describe the bug
It seems that namespaceURI is entered incorrectly when putting pattern in SVG .
I thought that @html doesn't support svg, but the problem only occurs inside "each".
let patternstr = `<pattern width="1" height="1" patternContentUnits="objectBoundingBox" id="patternx1">
<rect width="1" height="1" fill="red"></rect>
</pattern>`
let patterns = {p: patternstr}
let patternstr2 = `<pattern width="1" height="1" patternContentUnits="objectBoundingBox" id="patternx2">
<rect width="1" height="1" fill="red"></rect>
</pattern>`
<svg width="64" height="64" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" preserveAspectRatio="none">
<defs>
{#each Object.entries(patterns) as [p, pattern]}
{@html pattern}
{/each}
</defs>
<rect width="64" height="64" fill="url(#patternx1)" stroke="black" stroke-width="2px"></rect>
</svg>
<svg width="64" height="64" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" preserveAspectRatio="none">
<defs>
{@html patternstr2}
</defs>
<rect width="64" height="64" fill="url(#patternx2)" stroke="black" stroke-width="2px"></rect>
</svg>
The first rectangle using each has no pattern applied,
The second rectangle is the pattern applied.
If you check with the inspector in the browser, the pattern entered into each enters the namespaceURI as "http://www.w3.org/1999/xhtml", but you can see that the pattern of the second square is entered as "http://www.w3.org/2000/svg".
How can I make sure that the correct namespaceURI is also included in each?
Reproduction
https://svelte.dev/repl/2e6d05451d4e40159bae0570a422bb80?version=3.44.2
Logs
No response
System Info
System:
OS: Windows 10 10.0.22000
CPU: (8) x64 Intel(R) Core(TM) i5-8265U CPU @ 1.60GHz
Memory: 1.90 GB / 7.89 GB
Binaries:
Node: 17.0.1 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.15 - C:\Program Files\nodejs\yarn.CMD
npm: 8.1.3 - C:\Program Files\nodejs\npm.CMD
Browsers:
Edge: Spartan (44.22000.120.0), Chromium (96.0.1054.43)
Internet Explorer: 11.0.22000.120
npmPackages:
svelte: ^3.44.0 => 3.44.2
Severity
annoyance
Describe the bug
It seems that namespaceURI is entered incorrectly when putting pattern in SVG .
I thought that @html doesn't support svg, but the problem only occurs inside "each".
The first rectangle using each has no pattern applied,
The second rectangle is the pattern applied.
If you check with the inspector in the browser, the pattern entered into each enters the namespaceURI as "http://www.w3.org/1999/xhtml", but you can see that the pattern of the second square is entered as "http://www.w3.org/2000/svg".
How can I make sure that the correct namespaceURI is also included in each?
Reproduction
https://svelte.dev/repl/2e6d05451d4e40159bae0570a422bb80?version=3.44.2
Logs
No response
System Info
System: OS: Windows 10 10.0.22000 CPU: (8) x64 Intel(R) Core(TM) i5-8265U CPU @ 1.60GHz Memory: 1.90 GB / 7.89 GB Binaries: Node: 17.0.1 - C:\Program Files\nodejs\node.EXE Yarn: 1.22.15 - C:\Program Files\nodejs\yarn.CMD npm: 8.1.3 - C:\Program Files\nodejs\npm.CMD Browsers: Edge: Spartan (44.22000.120.0), Chromium (96.0.1054.43) Internet Explorer: 11.0.22000.120 npmPackages: svelte: ^3.44.0 => 3.44.2Severity
annoyance