diff --git a/src/jsxy.mjs b/src/jsxy.mjs index 2f539a3..bce75e9 100644 --- a/src/jsxy.mjs +++ b/src/jsxy.mjs @@ -167,8 +167,8 @@ function renderChildren(parentNode, vnodes, component, ns) { for (let k in oldHooks) { if (!(k in newHooks)) for (let h of oldHooks[k]) h.unmount?.(); } - for (let n = parentNode.childNodes.length - vnodes.length; n > 0; n--) { - unmount(parentNode.lastChild).remove(); + for (let i = nodes.length-1; i >= vnodes.length; i--) { + unmount(nodes[i]).remove() } } diff --git a/test/fixtures/jsxy.mjs.json b/test/fixtures/jsxy.mjs.json index a472cdb..67b9169 100644 --- a/test/fixtures/jsxy.mjs.json +++ b/test/fixtures/jsxy.mjs.json @@ -248,5 +248,7 @@ "jsxy: render: render root/app from any child (1)": "
1
", "jsxy: render: renderChildren works correctly when removing children (0)": "
123
", "jsxy: render: renderChildren works correctly when removing children (1)": "
13
", + "jsxy: render: renderChildren works correctly when removing multiple children (0)": "
123
", + "jsxy: render: renderChildren works correctly when removing multiple children (1)": "
3
", "jsxy: render: render removes existing vnode props when necessary (0)": "
hello world
" } diff --git a/test/jsxy.mjs b/test/jsxy.mjs index 758258e..bdc31c0 100644 --- a/test/jsxy.mjs +++ b/test/jsxy.mjs @@ -254,11 +254,18 @@ t.describe("jsxy", () => { t.assertFixture(document.body.innerHTML); }); + t("renderChildren works correctly when removing multiple children", () => { + render(html`
${[1, 2, 3]}
`, document.body); + t.assertFixture(document.body.innerHTML); + render(html`
${[null, 3]}
`, document.body); + t.assertFixture(document.body.innerHTML); + }); + t("render removes existing vnode props when necessary", () => { render(html`
hello world
`, document.body); render(html`
hello world
`, document.body); t.assertFixture(document.body.innerHTML); - }) + }); }); t.describe("db/query", () => {