happy-dom 13.3.8 → 13.4.1

package/src/custom-element/CustomElementRegistry.ts

@@ -10,44 +10,54 @@ export default class CustomElementRegistry {
 	public [PropertySymbol.registry]: {
 		[k: string]: { elementClass: typeof HTMLElement; extends: string };
 	} = {};
+	public [PropertySymbol.registedClass]: Map<typeof HTMLElement, string> = new Map();
 	public [PropertySymbol.callbacks]: { [k: string]: (() => void)[] } = {};
 
 	/**
 	 * Defines a custom element class.
 	 *
-	 * @param tagName Tag name of element.
+	 * @param name Tag name of element.
 	 * @param elementClass Element class.
 	 * @param [options] Options.
-	 * @param options.extends
+	 * @param [options.extends] Extends tag name.
 	 */
 	public define(
-		tagName: string,
+		name: string,
 		elementClass: typeof HTMLElement,
-		options?: { extends: string }
+		options?: { extends?: string }
 	): void {
-		const upperTagName = tagName.toUpperCase();
+		if (!this.#isValidCustomElementName(name)) {
+			throw new DOMException(
+				`Failed to execute 'define' on 'CustomElementRegistry': "${name}" is not a valid custom element name`
+			);
+		}
+
+		if (this[PropertySymbol.registry][name]) {
+			throw new DOMException(
+				`Failed to execute 'define' on 'CustomElementRegistry': the name "${name}" has already been used with this registry`
+			);
+		}
 
-		if (!upperTagName.includes('-')) {
+		if (this[PropertySymbol.registedClass].has(elementClass)) {
 			throw new DOMException(
-				"Failed to execute 'define' on 'CustomElementRegistry': \"" +
-					tagName +
-					'" is not a valid custom element name.'
+				"Failed to execute 'define' on 'CustomElementRegistry': this constructor has already been used with this registry"
 			);
 		}
 
-		this[PropertySymbol.registry][upperTagName] = {
+		this[PropertySymbol.registry][name] = {
 			elementClass,
 			extends: options && options.extends ? options.extends.toLowerCase() : null
 		};
+		this[PropertySymbol.registedClass].set(elementClass, name);
 
 		// ObservedAttributes should only be called once by CustomElementRegistry (see #117)
 		if (elementClass.prototype.attributeChangedCallback) {
 			elementClass[PropertySymbol.observedAttributes] = elementClass.observedAttributes;
 		}
 
-		if (this[PropertySymbol.callbacks][upperTagName]) {
-			const callbacks = this[PropertySymbol.callbacks][upperTagName];
-			delete this[PropertySymbol.callbacks][upperTagName];
+		if (this[PropertySymbol.callbacks][name]) {
+			const callbacks = this[PropertySymbol.callbacks][name];
+			delete this[PropertySymbol.callbacks][name];
 			for (const callback of callbacks) {
 				callback();
 			}
@@ -57,14 +67,11 @@ export default class CustomElementRegistry {
 	/**
 	 * Returns a defined element class.
 	 *
-	 * @param tagName Tag name of element.
-	 * @param HTMLElement Class defined.
+	 * @param name Tag name of element.
+	 * @returns HTMLElement Class defined or undefined.
 	 */
-	public get(tagName: string): typeof HTMLElement {
-		const upperTagName = tagName.toUpperCase();
-		return this[PropertySymbol.registry][upperTagName]
-			? this[PropertySymbol.registry][upperTagName].elementClass
-			: undefined;
+	public get(name: string): typeof HTMLElement | undefined {
+		return this[PropertySymbol.registry][name]?.elementClass;
 	}
 
 	/**
@@ -81,18 +88,59 @@ export default class CustomElementRegistry {
 	/**
 	 * When defined.
 	 *
-	 * @param tagName Tag name of element.
-	 * @returns Promise.
+	 * @param name Tag name of element.
 	 */
-	public whenDefined(tagName: string): Promise<void> {
-		const upperTagName = tagName.toUpperCase();
-		if (this.get(upperTagName)) {
+	public whenDefined(name: string): Promise<void> {
+		if (!this.#isValidCustomElementName(name)) {
+			return Promise.reject(new DOMException(`Invalid custom element name: "${name}"`));
+		}
+		if (this.get(name)) {
 			return Promise.resolve();
 		}
 		return new Promise((resolve) => {
-			this[PropertySymbol.callbacks][upperTagName] =
-				this[PropertySymbol.callbacks][upperTagName] || [];
-			this[PropertySymbol.callbacks][upperTagName].push(resolve);
+			this[PropertySymbol.callbacks][name] = this[PropertySymbol.callbacks][name] || [];
+			this[PropertySymbol.callbacks][name].push(resolve);
 		});
 	}
+
+	/**
+	 * Reverse lookup searching for name by given element class.
+	 *
+	 * @param elementClass Class constructor.
+	 * @returns Found tag name or `null`.
+	 */
+	public getName(elementClass: typeof HTMLElement): string | null {
+		return this[PropertySymbol.registedClass].get(elementClass) || null;
+	}
+
+	/**
+	 * Validates the correctness of custom element tag names.
+	 *
+	 * @param name Custom element tag name.
+	 * @returns True, if tag name is standard compliant.
+	 */
+	#isValidCustomElementName(name: string): boolean {
+		// Validation criteria based on:
+		// https://html.spec.whatwg.org/multipage/custom-elements.html#valid-custom-element-name
+		const PCENChar =
+			'[-_.]|[0-9]|[a-z]|\u{B7}|[\u{C0}-\u{D6}]|[\u{D8}-\u{F6}]' +
+			'|[\u{F8}-\u{37D}]|[\u{37F}-\u{1FFF}]' +
+			'|[\u{200C}-\u{200D}]|[\u{203F}-\u{2040}]|[\u{2070}-\u{218F}]' +
+			'|[\u{2C00}-\u{2FEF}]|[\u{3001}-\u{D7FF}]' +
+			'|[\u{F900}-\u{FDCF}]|[\u{FDF0}-\u{FFFD}]|[\u{10000}-\u{EFFFF}]';
+
+		const PCEN = new RegExp(`^[a-z](${PCENChar})*-(${PCENChar})*$`, 'u');
+
+		const reservedNames = [
+			'annotation-xml',
+			'color-profile',
+			'font-face',
+			'font-face-src',
+			'font-face-uri',
+			'font-face-format',
+			'font-face-name',
+			'missing-glyph'
+		];
+		return PCEN.test(name) && !reservedNames.includes(name);
+	}
 }

package/src/navigator/Navigator.ts

@@ -77,7 +77,9 @@ export default class Navigator {
 	 * Maximum number of simultaneous touch contact points are supported by the current device.
 	 */
 	public get maxTouchPoints(): number {
-		return WindowBrowserSettingsReader.getSettings(this.#ownerWindow).navigator.maxTouchPoints;
+		return (
+			WindowBrowserSettingsReader.getSettings(this.#ownerWindow)?.navigator.maxTouchPoints || 0
+		);
 	}
 
 	/**
@@ -154,7 +156,7 @@ export default class Navigator {
 	 * "appCodeName/appVersion number (Platform; Security; OS-or-CPU; Localization; rv: revision-version-number) product/productSub Application-Name Application-Name-version".
 	 */
 	public get userAgent(): string {
-		return WindowBrowserSettingsReader.getSettings(this.#ownerWindow).navigator.userAgent;
+		return WindowBrowserSettingsReader.getSettings(this.#ownerWindow)?.navigator.userAgent || '';
 	}
 
 	/**

package/src/nodes/document/Document.ts

@@ -1,6 +1,5 @@
 import Element from '../element/Element.js';
 import * as PropertySymbol from '../../PropertySymbol.js';
-import HTMLUnknownElement from '../html-unknown-element/HTMLUnknownElement.js';
 import IBrowserWindow from '../../window/IBrowserWindow.js';
 import Node from '../node/Node.js';
 import NodeIterator from '../../tree-walker/NodeIterator.js';
@@ -9,7 +8,7 @@ import DocumentFragment from '../document-fragment/DocumentFragment.js';
 import XMLParser from '../../xml-parser/XMLParser.js';
 import Event from '../../event/Event.js';
 import DOMImplementation from '../../dom-implementation/DOMImplementation.js';
-import ElementTag from '../../config/ElementTag.js';
+import HTMLElementLocalNameToClass from '../../config/HTMLElementLocalNameToClass.js';
 import INodeFilter from '../../tree-walker/INodeFilter.js';
 import NamespaceURI from '../../config/NamespaceURI.js';
 import DocumentType from '../document-type/DocumentType.js';
@@ -879,28 +878,73 @@ export default class Document extends Node implements IDocument {
 		qualifiedName: string,
 		options?: { is?: string }
 	): IElement {
-		const tagName = String(qualifiedName).toUpperCase();
+		qualifiedName = String(qualifiedName);
 
-		let customElementClass;
-		if (options && options.is) {
-			customElementClass = this[PropertySymbol.ownerWindow].customElements.get(String(options.is));
-		} else {
-			customElementClass = this[PropertySymbol.ownerWindow].customElements.get(tagName);
+		if (!qualifiedName) {
+			throw new DOMException(
+				"Failed to execute 'createElementNS' on 'Document': The qualified name provided is empty."
+			);
+		}
+
+		// SVG element
+		if (namespaceURI === NamespaceURI.svg) {
+			const element = NodeFactory.createNode<IElement>(
+				this,
+				qualifiedName === 'svg'
+					? this[PropertySymbol.ownerWindow].SVGSVGElement
+					: this[PropertySymbol.ownerWindow].SVGElement
+			);
+			element[PropertySymbol.tagName] = qualifiedName;
+			element[PropertySymbol.localName] = qualifiedName;
+			element[PropertySymbol.namespaceURI] = namespaceURI;
+			element[PropertySymbol.isValue] = options && options.is ? String(options.is) : null;
+			return element;
 		}
 
-		const elementClass: typeof Element =
-			customElementClass ||
-			this[PropertySymbol.ownerWindow][ElementTag[tagName]] ||
-			HTMLUnknownElement;
+		// Custom HTML element
+		const customElement =
+			this[PropertySymbol.ownerWindow].customElements[PropertySymbol.registry]?.[
+				options && options.is ? String(options.is) : qualifiedName
+			];
+
+		if (customElement) {
+			const element = NodeFactory.createNode<IElement>(this, customElement.elementClass);
+			element[PropertySymbol.tagName] = qualifiedName.toUpperCase();
+			element[PropertySymbol.localName] = qualifiedName;
+			element[PropertySymbol.namespaceURI] = namespaceURI;
+			element[PropertySymbol.isValue] = options && options.is ? String(options.is) : null;
+			return element;
+		}
 
-		const element = NodeFactory.createNode<IElement>(this, elementClass);
-		element[PropertySymbol.tagName] = tagName;
+		const localName = qualifiedName.toLowerCase();
+		const elementClass = this[PropertySymbol.ownerWindow][HTMLElementLocalNameToClass[localName]];
 
-		element[PropertySymbol.namespaceURI] = namespaceURI;
-		if (element instanceof Element && options && options.is) {
-			element[PropertySymbol.isValue] = String(options.is);
+		// Known HTML element
+		if (elementClass) {
+			const element = NodeFactory.createNode<IElement>(this, elementClass);
+
+			element[PropertySymbol.tagName] = qualifiedName.toUpperCase();
+			element[PropertySymbol.localName] = localName;
+			element[PropertySymbol.namespaceURI] = namespaceURI;
+			element[PropertySymbol.isValue] = options && options.is ? String(options.is) : null;
+
+			return element;
 		}
 
+		// Unknown HTML element
+		const element = NodeFactory.createNode<IElement>(
+			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
+		);
+
+		element[PropertySymbol.tagName] = qualifiedName.toUpperCase();
+		element[PropertySymbol.localName] = localName;
+		element[PropertySymbol.namespaceURI] = namespaceURI;
+		element[PropertySymbol.isValue] = options && options.is ? String(options.is) : null;
+
 		return element;
 	}
 

package/src/nodes/element/Element.ts

@@ -87,6 +87,7 @@ export default class Element extends Node implements IElement {
 	public [PropertySymbol.computedStyle]: CSSStyleDeclaration | null = null;
 	public [PropertySymbol.nodeType] = NodeTypeEnum.elementNode;
 	public [PropertySymbol.tagName]: string | null = null;
+	public [PropertySymbol.localName]: string | null = null;
 	public [PropertySymbol.prefix]: string | null = null;
 	public [PropertySymbol.shadowRoot]: IShadowRoot | null = null;
 	public [PropertySymbol.scrollHeight] = 0;
@@ -266,7 +267,7 @@ export default class Element extends Node implements IElement {
 	 * @returns Local name.
 	 */
 	public get localName(): string {
-		return this[PropertySymbol.tagName] ? this[PropertySymbol.tagName].toLowerCase() : 'unknown';
+		return this[PropertySymbol.localName];
 	}
 
 	/**
@@ -486,6 +487,7 @@ export default class Element extends Node implements IElement {
 		}
 
 		clone[PropertySymbol.tagName] = this[PropertySymbol.tagName];
+		clone[PropertySymbol.localName] = this[PropertySymbol.localName];
 		clone[PropertySymbol.namespaceURI] = this[PropertySymbol.namespaceURI];
 
 		return <IElement>clone;

package/src/nodes/html-element/HTMLElement.ts

@@ -10,6 +10,12 @@ import Event from '../../event/Event.js';
 import HTMLElementUtility from './HTMLElementUtility.js';
 import INamedNodeMap from '../../named-node-map/INamedNodeMap.js';
 import HTMLElementNamedNodeMap from './HTMLElementNamedNodeMap.js';
+import INodeList from '../node/INodeList.js';
+import INode from '../node/INode.js';
+import IHTMLCollection from '../element/IHTMLCollection.js';
+import IElement from '../element/IElement.js';
+import NodeList from '../node/NodeList.js';
+import HTMLCollection from '../element/HTMLCollection.js';
 
 /**
  * HTML Element.
@@ -62,6 +68,7 @@ export default class HTMLElement extends Element implements IHTMLElement {
 
 	// Private properties
 	#dataset: Dataset = null;
+	#customElementDefineCallback: () => void = null;
 
 	/**
 	 * Returns access key.
@@ -473,4 +480,124 @@ export default class HTMLElement extends Element implements IHTMLElement {
 
 		return clone;
 	}
+
+	/**
+	 * Connects this element to another element.
+	 *
+	 * @see https://html.spec.whatwg.org/multipage/dom.html#htmlelement
+	 * @param parentNode Parent node.
+	 */
+	public [PropertySymbol.connectToNode](parentNode: INode = null): void {
+		const localName = this[PropertySymbol.localName];
+
+		// This element can potentially be a custom element that has not been defined yet
+		// Therefore we need to register a callback for when it is defined in CustomElementRegistry and replace it with the registered element (see #404)
+		if (
+			this.constructor === HTMLElement &&
+			localName.includes('-') &&
+			this[PropertySymbol.ownerDocument][PropertySymbol.ownerWindow].customElements[
+				PropertySymbol.callbacks
+			]
+		) {
+			const callbacks =
+				this[PropertySymbol.ownerDocument][PropertySymbol.ownerWindow].customElements[
+					PropertySymbol.callbacks
+				];
+
+			if (parentNode && !this.#customElementDefineCallback) {
+				const callback = (): void => {
+					if (this[PropertySymbol.parentNode]) {
+						const newElement = <HTMLElement>(
+							this[PropertySymbol.ownerDocument].createElement(localName)
+						);
+						(<INodeList<INode>>newElement[PropertySymbol.childNodes]) =
+							this[PropertySymbol.childNodes];
+						(<IHTMLCollection<IElement>>newElement[PropertySymbol.children]) =
+							this[PropertySymbol.children];
+						(<boolean>newElement[PropertySymbol.isConnected]) = this[PropertySymbol.isConnected];
+
+						newElement[PropertySymbol.rootNode] = this[PropertySymbol.rootNode];
+						newElement[PropertySymbol.formNode] = this[PropertySymbol.formNode];
+						newElement[PropertySymbol.selectNode] = this[PropertySymbol.selectNode];
+						newElement[PropertySymbol.textAreaNode] = this[PropertySymbol.textAreaNode];
+						newElement[PropertySymbol.observers] = this[PropertySymbol.observers];
+						newElement[PropertySymbol.isValue] = this[PropertySymbol.isValue];
+
+						for (let i = 0, max = this[PropertySymbol.attributes].length; i < max; i++) {
+							newElement[PropertySymbol.attributes].setNamedItem(
+								this[PropertySymbol.attributes][i]
+							);
+						}
+
+						(<INodeList<INode>>this[PropertySymbol.childNodes]) = new NodeList();
+						(<IHTMLCollection<IElement>>this[PropertySymbol.children]) = new HTMLCollection();
+						this[PropertySymbol.rootNode] = null;
+						this[PropertySymbol.formNode] = null;
+						this[PropertySymbol.selectNode] = null;
+						this[PropertySymbol.textAreaNode] = null;
+						this[PropertySymbol.observers] = [];
+						this[PropertySymbol.isValue] = null;
+						(<HTMLElementNamedNodeMap>this[PropertySymbol.attributes]) =
+							new HTMLElementNamedNodeMap(this);
+
+						for (
+							let i = 0,
+								max = (<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.childNodes]
+									.length;
+							i < max;
+							i++
+						) {
+							if (
+								(<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.childNodes][i] ===
+								this
+							) {
+								(<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.childNodes][i] =
+									newElement;
+								break;
+							}
+						}
+
+						if ((<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.children]) {
+							for (
+								let i = 0,
+									max = (<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.children]
+										.length;
+								i < max;
+								i++
+							) {
+								if (
+									(<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.children][i] ===
+									this
+								) {
+									(<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.children][i] =
+										newElement;
+									break;
+								}
+							}
+						}
+
+						if (newElement[PropertySymbol.isConnected] && newElement.connectedCallback) {
+							newElement.connectedCallback();
+						}
+
+						this[PropertySymbol.connectToNode](null);
+					}
+				};
+				callbacks[localName] = callbacks[localName] || [];
+				callbacks[localName].push(callback);
+				this.#customElementDefineCallback = callback;
+			} else if (!parentNode && callbacks[localName] && this.#customElementDefineCallback) {
+				const index = callbacks[localName].indexOf(this.#customElementDefineCallback);
+				if (index !== -1) {
+					callbacks[localName].splice(index, 1);
+				}
+				if (!callbacks[localName].length) {
+					delete callbacks[localName];
+				}
+				this.#customElementDefineCallback = null;
+			}
+		}
+
+		super[PropertySymbol.connectToNode](parentNode);
+	}
 }

package/src/nodes/html-unknown-element/HTMLUnknownElement.ts

@@ -1,13 +1,5 @@
 import HTMLElement from '../html-element/HTMLElement.js';
-import * as PropertySymbol from '../../PropertySymbol.js';
-import INode from '../node/INode.js';
 import IHTMLElement from '../html-element/IHTMLElement.js';
-import INodeList from '../node/INodeList.js';
-import IHTMLCollection from '../element/IHTMLCollection.js';
-import IElement from '../element/IElement.js';
-import NodeList from '../node/NodeList.js';
-import HTMLCollection from '../element/HTMLCollection.js';
-import HTMLElementNamedNodeMap from '../html-element/HTMLElementNamedNodeMap.js';
 
 /**
  * HTML Unknown Element.
@@ -15,124 +7,4 @@ import HTMLElementNamedNodeMap from '../html-element/HTMLElementNamedNodeMap.js'
  * Reference:
  * https://developer.mozilla.org/en-US/docs/Web/API/HTMLUnknownElement.
  */
-export default class HTMLUnknownElement extends HTMLElement implements IHTMLElement {
-	#customElementDefineCallback: () => void = null;
-
-	/**
-	 * Connects this element to another element.
-	 *
-	 * @param parentNode Parent node.
-	 */
-	public [PropertySymbol.connectToNode](parentNode: INode = null): void {
-		const tagName = this[PropertySymbol.tagName];
-
-		// This element can potentially be a custom element that has not been defined yet
-		// Therefore we need to register a callback for when it is defined in CustomElementRegistry and replace it with the registered element (see #404)
-		if (
-			tagName.includes('-') &&
-			this[PropertySymbol.ownerDocument][PropertySymbol.ownerWindow].customElements[
-				PropertySymbol.callbacks
-			]
-		) {
-			const callbacks =
-				this[PropertySymbol.ownerDocument][PropertySymbol.ownerWindow].customElements[
-					PropertySymbol.callbacks
-				];
-
-			if (parentNode && !this.#customElementDefineCallback) {
-				const callback = (): void => {
-					if (this[PropertySymbol.parentNode]) {
-						const newElement = <HTMLElement>(
-							this[PropertySymbol.ownerDocument].createElement(tagName)
-						);
-						(<INodeList<INode>>newElement[PropertySymbol.childNodes]) =
-							this[PropertySymbol.childNodes];
-						(<IHTMLCollection<IElement>>newElement[PropertySymbol.children]) =
-							this[PropertySymbol.children];
-						(<boolean>newElement[PropertySymbol.isConnected]) = this[PropertySymbol.isConnected];
-
-						newElement[PropertySymbol.rootNode] = this[PropertySymbol.rootNode];
-						newElement[PropertySymbol.formNode] = this[PropertySymbol.formNode];
-						newElement[PropertySymbol.selectNode] = this[PropertySymbol.selectNode];
-						newElement[PropertySymbol.textAreaNode] = this[PropertySymbol.textAreaNode];
-						newElement[PropertySymbol.observers] = this[PropertySymbol.observers];
-						newElement[PropertySymbol.isValue] = this[PropertySymbol.isValue];
-
-						for (let i = 0, max = this[PropertySymbol.attributes].length; i < max; i++) {
-							newElement[PropertySymbol.attributes].setNamedItem(
-								this[PropertySymbol.attributes][i]
-							);
-						}
-
-						(<INodeList<INode>>this[PropertySymbol.childNodes]) = new NodeList();
-						(<IHTMLCollection<IElement>>this[PropertySymbol.children]) = new HTMLCollection();
-						this[PropertySymbol.rootNode] = null;
-						this[PropertySymbol.formNode] = null;
-						this[PropertySymbol.selectNode] = null;
-						this[PropertySymbol.textAreaNode] = null;
-						this[PropertySymbol.observers] = [];
-						this[PropertySymbol.isValue] = null;
-						(<HTMLElementNamedNodeMap>this[PropertySymbol.attributes]) =
-							new HTMLElementNamedNodeMap(this);
-
-						for (
-							let i = 0,
-								max = (<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.childNodes]
-									.length;
-							i < max;
-							i++
-						) {
-							if (
-								(<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.childNodes][i] ===
-								this
-							) {
-								(<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.childNodes][i] =
-									newElement;
-								break;
-							}
-						}
-
-						if ((<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.children]) {
-							for (
-								let i = 0,
-									max = (<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.children]
-										.length;
-								i < max;
-								i++
-							) {
-								if (
-									(<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.children][i] ===
-									this
-								) {
-									(<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.children][i] =
-										newElement;
-									break;
-								}
-							}
-						}
-
-						if (newElement[PropertySymbol.isConnected] && newElement.connectedCallback) {
-							newElement.connectedCallback();
-						}
-
-						this[PropertySymbol.connectToNode](null);
-					}
-				};
-				callbacks[tagName] = callbacks[tagName] || [];
-				callbacks[tagName].push(callback);
-				this.#customElementDefineCallback = callback;
-			} else if (!parentNode && callbacks[tagName] && this.#customElementDefineCallback) {
-				const index = callbacks[tagName].indexOf(this.#customElementDefineCallback);
-				if (index !== -1) {
-					callbacks[tagName].splice(index, 1);
-				}
-				if (!callbacks[tagName].length) {
-					delete callbacks[tagName];
-				}
-				this.#customElementDefineCallback = null;
-			}
-		}
-
-		super[PropertySymbol.connectToNode](parentNode);
-	}
-}
+export default class HTMLUnknownElement extends HTMLElement implements IHTMLElement {}

package/src/nodes/parent-node/ParentNodeUtility.ts

@@ -7,6 +7,7 @@ import IHTMLCollection from '../element/IHTMLCollection.js';
 import INode from '../node/INode.js';
 import HTMLCollection from '../element/HTMLCollection.js';
 import DocumentFragment from '../document-fragment/DocumentFragment.js';
+import NamespaceURI from '../../config/NamespaceURI.js';
 
 /**
  * Parent node utility.
@@ -115,7 +116,7 @@ export default class ParentNodeUtility {
 		let matches = new HTMLCollection<IElement>();
 
 		for (const child of (<DocumentFragment>parentNode)[PropertySymbol.children]) {
-			if (includeAll || child[PropertySymbol.tagName] === upperTagName) {
+			if (includeAll || child[PropertySymbol.tagName].toUpperCase() === upperTagName) {
 				matches.push(child);
 			}
 			matches = <HTMLCollection<IElement>>(
@@ -139,13 +140,14 @@ export default class ParentNodeUtility {
 		namespaceURI: string,
 		tagName: string
 	): IHTMLCollection<IElement> {
-		const upperTagName = tagName.toUpperCase();
+		// When the namespace is HTML, the tag name is case-insensitive.
+		const formattedTagName = namespaceURI === NamespaceURI.html ? tagName.toUpperCase() : tagName;
 		const includeAll = tagName === '*';
 		let matches = new HTMLCollection<IElement>();
 
 		for (const child of (<DocumentFragment>parentNode)[PropertySymbol.children]) {
 			if (
-				(includeAll || child[PropertySymbol.tagName] === upperTagName) &&
+				(includeAll || child[PropertySymbol.tagName] === formattedTagName) &&
 				child[PropertySymbol.namespaceURI] === namespaceURI
 			) {
 				matches.push(child);

package/src/nodes/svg-element/SVGElement.ts

@@ -48,7 +48,7 @@ export default class SVGElement extends Element implements ISVGElement {
 	public get ownerSVGElement(): ISVGSVGElement {
 		let parent = this[PropertySymbol.parentNode];
 		while (parent) {
-			if (parent['tagName'] === 'SVG') {
+			if (parent[PropertySymbol.localName] === 'svg') {
 				return <ISVGSVGElement>parent;
 			}
 

package/src/window/BrowserWindow.ts

@@ -935,6 +935,7 @@ export default class BrowserWindow extends EventTarget implements IBrowserWindow
 		// When using a Window instance directly, the Window instance is the main frame and we will close the page and destroy the browser.
 		// When using the Browser API we should only close the page when the Window instance is connected to the main frame (we should not close child frames such as iframes).
 		if (this.#browserFrame.page?.mainFrame === this.#browserFrame) {
+			this[PropertySymbol.destroy]();
 			this.#browserFrame.page.close();
 		}
 	}
@@ -1241,16 +1242,27 @@ export default class BrowserWindow extends EventTarget implements IBrowserWindow
 	 * Destroys the window.
 	 */
 	public [PropertySymbol.destroy](): void {
+		if (!this.Audio[PropertySymbol.ownerDocument]) {
+			return;
+		}
+
 		(<boolean>this.closed) = true;
 		this.Audio[PropertySymbol.ownerDocument] = null;
 		this.Image[PropertySymbol.ownerDocument] = null;
 		this.DocumentFragment[PropertySymbol.ownerDocument] = null;
-		for (const mutationObserver of this[PropertySymbol.mutationObservers]) {
+
+		const mutationObservers = this[PropertySymbol.mutationObservers];
+
+		for (const mutationObserver of mutationObservers) {
 			mutationObserver.disconnect();
 		}
 
 		// Disconnects nodes from the document, so that they can be garbage collected.
 		for (const node of this.document[PropertySymbol.childNodes].slice()) {
+			// Makes sure that something won't be triggered by the disconnect.
+			if (node.disconnectedCallback) {
+				delete node.disconnectedCallback;
+			}
 			this.document.removeChild(node);
 		}