happy-dom 14.12.3 → 15.0.0

package/src/nodes/document/Document.ts

@@ -28,15 +28,12 @@ import Location from '../../location/Location.js';
 import Selection from '../../selection/Selection.js';
 import ShadowRoot from '../shadow-root/ShadowRoot.js';
 import Range from '../../range/Range.js';
-import HTMLBaseElement from '../html-base-element/HTMLBaseElement.js';
 import Attr from '../attr/Attr.js';
 import ProcessingInstruction from '../processing-instruction/ProcessingInstruction.js';
-import ElementUtility from '../element/ElementUtility.js';
 import VisibilityStateEnum from './VisibilityStateEnum.js';
 import NodeTypeEnum from '../node/NodeTypeEnum.js';
 import CookieStringUtility from '../../cookie/urilities/CookieStringUtility.js';
 import IBrowserFrame from '../../browser/types/IBrowserFrame.js';
-import NodeFactory from '../NodeFactory.js';
 import { URL } from 'url';
 import IHTMLElementTagNameMap from '../../config/IHTMLElementTagNameMap.js';
 import ISVGElementTagNameMap from '../../config/ISVGElementTagNameMap.js';
@@ -44,6 +41,13 @@ import SVGElement from '../svg-element/SVGElement.js';
 import HTMLFormElement from '../html-form-element/HTMLFormElement.js';
 import HTMLAnchorElement from '../html-anchor-element/HTMLAnchorElement.js';
 import HTMLElementConfig from '../../config/HTMLElementConfig.js';
+import HTMLHtmlElement from '../html-html-element/HTMLHtmlElement.js';
+import HTMLBodyElement from '../html-body-element/HTMLBodyElement.js';
+import HTMLHeadElement from '../html-head-element/HTMLHeadElement.js';
+import HTMLBaseElement from '../html-base-element/HTMLBaseElement.js';
+import ICachedResult from '../node/ICachedResult.js';
+import HTMLTitleElement from '../html-title-element/HTMLTitleElement.js';
+import NodeFactory from '../NodeFactory.js';
 
 const PROCESSING_INSTRUCTION_TARGET_REGEXP = /^[a-z][a-z0-9-]+$/;
 
@@ -51,14 +55,15 @@ const PROCESSING_INSTRUCTION_TARGET_REGEXP = /^[a-z][a-z0-9-]+$/;
  * Document.
  */
 export default class Document extends Node {
+	// Static properties
+	public static [PropertySymbol.ownerDocument]: Document = <Document>{};
+
 	// Internal properties
-	public [PropertySymbol.children]: HTMLCollection<Element> = new HTMLCollection<Element>();
+	public [PropertySymbol.children]: HTMLCollection<Element> | null = null;
 	public [PropertySymbol.activeElement]: HTMLElement | SVGElement = null;
 	public [PropertySymbol.nextActiveElement]: HTMLElement | SVGElement = null;
 	public [PropertySymbol.currentScript]: HTMLScriptElement = null;
 	public [PropertySymbol.rootNode] = this;
-	// Used as an unique identifier which is updated whenever the DOM gets modified.
-	public [PropertySymbol.cacheID] = 0;
 	public [PropertySymbol.isFirstWrite] = true;
 	public [PropertySymbol.isFirstWriteAfterOpen] = false;
 	public [PropertySymbol.nodeType] = NodeTypeEnum.documentNode;
@@ -69,7 +74,13 @@ export default class Document extends Node {
 	public [PropertySymbol.referrer] = '';
 	public [PropertySymbol.defaultView]: BrowserWindow | null = null;
 	public [PropertySymbol.ownerWindow]: BrowserWindow;
-	public cloneNode: (deep?: boolean) => Document;
+	public [PropertySymbol.forms]: HTMLCollection<HTMLFormElement> | null = null;
+	public [PropertySymbol.affectsComputedStyleCache]: ICachedResult[] = [];
+	public [PropertySymbol.elementIdMap]: Map<
+		string,
+		{ htmlCollection: HTMLCollection<Element> | null; elements: Element[] }
+	> = new Map();
+	public declare cloneNode: (deep?: boolean) => Document;
 
 	// Private properties
 	#selection: Selection = null;
@@ -197,6 +208,7 @@ export default class Document extends Node {
 		super();
 		this.#browserFrame = injected.browserFrame;
 		this[PropertySymbol.ownerWindow] = injected.window;
+		this[PropertySymbol.ownerDocument] = null;
 	}
 
 	/**
@@ -257,6 +269,13 @@ export default class Document extends Node {
 	 * Returns document children.
 	 */
 	public get children(): HTMLCollection<Element> {
+		if (!this[PropertySymbol.children]) {
+			const elements = this[PropertySymbol.elementArray];
+			this[PropertySymbol.children] = new HTMLCollection<Element>(
+				PropertySymbol.illegalConstructor,
+				() => elements
+			);
+		}
 		return this[PropertySymbol.children];
 	}
 
@@ -276,7 +295,10 @@ export default class Document extends Node {
 	 * @returns Character set.
 	 */
 	public get characterSet(): string {
-		const charset = this.querySelector('meta[charset]')?.getAttributeNS(null, 'charset');
+		const charset = QuerySelector.querySelector(this, 'meta[charset]')?.getAttributeNS(
+			null,
+			'charset'
+		);
 		return charset ? charset : 'UTF-8';
 	}
 
@@ -286,9 +308,9 @@ export default class Document extends Node {
 	 * @returns Title.
 	 */
 	public get title(): string {
-		const element = ParentNodeUtility.getElementByTagName(this, 'title');
+		const element = <HTMLTitleElement | null>ParentNodeUtility.getElementByTagName(this, 'title');
 		if (element) {
-			return element.textContent;
+			return element.text.trim();
 		}
 		return '';
 	}
@@ -312,14 +334,19 @@ export default class Document extends Node {
 	 * Returns a collection of all area elements and a elements in a document with a value for the href attribute.
 	 */
 	public get links(): NodeList<HTMLAnchorElement | HTMLElement> {
-		return <NodeList<HTMLElement>>this.querySelectorAll('a[href],area[href]');
+		return <NodeList<HTMLElement>>QuerySelector.querySelectorAll(this, 'a[href],area[href]');
 	}
 
 	/**
 	 * Returns a collection of all form elements in a document.
 	 */
 	public get forms(): HTMLCollection<HTMLFormElement> {
-		return this.getElementsByTagName('form');
+		if (!this[PropertySymbol.forms]) {
+			this[PropertySymbol.forms] = <HTMLCollection<HTMLFormElement>>(
+				ParentNodeUtility.getElementsByTagName(this, 'form')
+			);
+		}
+		return this[PropertySymbol.forms];
 	}
 
 	/**
@@ -328,7 +355,7 @@ export default class Document extends Node {
 	 * @returns Element.
 	 */
 	public get childElementCount(): number {
-		return this[PropertySymbol.children].length;
+		return this[PropertySymbol.elementArray].length;
 	}
 
 	/**
@@ -337,7 +364,7 @@ export default class Document extends Node {
 	 * @returns Element.
 	 */
 	public get firstElementChild(): Element {
-		return this[PropertySymbol.children][0] ?? null;
+		return this[PropertySymbol.elementArray][0] ?? null;
 	}
 
 	/**
@@ -346,7 +373,8 @@ export default class Document extends Node {
 	 * @returns Element.
 	 */
 	public get lastElementChild(): Element {
-		return this[PropertySymbol.children][this[PropertySymbol.children].length - 1] ?? null;
+		const children = this[PropertySymbol.elementArray];
+		return children[children.length - 1] ?? null;
 	}
 
 	/**
@@ -391,8 +419,8 @@ export default class Document extends Node {
 	 *
 	 * @returns Element.
 	 */
-	public get documentElement(): HTMLElement {
-		return <HTMLElement>ParentNodeUtility.getElementByTagName(this, 'html');
+	public get documentElement(): HTMLHtmlElement {
+		return <HTMLHtmlElement>ParentNodeUtility.getElementByTagName(this, 'html');
 	}
 
 	/**
@@ -401,7 +429,7 @@ export default class Document extends Node {
 	 * @returns Document type.
 	 */
 	public get doctype(): DocumentType {
-		for (const node of this[PropertySymbol.childNodes]) {
+		for (const node of this[PropertySymbol.nodeArray]) {
 			if (node instanceof DocumentType) {
 				return node;
 			}
@@ -414,8 +442,8 @@ export default class Document extends Node {
 	 *
 	 * @returns Element.
 	 */
-	public get body(): HTMLElement {
-		return <HTMLElement>ParentNodeUtility.getElementByTagName(this, 'body');
+	public get body(): HTMLBodyElement {
+		return <HTMLBodyElement>ParentNodeUtility.getElementByTagName(this, 'body');
 	}
 
 	/**
@@ -423,8 +451,8 @@ export default class Document extends Node {
 	 *
 	 * @returns Element.
 	 */
-	public get head(): HTMLElement {
-		return <HTMLElement>ParentNodeUtility.getElementByTagName(this, 'head');
+	public get head(): HTMLHeadElement {
+		return <HTMLHeadElement>ParentNodeUtility.getElementByTagName(this, 'head');
 	}
 
 	/**
@@ -434,7 +462,7 @@ export default class Document extends Node {
 	 */
 	public get styleSheets(): CSSStyleSheet[] {
 		const styles = <NodeList<HTMLLinkElement | HTMLStyleElement>>(
-			this.querySelectorAll('link[rel="stylesheet"][href],style')
+			QuerySelector.querySelectorAll(this, 'link[rel="stylesheet"][href],style')
 		);
 		const styleSheets = [];
 		for (const style of styles) {
@@ -510,7 +538,7 @@ export default class Document extends Node {
 	 * @returns Base URI.
 	 */
 	public get baseURI(): string {
-		const element = <HTMLBaseElement | null>ParentNodeUtility.getElementByTagName(this, 'base');
+		const element = <HTMLBaseElement>ParentNodeUtility.getElementByTagName(this, 'base');
 		if (element) {
 			return element.href;
 		}
@@ -785,7 +813,7 @@ export default class Document extends Node {
 	 * @param id ID.
 	 * @returns Matching element.
 	 */
-	public getElementById(id: string): Element {
+	public getElementById(id: string): Element | null {
 		return <Element>ParentNodeUtility.getElementById(this, id);
 	}
 
@@ -796,63 +824,7 @@ export default class Document extends Node {
 	 * @param name
 	 */
 	public getElementsByName(name: string): NodeList<Element> {
-		const getElementsByName = (
-			parentNode: Element | DocumentFragment | Document,
-			name: string
-		): NodeList<Element> => {
-			const matches = new NodeList<Element>();
-			for (const child of (<Element | Document>parentNode)[PropertySymbol.children]) {
-				if (child.getAttributeNS(null, 'name') === name) {
-					matches.push(child);
-				}
-				for (const match of getElementsByName(<Element>child, name)) {
-					matches.push(match);
-				}
-			}
-			return matches;
-		};
-		return getElementsByName(this, name);
-	}
-
-	/**
-	 * @override
-	 */
-	public override [PropertySymbol.cloneNode](deep = false): Document {
-		const clone = <Document>super[PropertySymbol.cloneNode](deep);
-
-		if (deep) {
-			for (const node of clone[PropertySymbol.childNodes]) {
-				if (node[PropertySymbol.nodeType] === NodeTypeEnum.elementNode) {
-					clone[PropertySymbol.children].push(<Element>node);
-				}
-			}
-		}
-
-		return clone;
-	}
-
-	/**
-	 * @override
-	 */
-	public override [PropertySymbol.appendChild](node: Node): Node {
-		// We do not call super here as this will be handled by ElementUtility to improve performance by avoiding validation and other checks.
-		return ElementUtility.appendChild(this, node);
-	}
-
-	/**
-	 * @override
-	 */
-	public override [PropertySymbol.removeChild](node: Node): Node {
-		// We do not call super here as this will be handled by ElementUtility to improve performance by avoiding validation and other checks.
-		return ElementUtility.removeChild(this, node);
-	}
-
-	/**
-	 * @override
-	 */
-	public override [PropertySymbol.insertBefore](newNode: Node, referenceNode: Node | null): Node {
-		// We do not call super here as this will be handled by ElementUtility to improve performance by avoiding validation and other checks.
-		return ElementUtility.insertBefore(this, newNode, referenceNode);
+		return QuerySelector.querySelectorAll(this, `[name="${name}"]`);
 	}
 
 	/**
@@ -876,7 +848,7 @@ export default class Document extends Node {
 			let documentElement = null;
 			let documentTypeNode = null;
 
-			for (const node of root[PropertySymbol.childNodes]) {
+			for (const node of root[PropertySymbol.nodeArray]) {
 				if (node['tagName'] === 'HTML') {
 					documentElement = node;
 				} else if (node[PropertySymbol.nodeType] === NodeTypeEnum.documentTypeNode) {
@@ -896,8 +868,8 @@ export default class Document extends Node {
 
 					this.appendChild(documentElement);
 
-					const head = <Element>ParentNodeUtility.getElementByTagName(this, 'head');
-					let body = <Element>ParentNodeUtility.getElementByTagName(this, 'body');
+					const head = ParentNodeUtility.getElementByTagName(this, 'head');
+					let body = ParentNodeUtility.getElementByTagName(this, 'body');
 
 					if (!body) {
 						body = this.createElement('body');
@@ -908,11 +880,12 @@ export default class Document extends Node {
 						documentElement.insertBefore(this.createElement('head'), body);
 					}
 				} else {
-					const rootBody = <Element>ParentNodeUtility.getElementByTagName(root, 'body');
+					const rootBody = ParentNodeUtility.getElementByTagName(root, 'body');
 					const body = ParentNodeUtility.getElementByTagName(this, 'body');
 					if (rootBody && body) {
-						for (const child of rootBody[PropertySymbol.childNodes].slice()) {
-							body.appendChild(child);
+						const childNodes = rootBody[PropertySymbol.nodeArray];
+						while (childNodes.length) {
+							body.appendChild(childNodes[0]);
 						}
 					}
 				}
@@ -920,7 +893,9 @@ export default class Document extends Node {
 				// Remaining nodes outside the <html> element are added to the <body> element.
 				const body = ParentNodeUtility.getElementByTagName(this, 'body');
 				if (body) {
-					for (const child of root[PropertySymbol.childNodes].slice()) {
+					const childNodes = root[PropertySymbol.nodeArray];
+					while (childNodes.length) {
+						const child = childNodes[0];
 						if (
 							child['tagName'] !== 'HTML' &&
 							child[PropertySymbol.nodeType] !== NodeTypeEnum.documentTypeNode
@@ -933,9 +908,10 @@ export default class Document extends Node {
 				const documentElement = this.createElement('html');
 				const bodyElement = this.createElement('body');
 				const headElement = this.createElement('head');
+				const childNodes = root[PropertySymbol.nodeArray];
 
-				for (const child of root[PropertySymbol.childNodes].slice()) {
-					bodyElement.appendChild(child);
+				while (childNodes.length) {
+					bodyElement.appendChild(childNodes[0]);
 				}
 
 				documentElement.appendChild(headElement);
@@ -946,8 +922,9 @@ export default class Document extends Node {
 		} else {
 			const bodyNode = ParentNodeUtility.getElementByTagName(root, 'body');
 			const body = ParentNodeUtility.getElementByTagName(this, 'body');
-			for (const child of (<Element>(bodyNode || root))[PropertySymbol.childNodes].slice()) {
-				body.appendChild(child);
+			const childNodes = (<Element>(bodyNode || root))[PropertySymbol.nodeArray];
+			while (childNodes.length) {
+				body.appendChild(childNodes[0]);
 			}
 		}
 	}
@@ -969,8 +946,9 @@ export default class Document extends Node {
 			}
 		}
 
-		for (const child of this[PropertySymbol.childNodes].slice()) {
-			this.removeChild(child);
+		const childNodes = this[PropertySymbol.nodeArray];
+		while (childNodes.length) {
+			this.removeChild(childNodes[0]);
 		}
 
 		return this;
@@ -1100,17 +1078,19 @@ export default class Document extends Node {
 
 		// SVG element
 		if (namespaceURI === NamespaceURI.svg) {
-			const element = NodeFactory.createNode<SVGElement>(
-				this,
+			const elementClass =
 				qualifiedName === 'svg'
 					? this[PropertySymbol.ownerWindow].SVGSVGElement
-					: this[PropertySymbol.ownerWindow].SVGElement
-			);
+					: this[PropertySymbol.ownerWindow].SVGElement;
+
+			const element = NodeFactory.createNode<SVGElement>(this, elementClass);
+
 			element[PropertySymbol.tagName] = qualifiedName;
 			element[PropertySymbol.localName] = qualifiedName;
 			element[PropertySymbol.namespaceURI] = namespaceURI;
 			element[PropertySymbol.isValue] = options && options.is ? String(options.is) : null;
-			return <HTMLElement>(<unknown>element);
+
+			return element;
 		}
 
 		// Custom HTML element
@@ -1135,7 +1115,7 @@ export default class Document extends Node {
 
 		// Known HTML element
 		if (elementClass) {
-			const element = NodeFactory.createNode<HTMLElement>(this, elementClass);
+			const element = NodeFactory.createNode<Element>(this, elementClass);
 
 			element[PropertySymbol.tagName] = qualifiedName.toUpperCase();
 			element[PropertySymbol.localName] = localName;
@@ -1146,20 +1126,18 @@ export default class Document extends Node {
 		}
 
 		// Unknown HTML element
-		const element = NodeFactory.createNode<Element>(
-			this,
-			// If the tag name contains a hyphen, it is an unknown custom element and we should use HTMLElement.
-			localName.includes('-')
-				? this[PropertySymbol.ownerWindow].HTMLElement
-				: this[PropertySymbol.ownerWindow].HTMLUnknownElement
-		);
+		const unknownElementClass = localName.includes('-')
+			? this[PropertySymbol.ownerWindow].HTMLElement
+			: this[PropertySymbol.ownerWindow].HTMLUnknownElement;
+
+		const element = NodeFactory.createNode<Element>(this, unknownElementClass);
 
 		element[PropertySymbol.tagName] = qualifiedName.toUpperCase();
 		element[PropertySymbol.localName] = localName;
 		element[PropertySymbol.namespaceURI] = namespaceURI;
 		element[PropertySymbol.isValue] = options && options.is ? String(options.is) : null;
 
-		return <HTMLElement>element;
+		return element;
 	}
 
 	/* eslint-enable jsdoc/valid-types */
@@ -1176,7 +1154,7 @@ export default class Document extends Node {
 				`Failed to execute 'createTextNode' on 'Document': 1 argument required, but only ${arguments.length} present.`
 			);
 		}
-		return NodeFactory.createNode<Text>(this, this[PropertySymbol.ownerWindow].Text, String(data));
+		return new this[PropertySymbol.ownerWindow].Text(String(data));
 	}
 
 	/**
@@ -1186,7 +1164,12 @@ export default class Document extends Node {
 	 * @returns Text node.
 	 */
 	public createComment(data?: string): Comment {
-		return NodeFactory.createNode<Comment>(this, this[PropertySymbol.ownerWindow].Comment, data);
+		if (arguments.length < 1) {
+			throw new TypeError(
+				`Failed to execute 'createComment' on 'Document': 1 argument required, but only ${arguments.length} present.`
+			);
+		}
+		return new this[PropertySymbol.ownerWindow].Comment(String(data));
 	}
 
 	/**
@@ -1253,9 +1236,14 @@ export default class Document extends Node {
 	 */
 	public createAttributeNS(namespaceURI: string, qualifiedName: string): Attr {
 		const attribute = NodeFactory.createNode<Attr>(this, this[PropertySymbol.ownerWindow].Attr);
+
+		const parts = qualifiedName.split(':');
 		attribute[PropertySymbol.namespaceURI] = namespaceURI;
 		attribute[PropertySymbol.name] = qualifiedName;
-		return <Attr>attribute;
+		attribute[PropertySymbol.localName] = parts[1] ?? qualifiedName;
+		attribute[PropertySymbol.prefix] = parts[0] ?? null;
+
+		return attribute;
 	}
 
 	/**
@@ -1330,6 +1318,15 @@ export default class Document extends Node {
 	 * @returns ProcessingInstruction.
 	 */
 	public createProcessingInstruction(target: string, data: string): ProcessingInstruction {
+		if (arguments.length < 2) {
+			throw new TypeError(
+				`Failed to execute 'createProcessingInstruction' on 'Document': 2 arguments required, but only ${arguments.length} present.`
+			);
+		}
+
+		target = String(target);
+		data = String(data);
+
 		if (!target || !PROCESSING_INSTRUCTION_TARGET_REGEXP.test(target)) {
 			throw new DOMException(
 				`Failed to execute 'createProcessingInstruction' on 'Document': The target provided ('${target}') is not a valid name.`
@@ -1340,13 +1337,16 @@ export default class Document extends Node {
 				`Failed to execute 'createProcessingInstruction' on 'Document': The data provided ('?>') contains '?>'`
 			);
 		}
-		const processingInstruction = NodeFactory.createNode<ProcessingInstruction>(
+
+		const element = NodeFactory.createNode<ProcessingInstruction>(
 			this,
-			this[PropertySymbol.ownerWindow].ProcessingInstruction,
-			data
+			this[PropertySymbol.ownerWindow].ProcessingInstruction
 		);
-		processingInstruction[PropertySymbol.target] = target;
-		return processingInstruction;
+
+		element[PropertySymbol.data] = data;
+		element[PropertySymbol.target] = target;
+
+		return element;
 	}
 
 	/**
@@ -1368,7 +1368,7 @@ export default class Document extends Node {
 	#importNode(node: Node): void {
 		node[PropertySymbol.ownerDocument] = this;
 
-		for (const child of node[PropertySymbol.childNodes]) {
+		for (const child of node[PropertySymbol.nodeArray]) {
 			this.#importNode(child);
 		}
 	}

package/src/nodes/document-fragment/DocumentFragment.ts

@@ -4,25 +4,31 @@ import Element from '../element/Element.js';
 import QuerySelector from '../../query-selector/QuerySelector.js';
 import ParentNodeUtility from '../parent-node/ParentNodeUtility.js';
 import HTMLCollection from '../element/HTMLCollection.js';
-import ElementUtility from '../element/ElementUtility.js';
-import NodeList from '../node/NodeList.js';
 import NodeTypeEnum from '../node/NodeTypeEnum.js';
 import IHTMLElementTagNameMap from '../../config/IHTMLElementTagNameMap.js';
 import ISVGElementTagNameMap from '../../config/ISVGElementTagNameMap.js';
+import NodeList from '../node/NodeList.js';
 
 /**
  * DocumentFragment.
  */
 export default class DocumentFragment extends Node {
-	public readonly [PropertySymbol.children]: HTMLCollection<Element> = new HTMLCollection();
+	public [PropertySymbol.children]: HTMLCollection<Element> | null = null;
 	public [PropertySymbol.rootNode]: Node = this;
 	public [PropertySymbol.nodeType] = NodeTypeEnum.documentFragmentNode;
-	public cloneNode: (deep?: boolean) => DocumentFragment;
+	public declare cloneNode: (deep?: boolean) => DocumentFragment;
 
 	/**
 	 * Returns the document fragment children.
 	 */
 	public get children(): HTMLCollection<Element> {
+		if (!this[PropertySymbol.children]) {
+			const elements = this[PropertySymbol.elementArray];
+			this[PropertySymbol.children] = new HTMLCollection<Element>(
+				PropertySymbol.illegalConstructor,
+				() => elements
+			);
+		}
 		return this[PropertySymbol.children];
 	}
 
@@ -32,7 +38,7 @@ export default class DocumentFragment extends Node {
 	 * @returns Element.
 	 */
 	public get childElementCount(): number {
-		return this[PropertySymbol.children].length;
+		return this[PropertySymbol.elementArray].length;
 	}
 
 	/**
@@ -41,7 +47,7 @@ export default class DocumentFragment extends Node {
 	 * @returns Element.
 	 */
 	public get firstElementChild(): Element {
-		return this[PropertySymbol.children][0] ?? null;
+		return this[PropertySymbol.elementArray][0] ?? null;
 	}
 
 	/**
@@ -50,7 +56,8 @@ export default class DocumentFragment extends Node {
 	 * @returns Element.
 	 */
 	public get lastElementChild(): Element {
-		return this[PropertySymbol.children][this[PropertySymbol.children].length - 1] ?? null;
+		const children = this[PropertySymbol.elementArray];
+		return children[children.length - 1] ?? null;
 	}
 
 	/**
@@ -60,7 +67,7 @@ export default class DocumentFragment extends Node {
 	 */
 	public get textContent(): string {
 		let result = '';
-		for (const childNode of this[PropertySymbol.childNodes]) {
+		for (const childNode of this[PropertySymbol.nodeArray]) {
 			if (
 				childNode[PropertySymbol.nodeType] === NodeTypeEnum.elementNode ||
 				childNode[PropertySymbol.nodeType] === NodeTypeEnum.textNode
@@ -77,8 +84,9 @@ export default class DocumentFragment extends Node {
 	 * @param textContent Text content.
 	 */
 	public set textContent(textContent: string) {
-		for (const child of this[PropertySymbol.childNodes].slice()) {
-			this.removeChild(child);
+		const childNodes = this[PropertySymbol.nodeArray];
+		while (childNodes.length) {
+			this.removeChild(childNodes[0]);
 		}
 		if (textContent) {
 			this.appendChild(this[PropertySymbol.ownerDocument].createTextNode(textContent));
@@ -194,48 +202,7 @@ export default class DocumentFragment extends Node {
 	 * @param id ID.
 	 * @returns Matching element.
 	 */
-	public getElementById(id: string): Element {
+	public getElementById(id: string): Element | null {
 		return ParentNodeUtility.getElementById(this, id);
 	}
-
-	/**
-	 * @override
-	 */
-	public override [PropertySymbol.cloneNode](deep = false): DocumentFragment {
-		const clone = <DocumentFragment>super[PropertySymbol.cloneNode](deep);
-
-		if (deep) {
-			for (const node of clone[PropertySymbol.childNodes]) {
-				if (node[PropertySymbol.nodeType] === NodeTypeEnum.elementNode) {
-					clone[PropertySymbol.children].push(<Element>node);
-				}
-			}
-		}
-
-		return <DocumentFragment>clone;
-	}
-
-	/**
-	 * @override
-	 */
-	public override [PropertySymbol.appendChild](node: Node): Node {
-		// We do not call super here as this will be handled by ElementUtility to improve performance by avoiding validation and other checks.
-		return ElementUtility.appendChild(this, node);
-	}
-
-	/**
-	 * @override
-	 */
-	public override [PropertySymbol.removeChild](node: Node): Node {
-		// We do not call super here as this will be handled by ElementUtility to improve performance by avoiding validation and other checks.
-		return ElementUtility.removeChild(this, node);
-	}
-
-	/**
-	 * @override
-	 */
-	public override [PropertySymbol.insertBefore](newNode: Node, referenceNode: Node | null): Node {
-		// We do not call super here as this will be handled by ElementUtility to improve performance by avoiding validation and other checks.
-		return ElementUtility.insertBefore(this, newNode, referenceNode);
-	}
 }

package/src/nodes/document-type/DocumentType.ts

@@ -10,7 +10,7 @@ export default class DocumentType extends Node {
 	public [PropertySymbol.name] = '';
 	public [PropertySymbol.publicId] = '';
 	public [PropertySymbol.systemId] = '';
-	public cloneNode: (deep?: boolean) => DocumentType;
+	public declare cloneNode: (deep?: boolean) => DocumentType;
 
 	/**
 	 * Returns name.