search

yelouafi / petit-dom

minimalist virtual dom library
MIT License
501 stars 36 forks source link

Possible bug: `Uncaught DOMException: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.` #24

Closed cjh9 closed 5 years ago

cjh9 commented 5 years ago

Consider this runnable example:

<body><script type="module">

import { h, mount, patch } from "https://unpkg.com/petit-dom?module"

window.onload = ()=> {
    document.body.appendChild(mount(oldNode))
    patch(newNode, oldNode)
}

const oldNode = 
h('div', {}, [
    h('h1', {}, ['TxT']),
    h('div', {}, [
        h('div', {}, [
            h('div', {}, ['TxT']),
            h('pre', {}, [
                h('code', {}, [
                    h('span', {}, ['TxT']),
                    '\n'
                ])
            ]),
            h('div', {}, []),
            h('div', {}, []),
            ""
        ])
    ]),
    h('p', {}, ['TxT']),
    "\n",
    h('pre', {}, [
        h('code', {}, ["TxT"])
    ]),
    h("p", {}, ["TxT"])
])

const newNode = 
h('div', {}, [
    h('h1', {}, ['TxT']),
    h('div', {}, [
        h('div', {}, [
            h('div', {}, ['TxT']),
            h('p', {}, ['``']),
            h('div', {}, []),
            h('div', {}, []),
            h('div', {}, []),
            ""            
        ])
    ]),
    h('pre', {}, [
        h('code', {}, [
            h('span', {}, ['TxT']),
            '\n'
        ])
    ]),
    h('p', {}, ['TxT']),
    "\n",
    h('pre', {}, [
        h('code', {}, [
            h('span', {}, ['TxT']),
            '\n'
        ])
    ])
])

</script></body>

I'll get the error vdom?module:676 Uncaught DOMException: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.. This has also happened on numerous occasions before, I usually solve it by adding keys to elements, but in this case I can't do that...

yelouafi commented 5 years ago

cf v0.2.3