diff --git a/.changeset/wide-clubs-serve.md b/.changeset/wide-clubs-serve.md new file mode 100644 index 0000000..cde8071 --- /dev/null +++ b/.changeset/wide-clubs-serve.md @@ -0,0 +1,5 @@ +--- +"@solidjs/meta": patch +--- + +Fix removing one renders all previous <title>s diff --git a/src/index.tsx b/src/index.tsx index b1ed144..ded9fb0 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -155,6 +155,7 @@ function initClientProvider() { for (let i = index - 1; i >= 0; i--) { if (t[i] != null) { document.head.appendChild(t[i].ref); + break; } } } diff --git a/test/index.spec.tsx b/test/index.spec.tsx index 8aa10ae..6487447 100644 --- a/test/index.spec.tsx +++ b/test/index.spec.tsx @@ -89,6 +89,35 @@ test("unmount middle child, should show only the last title", () => { dispose(); }); +test("unmount last child, should show only the second last title", () => { + let div = document.createElement("div"); + const snapshot1 = "<title>Title 3"; + const snapshot2 = "Title 2"; + const [visible, setVisible] = createSignal(true); + const dispose = render( + () => ( + +
+ Title 1 +
+
+ Title 2 +
+ +
+ Title 3 +
+
+
+ ), + div + ); + expect(document.head.innerHTML).toBe(snapshot1); + setVisible(false); + expect(document.head.innerHTML).toBe(snapshot2); + dispose(); +}); + test("hydrates only the last title", () => { hydrationScript(); let div = document.createElement("div"); @@ -218,7 +247,7 @@ test("renders only the last meta with the same name", () => { const snapshot1 = ''; const snapshot2 = ''; const snapshot3 = ''; - + const [visible1, setVisible1] = createSignal(false); const [visible2, setVisible2] = createSignal(false); const dispose = render( @@ -279,16 +308,8 @@ test("renders both meta with the same name/property but different other attribut const dispose = render( () => ( - - + + ), div @@ -307,7 +328,7 @@ test("throws error if head tag is rendered without MetaProvider", () => { test("doesn't create any effect on removal", () => { let div = document.createElement("div"); - const [ show, setShow ] = createSignal(true); + const [show, setShow] = createSignal(true); const showAndTest = () => { expect(getOwner()?.owner).toBeTruthy(); return show(); @@ -317,7 +338,9 @@ test("doesn't create any effect on removal", () => { () => ( - Something {showAndTest()} that forces the Solid compiler to create a memo here + + Something {showAndTest()} that forces the Solid compiler to create a memo here + ), @@ -330,7 +353,8 @@ test("doesn't create any effect on removal", () => { test("Escaping the title tag", () => { let div = document.createElement("div"); - const snapshot = 'Hello</title><script>alert("inject");</script><title> World'; + const snapshot = + 'Hello</title><script>alert("inject");</script><title> World'; const dispose = render( () => ( @@ -361,4 +385,4 @@ test("Escaping the title meta", () => { ); expect(document.head.innerHTML).toBe(snapshot); dispose(); -}); \ No newline at end of file +});