fix: [#1803] Adds previousSibling and nextSibling to MutationObserver records when a child is removed

Author: uxuip

packages/happy-dom/src/nodes/node/Node.ts

@@ -548,10 +548,6 @@ export default class Node extends EventTarget {
 			node = node[PropertySymbol.proxy];
 		}
 
-		node[PropertySymbol.parentNode] = null;
-
-		node[PropertySymbol.clearCache]();
-
 		const index = this[PropertySymbol.nodeArray].indexOf(node);
 
 		if (index === -1) {
@@ -560,6 +556,13 @@ export default class Node extends EventTarget {
 			);
 		}
 
+		const previousSibling = node.previousSibling;
+		const nextSibling = node.nextSibling;
+
+		node[PropertySymbol.parentNode] = null;
+
+		node[PropertySymbol.clearCache]();
+
 		this[PropertySymbol.nodeArray].splice(index, 1);
 
 		if (node[PropertySymbol.nodeType] === NodeTypeEnum.elementNode) {
@@ -590,7 +593,9 @@ export default class Node extends EventTarget {
 			new MutationRecord({
 				target: this[PropertySymbol.proxy] || this,
 				type: MutationTypeEnum.childList,
-				removedNodes: [node]
+				removedNodes: [node],
+				previousSibling,
+				nextSibling
 			})
 		);
 

packages/happy-dom/test/mutation-observer/MutationObserver.test.ts

@@ -196,14 +196,25 @@ describe('MutationObserver', () => {
 			const div = document.createElement('div');
 			const span = document.createElement('span');
 			const article = document.createElement('article');
+			const h1 = document.createElement('h1');
+			const h2 = document.createElement('h2');
+			const h3 = document.createElement('h3');
+			const h4 = document.createElement('h4');
 			const text = document.createTextNode('old');
 			const observer = new window.MutationObserver((mutationRecords) => {
 				records.push(mutationRecords);
 			});
 			observer.observe(div, { subtree: true, childList: true });
 			div.appendChild(text);
 			div.appendChild(span);
+			article.appendChild(h1);
+			article.appendChild(h2);
+			article.appendChild(h3);
+			article.appendChild(h4);
 			span.appendChild(article);
+			article.removeChild(h2);
+			article.removeChild(h4);
+			article.removeChild(h1);
 			span.removeChild(article);
 
 			await new Promise((resolve) => setTimeout(resolve, 1));
@@ -243,6 +254,39 @@ describe('MutationObserver', () => {
 						target: span,
 						type: 'childList'
 					},
+					{
+						addedNodes: [],
+						attributeName: null,
+						attributeNamespace: null,
+						nextSibling: h3,
+						oldValue: null,
+						previousSibling: h1,
+						removedNodes: [h2],
+						target: article,
+						type: 'childList'
+					},
+					{
+						addedNodes: [],
+						attributeName: null,
+						attributeNamespace: null,
+						nextSibling: null,
+						oldValue: null,
+						previousSibling: h3,
+						removedNodes: [h4],
+						target: article,
+						type: 'childList'
+					},
+					{
+						addedNodes: [],
+						attributeName: null,
+						attributeNamespace: null,
+						nextSibling: h3,
+						oldValue: null,
+						previousSibling: null,
+						removedNodes: [h1],
+						target: article,
+						type: 'childList'
+					},
 					{
 						addedNodes: [],
 						attributeName: null,