Maximum call stack size exceeded when appending parent to child

[sionzee]

Describe the bug
Whenever you try to move the parent to the child node and listen to the mutation observer on that node, you will end up in a recursive call. The child will have a parent node, and the parent node will have the child node in childList.

To Reproduce
Quick reproduction code:

const i = document.createElement('i')
new MutationObserver((mutations) => {}).observe(i, {subtree: true, childList: true, attributeOldValue: true, attributes: true, characterData: true, characterDataOldValue: true})

const b = document.createElement('b')
i.appendChild(b)

// Woops -- Mistake
b.appendChild(i)

// Fix the mistake
i.appendChild(b)

Expected behavior
The parent should be appended to the child, and the child's parent should be set to null or the parent element of the parent. In my code, the parent is temporarily null, and I will append it later to the existing node. It is worth checking what the original DOM is doing in this case and going that way.

Additional context

The error:

RangeError: Maximum call stack size exceeded
 ❯ HTMLElement._observe ../../node_modules/.pnpm/happy-dom@7.6.6/node_modules/happy-dom/lib/nodes/node/Node.js:408:25
 ❯ HTMLElement._observe ../../node_modules/.pnpm/happy-dom@7.6.6/node_modules/happy-dom/lib/nodes/node/Node.js:411:22
 ❯ HTMLElement._observe ../../node_modules/.pnpm/happy-dom@7.6.6/node_modules/happy-dom/lib/nodes/node/Node.js:411:22
 ❯ HTMLElement._observe ../../node_modules/.pnpm/happy-dom@7.6.6/node_modules/happy-dom/lib/nodes/node/Node.js:411:22
 ❯ HTMLElement._observe ../../node_modules/.pnpm/happy-dom@7.6.6/node_modules/happy-dom/lib/nodes/node/Node.js:411:22
 ❯ HTMLElement._observe ../../node_modules/.pnpm/happy-dom@7.6.6/node_modules/happy-dom/lib/nodes/node/Node.js:411:22
...

I was debugging the code, and it is stuck in the Node.ts file on this function:

	public _observe(listener: MutationListener): void {
		this._observers.push(listener);
		if (listener.options.subtree) {
			for (const node of this.childNodes) {
				(<Node>node)._observe(listener);  // <------ node === this.parentNode
			}
		}
	}

[capricorn86]

Thank you for reporting @sionzee! 🙂

Big thanks to @btea for your contribution! 🌟

You can read more about the release here:
https://github.com/capricorn86/happy-dom/releases/tag/v9.8.3