diff --git a/src/compiler/code_generator.ts b/src/compiler/code_generator.ts
index 5e3e0ec3..48b2ea87 100644
--- a/src/compiler/code_generator.ts
+++ b/src/compiler/code_generator.ts
@@ -524,10 +524,10 @@ export class CodeGenerator {
compileTDomNode(ast: ASTDomNode, ctx: Context) {
let { block, forceNewBlock } = ctx;
- const isNewBlock = !block || forceNewBlock || ast.dynamicTag !== null;
+ const isNewBlock = !block || forceNewBlock || ast.dynamicTag !== null || ast.ns;
let codeIdx = this.target.code.length;
if (isNewBlock) {
- if ((ast.dynamicTag || ctx.tKeyExpr) && ctx.block) {
+ if ((ast.dynamicTag || ctx.tKeyExpr || ast.ns) && ctx.block) {
this.insertAnchor(ctx.block!);
}
block = this.createBlock(block, "block", ctx);
diff --git a/tests/compiler/__snapshots__/svg.test.ts.snap b/tests/compiler/__snapshots__/svg.test.ts.snap
index 14c96c65..44155ac4 100644
--- a/tests/compiler/__snapshots__/svg.test.ts.snap
+++ b/tests/compiler/__snapshots__/svg.test.ts.snap
@@ -52,6 +52,41 @@ exports[`properly support svg namespace to svg tags added even if already in svg
}"
`;
+exports[`properly support svg svg creates new block if it is within html -- 2 1`] = `
+"function anonymous(bdom, helpers
+) {
+ let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
+
+ let block1 = createBlock(\`
\`);
+ let block2 = createBlock(\`\`);
+ let block3 = createBlock(\`\`);
+
+ return function template(ctx, node, key = \\"\\") {
+ let b3;
+ if (ctx['hasPath']) {
+ b3 = block3();
+ }
+ let b2 = block2([], [b3]);
+ return block1([], [b2]);
+ }
+}"
+`;
+
+exports[`properly support svg svg creates new block if it is within html 1`] = `
+"function anonymous(bdom, helpers
+) {
+ let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
+
+ let block1 = createBlock(\`
\`);
+ let block2 = createBlock(\`\`);
+
+ return function template(ctx, node, key = \\"\\") {
+ let b2 = block2();
+ return block1([], [b2]);
+ }
+}"
+`;
+
exports[`properly support svg svg namespace added to sub templates if root tag is path 1`] = `
"function anonymous(bdom, helpers
) {
diff --git a/tests/compiler/svg.test.ts b/tests/compiler/svg.test.ts
index 42b55d2d..cfe190c8 100644
--- a/tests/compiler/svg.test.ts
+++ b/tests/compiler/svg.test.ts
@@ -1,6 +1,6 @@
import { renderToString, renderToBdom, snapshotEverything, makeTestFixture } from "../helpers";
import { mount } from "../../src/blockdom";
-import { mount as mountComponent, Component } from "../../src/index";
+import { mount as mountComponent, Component, xml } from "../../src/index";
// NB: check the snapshots to see where the SVG namespaces are added
snapshotEverything();
@@ -74,4 +74,44 @@ describe("properly support svg", () => {
expect(el.namespaceURI).toBe("http://www.w3.org/2000/svg");
}
});
+
+ test("svg creates new block if it is within html", async () => {
+ class Test extends Component {
+ static template = xml`
+
+
+
+ `;
+ }
+ const fixture = makeTestFixture();
+ await mountComponent(Test, fixture);
+ const elems = fixture.querySelectorAll("svg, polygon");
+ expect(elems.length).toEqual(2);
+ for (const el of elems) {
+ expect(el.namespaceURI).toBe("http://www.w3.org/2000/svg");
+ }
+ });
+
+ test("svg creates new block if it is within html -- 2", async () => {
+ class Test extends Component {
+ static template = xml`
+