happy-dom 13.0.7 → 13.1.0

package/src/nodes/html-script-element/HTMLScriptElementScriptLoader.ts

@@ -39,13 +39,16 @@ export default class HTMLScriptElementScriptLoader {
 		const element = this.#element;
 		const async = element.getAttribute('async') !== null;
 
-		if (!url || !element.isConnected) {
+		if (!url || !element[PropertySymbol.isConnected]) {
 			return;
 		}
 
 		let absoluteURL: string;
 		try {
-			absoluteURL = new URL(url, element.ownerDocument[PropertySymbol.defaultView].location).href;
+			absoluteURL = new URL(
+				url,
+				element[PropertySymbol.ownerDocument][PropertySymbol.ownerWindow].location
+			).href;
 		} catch (error) {
 			this.#loadedScriptURL = null;
 			element.dispatchEvent(new Event('error'));
@@ -72,7 +75,7 @@ export default class HTMLScriptElementScriptLoader {
 
 		const resourceFetch = new ResourceFetch({
 			browserFrame: this.#browserFrame,
-			window: element.ownerDocument[PropertySymbol.defaultView]
+			window: element[PropertySymbol.ownerDocument][PropertySymbol.ownerWindow]
 		});
 		let code: string | null = null;
 		let error: Error | null = null;
@@ -82,7 +85,7 @@ export default class HTMLScriptElementScriptLoader {
 		if (async) {
 			const readyStateManager = (<
 				{ [PropertySymbol.readyStateManager]: DocumentReadyStateManager }
-			>(<unknown>element.ownerDocument[PropertySymbol.defaultView]))[
+			>(<unknown>element[PropertySymbol.ownerDocument][PropertySymbol.ownerWindow]))[
 				PropertySymbol.readyStateManager
 			];
 
@@ -106,20 +109,21 @@ export default class HTMLScriptElementScriptLoader {
 		if (error) {
 			WindowErrorUtility.dispatchError(element, error);
 		} else {
-			element.ownerDocument[PropertySymbol.currentScript] = element;
+			element[PropertySymbol.ownerDocument][PropertySymbol.currentScript] = element;
 			code = '//# sourceURL=' + absoluteURL + '\n' + code;
 
 			if (
 				browserSettings.disableErrorCapturing ||
 				browserSettings.errorCapture !== BrowserErrorCaptureEnum.tryAndCatch
 			) {
-				element.ownerDocument[PropertySymbol.defaultView].eval(code);
+				element[PropertySymbol.ownerDocument][PropertySymbol.ownerWindow].eval(code);
 			} else {
-				WindowErrorUtility.captureError(element.ownerDocument[PropertySymbol.defaultView], () =>
-					element.ownerDocument[PropertySymbol.defaultView].eval(code)
+				WindowErrorUtility.captureError(
+					element[PropertySymbol.ownerDocument][PropertySymbol.ownerWindow],
+					() => element[PropertySymbol.ownerDocument][PropertySymbol.ownerWindow].eval(code)
 				);
 			}
-			element.ownerDocument[PropertySymbol.currentScript] = null;
+			element[PropertySymbol.ownerDocument][PropertySymbol.currentScript] = null;
 			element.dispatchEvent(new Event('load'));
 		}
 	}

package/src/nodes/html-select-element/HTMLSelectElement.ts

@@ -26,21 +26,56 @@ import HTMLSelectElementNamedNodeMap from './HTMLSelectElementNamedNodeMap.js';
  * https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement.
  */
 export default class HTMLSelectElement extends HTMLElement implements IHTMLSelectElement {
-	public override readonly attributes: INamedNodeMap = new HTMLSelectElementNamedNodeMap(this);
-
-	// Public properties.
-	public readonly length = 0;
-	public readonly options: IHTMLOptionsCollection = new HTMLOptionsCollection(this);
-	public readonly validationMessage = '';
-	public readonly validity = new ValidityState(this);
-
-	// Private properties
+	// Internal properties.
+	public override [PropertySymbol.attributes]: INamedNodeMap = new HTMLSelectElementNamedNodeMap(
+		this
+	);
+	public [PropertySymbol.validationMessage] = '';
+	public [PropertySymbol.validity] = new ValidityState(this);
 	public [PropertySymbol.selectNode]: INode = this;
+	public [PropertySymbol.length] = 0;
+	public [PropertySymbol.options]: IHTMLOptionsCollection = new HTMLOptionsCollection(this);
 
 	// Events
 	public onchange: (event: Event) => void | null = null;
 	public oninput: (event: Event) => void | null = null;
 
+	/**
+	 * Returns length.
+	 *
+	 * @returns Length.
+	 */
+	public get length(): number {
+		return this[PropertySymbol.length];
+	}
+
+	/**
+	 * Returns options.
+	 *
+	 * @returns Options.
+	 */
+	public get options(): IHTMLOptionsCollection {
+		return this[PropertySymbol.options];
+	}
+
+	/**
+	 * Returns validation message.
+	 *
+	 * @returns Validation message.
+	 */
+	public get validationMessage(): string {
+		return this[PropertySymbol.validationMessage];
+	}
+
+	/**
+	 * Returns validity.
+	 *
+	 * @returns Validity.
+	 */
+	public get validity(): ValidityState {
+		return this[PropertySymbol.validity];
+	}
+
 	/**
 	 * Returns name.
 	 *
@@ -162,8 +197,8 @@ export default class HTMLSelectElement extends HTMLElement implements IHTMLSelec
 	 * @returns Value.
 	 */
 	public get value(): string {
-		for (let i = 0, max = this.options.length; i < max; i++) {
-			const option = <HTMLOptionElement>this.options[i];
+		for (let i = 0, max = this[PropertySymbol.options].length; i < max; i++) {
+			const option = <HTMLOptionElement>this[PropertySymbol.options][i];
 			if (option[PropertySymbol.selectedness]) {
 				return option.value;
 			}
@@ -178,8 +213,8 @@ export default class HTMLSelectElement extends HTMLElement implements IHTMLSelec
 	 * @param value Value.
 	 */
 	public set value(value: string) {
-		for (let i = 0, max = this.options.length; i < max; i++) {
-			const option = <HTMLOptionElement>this.options[i];
+		for (let i = 0, max = this[PropertySymbol.options].length; i < max; i++) {
+			const option = <HTMLOptionElement>this[PropertySymbol.options][i];
 			if (option.value === value) {
 				option[PropertySymbol.selectedness] = true;
 				option[PropertySymbol.dirtyness] = true;
@@ -195,8 +230,8 @@ export default class HTMLSelectElement extends HTMLElement implements IHTMLSelec
 	 * @returns Value.
 	 */
 	public get selectedIndex(): number {
-		for (let i = 0, max = this.options.length; i < max; i++) {
-			if ((<HTMLOptionElement>this.options[i])[PropertySymbol.selectedness]) {
+		for (let i = 0, max = this[PropertySymbol.options].length; i < max; i++) {
+			if ((<HTMLOptionElement>this[PropertySymbol.options][i])[PropertySymbol.selectedness]) {
 				return i;
 			}
 		}
@@ -210,11 +245,11 @@ export default class HTMLSelectElement extends HTMLElement implements IHTMLSelec
 	 */
 	public set selectedIndex(selectedIndex: number) {
 		if (typeof selectedIndex === 'number' && !isNaN(selectedIndex)) {
-			for (let i = 0, max = this.options.length; i < max; i++) {
-				(<HTMLOptionElement>this.options[i])[PropertySymbol.selectedness] = false;
+			for (let i = 0, max = this[PropertySymbol.options].length; i < max; i++) {
+				(<HTMLOptionElement>this[PropertySymbol.options][i])[PropertySymbol.selectedness] = false;
 			}
 
-			const selectedOption = <HTMLOptionElement>this.options[selectedIndex];
+			const selectedOption = <HTMLOptionElement>this[PropertySymbol.options][selectedIndex];
 			if (selectedOption) {
 				selectedOption[PropertySymbol.selectedness] = true;
 				selectedOption[PropertySymbol.dirtyness] = true;
@@ -261,7 +296,7 @@ export default class HTMLSelectElement extends HTMLElement implements IHTMLSelec
 	 * @param index Index.
 	 */
 	public item(index: number): IHTMLOptionElement {
-		return this.options.item(index);
+		return this[PropertySymbol.options].item(index);
 	}
 
 	/**
@@ -271,7 +306,7 @@ export default class HTMLSelectElement extends HTMLElement implements IHTMLSelec
 	 * @param before HTMLOptionElement or index number.
 	 */
 	public add(element: IHTMLOptionElement, before?: number | IHTMLOptionElement): void {
-		this.options.add(element, before);
+		this[PropertySymbol.options].add(element, before);
 	}
 
 	/**
@@ -281,7 +316,7 @@ export default class HTMLSelectElement extends HTMLElement implements IHTMLSelec
 	 */
 	public override remove(index?: number): void {
 		if (typeof index === 'number') {
-			this.options.remove(index);
+			this[PropertySymbol.options].remove(index);
 		} else {
 			super.remove();
 		}
@@ -293,7 +328,7 @@ export default class HTMLSelectElement extends HTMLElement implements IHTMLSelec
 	 * @param message Message.
 	 */
 	public setCustomValidity(message: string): void {
-		(<string>this.validationMessage) = String(message);
+		this[PropertySymbol.validationMessage] = String(message);
 	}
 
 	/**
@@ -302,7 +337,7 @@ export default class HTMLSelectElement extends HTMLElement implements IHTMLSelec
 	 * @returns "true" if the field is valid.
 	 */
 	public checkValidity(): boolean {
-		const valid = this.disabled || this.validity.valid;
+		const valid = this.disabled || this[PropertySymbol.validity].valid;
 		if (!valid) {
 			this.dispatchEvent(new Event('invalid', { bubbles: true, cancelable: true }));
 		}
@@ -330,10 +365,13 @@ export default class HTMLSelectElement extends HTMLElement implements IHTMLSelec
 	public [PropertySymbol.updateOptionItems](selectedOption?: IHTMLOptionElement): void {
 		const optionElements = <IHTMLCollection<IHTMLOptionElement>>this.getElementsByTagName('option');
 
-		if (optionElements.length < this.options.length) {
-			this.options.splice(this.options.length - 1, this.options.length - optionElements.length);
+		if (optionElements.length < this[PropertySymbol.options].length) {
+			this[PropertySymbol.options].splice(
+				this[PropertySymbol.options].length - 1,
+				this[PropertySymbol.options].length - optionElements.length
+			);
 
-			for (let i = optionElements.length - 1, max = this.length; i < max; i++) {
+			for (let i = optionElements.length - 1, max = this[PropertySymbol.length]; i < max; i++) {
 				delete this[i];
 			}
 		}
@@ -342,7 +380,7 @@ export default class HTMLSelectElement extends HTMLElement implements IHTMLSelec
 		const selected: HTMLOptionElement[] = [];
 
 		for (let i = 0; i < optionElements.length; i++) {
-			this.options[i] = optionElements[i];
+			this[PropertySymbol.options][i] = optionElements[i];
 			this[i] = optionElements[i];
 
 			if (!isMultiple) {
@@ -357,7 +395,7 @@ export default class HTMLSelectElement extends HTMLElement implements IHTMLSelec
 			}
 		}
 
-		(<number>this.length) = optionElements.length;
+		(<number>this[PropertySymbol.length]) = optionElements.length;
 
 		const size = this.#getDisplaySize();
 
@@ -366,11 +404,11 @@ export default class HTMLSelectElement extends HTMLElement implements IHTMLSelec
 				const option = <HTMLOptionElement>optionElements[i];
 
 				let disabled = option.hasAttributeNS(null, 'disabled');
-				const parentNode = <IHTMLElement>option.parentNode;
+				const parentNode = <IHTMLElement>option[PropertySymbol.parentNode];
 				if (
 					parentNode &&
-					parentNode.nodeType === NodeTypeEnum.elementNode &&
-					parentNode.tagName === 'OPTGROUP' &&
+					parentNode[PropertySymbol.nodeType] === NodeTypeEnum.elementNode &&
+					parentNode[PropertySymbol.tagName] === 'OPTGROUP' &&
 					parentNode.hasAttributeNS(null, 'disabled')
 				) {
 					disabled = true;

package/src/nodes/html-select-element/HTMLSelectElementNamedNodeMap.ts

@@ -19,18 +19,18 @@ export default class HTMLSelectElementNamedNodeMap extends HTMLElementNamedNodeM
 		const replacedItem = super.setNamedItem(item);
 
 		if (
-			(item.name === 'id' || item.name === 'name') &&
+			(item[PropertySymbol.name] === 'id' || item[PropertySymbol.name] === 'name') &&
 			this[PropertySymbol.ownerElement][PropertySymbol.formNode]
 		) {
-			if (replacedItem && replacedItem.value) {
+			if (replacedItem && replacedItem[PropertySymbol.value]) {
 				(<HTMLFormElement>this[PropertySymbol.ownerElement][PropertySymbol.formNode])[
 					PropertySymbol.removeFormControlItem
-				](this[PropertySymbol.ownerElement], replacedItem.value);
+				](this[PropertySymbol.ownerElement], replacedItem[PropertySymbol.value]);
 			}
-			if (item.value) {
+			if (item[PropertySymbol.value]) {
 				(<HTMLFormElement>this[PropertySymbol.ownerElement][PropertySymbol.formNode])[
 					PropertySymbol.appendFormControlItem
-				](this[PropertySymbol.ownerElement], item.value);
+				](this[PropertySymbol.ownerElement], item[PropertySymbol.value]);
 			}
 		}
 
@@ -45,12 +45,12 @@ export default class HTMLSelectElementNamedNodeMap extends HTMLElementNamedNodeM
 
 		if (
 			removedItem &&
-			(removedItem.name === 'id' || removedItem.name === 'name') &&
+			(removedItem[PropertySymbol.name] === 'id' || removedItem[PropertySymbol.name] === 'name') &&
 			this[PropertySymbol.ownerElement][PropertySymbol.formNode]
 		) {
 			(<HTMLFormElement>this[PropertySymbol.ownerElement][PropertySymbol.formNode])[
 				PropertySymbol.removeFormControlItem
-			](this[PropertySymbol.ownerElement], removedItem.value);
+			](this[PropertySymbol.ownerElement], removedItem[PropertySymbol.value]);
 		}
 
 		return removedItem;

package/src/nodes/html-style-element/HTMLStyleElement.ts

@@ -10,7 +10,7 @@ import IHTMLStyleElement from './IHTMLStyleElement.js';
  * https://developer.mozilla.org/en-US/docs/Web/API/HTMLStyleElement.
  */
 export default class HTMLStyleElement extends HTMLElement implements IHTMLStyleElement {
-	private [PropertySymbol.styleSheet]: CSSStyleSheet | null = null;
+	private [PropertySymbol.sheet]: CSSStyleSheet | null = null;
 
 	/**
 	 * Returns CSS style sheet.
@@ -18,14 +18,14 @@ export default class HTMLStyleElement extends HTMLElement implements IHTMLStyleE
 	 * @returns CSS style sheet.
 	 */
 	public get sheet(): CSSStyleSheet {
-		if (!this.isConnected) {
+		if (!this[PropertySymbol.isConnected]) {
 			return null;
 		}
-		if (!this[PropertySymbol.styleSheet]) {
-			this[PropertySymbol.styleSheet] = new CSSStyleSheet();
+		if (!this[PropertySymbol.sheet]) {
+			this[PropertySymbol.sheet] = new CSSStyleSheet();
 		}
-		this[PropertySymbol.styleSheet].replaceSync(this.textContent);
-		return this[PropertySymbol.styleSheet];
+		this[PropertySymbol.sheet].replaceSync(this.textContent);
+		return this[PropertySymbol.sheet];
 	}
 
 	/**

package/src/nodes/html-template-element/HTMLTemplateElement.ts

@@ -14,7 +14,18 @@ import DocumentFragment from '../document-fragment/DocumentFragment.js';
  * https://developer.mozilla.org/en-US/docs/Web/API/HTMLTemplateElement.
  */
 export default class HTMLTemplateElement extends HTMLElement implements IHTMLTemplateElement {
-	public readonly content: IDocumentFragment = this.ownerDocument.createDocumentFragment();
+	// Internal properties
+	public [PropertySymbol.content]: IDocumentFragment =
+		this[PropertySymbol.ownerDocument].createDocumentFragment();
+
+	/**
+	 * Returns content.
+	 *
+	 * @returns Content.
+	 */
+	public get content(): IDocumentFragment {
+		return this[PropertySymbol.content];
+	}
 
 	/**
 	 * @override
@@ -27,25 +38,29 @@ export default class HTMLTemplateElement extends HTMLElement implements IHTMLTem
 	 * @override
 	 */
 	public set innerHTML(html: string) {
-		for (const child of (<DocumentFragment>this.content)[PropertySymbol.childNodes].slice()) {
-			this.content.removeChild(child);
+		const content = <DocumentFragment>this[PropertySymbol.content];
+
+		for (const child of content[PropertySymbol.childNodes].slice()) {
+			this[PropertySymbol.content].removeChild(child);
 		}
 
-		XMLParser.parse(this.ownerDocument, html, { rootNode: this.content });
+		XMLParser.parse(this[PropertySymbol.ownerDocument], html, {
+			rootNode: this[PropertySymbol.content]
+		});
 	}
 
 	/**
 	 * @override
 	 */
 	public get firstChild(): INode {
-		return this.content.firstChild;
+		return this[PropertySymbol.content].firstChild;
 	}
 
 	/**
 	 * @override
 	 */
 	public get lastChild(): INode {
-		return this.content.lastChild;
+		return this[PropertySymbol.content].lastChild;
 	}
 
 	/**
@@ -56,8 +71,9 @@ export default class HTMLTemplateElement extends HTMLElement implements IHTMLTem
 			includeShadowRoots: options && options.includeShadowRoots,
 			escapeEntities: false
 		});
+		const content = <DocumentFragment>this[PropertySymbol.content];
 		let xml = '';
-		for (const node of (<DocumentFragment>this.content)[PropertySymbol.childNodes]) {
+		for (const node of content[PropertySymbol.childNodes]) {
 			xml += xmlSerializer.serializeToString(node);
 		}
 		return xml;
@@ -67,28 +83,28 @@ export default class HTMLTemplateElement extends HTMLElement implements IHTMLTem
 	 * @override
 	 */
 	public appendChild(node: INode): INode {
-		return this.content.appendChild(node);
+		return this[PropertySymbol.content].appendChild(node);
 	}
 
 	/**
 	 * @override
 	 */
 	public removeChild(node: INode): INode {
-		return this.content.removeChild(node);
+		return this[PropertySymbol.content].removeChild(node);
 	}
 
 	/**
 	 * @override
 	 */
 	public insertBefore(newNode: INode, referenceNode: INode): INode {
-		return this.content.insertBefore(newNode, referenceNode);
+		return this[PropertySymbol.content].insertBefore(newNode, referenceNode);
 	}
 
 	/**
 	 * @override
 	 */
 	public replaceChild(newChild: INode, oldChild: INode): INode {
-		return this.content.replaceChild(newChild, oldChild);
+		return this[PropertySymbol.content].replaceChild(newChild, oldChild);
 	}
 
 	/**
@@ -96,7 +112,7 @@ export default class HTMLTemplateElement extends HTMLElement implements IHTMLTem
 	 */
 	public cloneNode(deep = false): IHTMLTemplateElement {
 		const clone = <IHTMLTemplateElement>super.cloneNode(deep);
-		(<IDocumentFragment>clone.content) = this.content.cloneNode(deep);
+		clone[PropertySymbol.content] = this[PropertySymbol.content].cloneNode(deep);
 		return clone;
 	}
 }

package/src/nodes/html-template-element/IHTMLTemplateElement.ts

@@ -8,7 +8,7 @@ import IHTMLElement from '../html-element/IHTMLElement.js';
  * https://developer.mozilla.org/en-US/docs/Web/API/HTMLTemplateElement.
  */
 export default interface IHTMLTemplateElement extends IHTMLElement {
-	content: IDocumentFragment;
+	readonly content: IDocumentFragment;
 
 	/**
 	 * Clones a node.

package/src/nodes/html-text-area-element/HTMLTextAreaElement.ts

@@ -23,20 +23,43 @@ import HTMLTextAreaElementNamedNodeMap from './HTMLTextAreaElementNamedNodeMap.j
  * https://developer.mozilla.org/en-US/docs/Web/API/HTMLTextAreaElement.
  */
 export default class HTMLTextAreaElement extends HTMLElement implements IHTMLTextAreaElement {
-	public override readonly attributes: INamedNodeMap = new HTMLTextAreaElementNamedNodeMap(this);
 	public readonly type = 'textarea';
-	public readonly validationMessage = '';
-	public readonly validity = new ValidityState(this);
 
 	// Events
 	public oninput: (event: Event) => void | null = null;
 	public onselectionchange: (event: Event) => void | null = null;
 
+	// Internal properties
+	public override [PropertySymbol.attributes]: INamedNodeMap = new HTMLTextAreaElementNamedNodeMap(
+		this
+	);
+	public [PropertySymbol.validationMessage] = '';
+	public [PropertySymbol.validity] = new ValidityState(this);
 	public [PropertySymbol.value] = null;
+	public [PropertySymbol.textAreaNode]: HTMLTextAreaElement = this;
+
+	// Private properties
 	#selectionStart = null;
 	#selectionEnd = null;
 	#selectionDirection = HTMLInputElementSelectionDirectionEnum.none;
-	public [PropertySymbol.textAreaNode]: HTMLTextAreaElement = this;
+
+	/**
+	 * Returns validation message.
+	 *
+	 * @returns Validation message.
+	 */
+	public get validationMessage(): string {
+		return this[PropertySymbol.validationMessage];
+	}
+
+	/**
+	 * Returns validity.
+	 *
+	 * @returns Validity.
+	 */
+	public get validity(): ValidityState {
+		return this[PropertySymbol.validity];
+	}
 
 	/**
 	 * Returns the default value.
@@ -519,7 +542,7 @@ export default class HTMLTextAreaElement extends HTMLElement implements IHTMLTex
 	 * @param message Message.
 	 */
 	public setCustomValidity(message: string): void {
-		(<string>this.validationMessage) = String(message);
+		this[PropertySymbol.validationMessage] = String(message);
 	}
 
 	/**
@@ -528,7 +551,7 @@ export default class HTMLTextAreaElement extends HTMLElement implements IHTMLTex
 	 * @returns "true" if the field is valid.
 	 */
 	public checkValidity(): boolean {
-		const valid = this.disabled || this.readOnly || this.validity.valid;
+		const valid = this.disabled || this.readOnly || this[PropertySymbol.validity].valid;
 		if (!valid) {
 			this.dispatchEvent(new Event('invalid', { bubbles: true, cancelable: true }));
 		}

package/src/nodes/html-text-area-element/HTMLTextAreaElementNamedNodeMap.ts

@@ -19,18 +19,18 @@ export default class HTMLTextAreaElementNamedNodeMap extends HTMLElementNamedNod
 		const replacedItem = super.setNamedItem(item);
 
 		if (
-			(item.name === 'id' || item.name === 'name') &&
+			(item[PropertySymbol.name] === 'id' || item[PropertySymbol.name] === 'name') &&
 			this[PropertySymbol.ownerElement][PropertySymbol.formNode]
 		) {
-			if (replacedItem && replacedItem.value) {
+			if (replacedItem && replacedItem[PropertySymbol.value]) {
 				(<HTMLFormElement>this[PropertySymbol.ownerElement][PropertySymbol.formNode])[
 					PropertySymbol.removeFormControlItem
-				](this[PropertySymbol.ownerElement], replacedItem.value);
+				](this[PropertySymbol.ownerElement], replacedItem[PropertySymbol.value]);
 			}
-			if (item.value) {
+			if (item[PropertySymbol.value]) {
 				(<HTMLFormElement>this[PropertySymbol.ownerElement][PropertySymbol.formNode])[
 					PropertySymbol.appendFormControlItem
-				](this[PropertySymbol.ownerElement], item.value);
+				](this[PropertySymbol.ownerElement], item[PropertySymbol.value]);
 			}
 		}
 
@@ -45,12 +45,12 @@ export default class HTMLTextAreaElementNamedNodeMap extends HTMLElementNamedNod
 
 		if (
 			removedItem &&
-			(removedItem.name === 'id' || removedItem.name === 'name') &&
+			(removedItem[PropertySymbol.name] === 'id' || removedItem[PropertySymbol.name] === 'name') &&
 			this[PropertySymbol.ownerElement][PropertySymbol.formNode]
 		) {
 			(<HTMLFormElement>this[PropertySymbol.ownerElement][PropertySymbol.formNode])[
 				PropertySymbol.removeFormControlItem
-			](this[PropertySymbol.ownerElement], removedItem.value);
+			](this[PropertySymbol.ownerElement], removedItem[PropertySymbol.value]);
 		}
 
 		return removedItem;

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

@@ -24,26 +24,32 @@ export default class HTMLUnknownElement extends HTMLElement implements IHTMLElem
 	 * @param parentNode Parent node.
 	 */
 	public [PropertySymbol.connectToNode](parentNode: INode = null): void {
-		const tagName = this.tagName;
+		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.ownerDocument[PropertySymbol.defaultView].customElements[PropertySymbol.callbacks]
+			this[PropertySymbol.ownerDocument][PropertySymbol.ownerWindow].customElements[
+				PropertySymbol.callbacks
+			]
 		) {
 			const callbacks =
-				this.ownerDocument[PropertySymbol.defaultView].customElements[PropertySymbol.callbacks];
+				this[PropertySymbol.ownerDocument][PropertySymbol.ownerWindow].customElements[
+					PropertySymbol.callbacks
+				];
 
 			if (parentNode && !this.#customElementDefineCallback) {
 				const callback = (): void => {
-					if (this.parentNode) {
-						const newElement = <HTMLElement>this.ownerDocument.createElement(tagName);
+					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.isConnected) = this.isConnected;
+						(<boolean>newElement[PropertySymbol.isConnected]) = this[PropertySymbol.isConnected];
 
 						newElement[PropertySymbol.rootNode] = this[PropertySymbol.rootNode];
 						newElement[PropertySymbol.formNode] = this[PropertySymbol.formNode];
@@ -52,8 +58,10 @@ export default class HTMLUnknownElement extends HTMLElement implements IHTMLElem
 						newElement[PropertySymbol.observers] = this[PropertySymbol.observers];
 						newElement[PropertySymbol.isValue] = this[PropertySymbol.isValue];
 
-						for (let i = 0, max = this.attributes.length; i < max; i++) {
-							newElement.attributes.setNamedItem(this.attributes[i]);
+						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();
@@ -64,33 +72,46 @@ export default class HTMLUnknownElement extends HTMLElement implements IHTMLElem
 						this[PropertySymbol.textAreaNode] = null;
 						this[PropertySymbol.observers] = [];
 						this[PropertySymbol.isValue] = null;
-						(<HTMLElementNamedNodeMap>this.attributes) = new HTMLElementNamedNodeMap(this);
+						(<HTMLElementNamedNodeMap>this[PropertySymbol.attributes]) =
+							new HTMLElementNamedNodeMap(this);
 
 						for (
-							let i = 0, max = (<HTMLElement>this.parentNode)[PropertySymbol.childNodes].length;
+							let i = 0,
+								max = (<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.childNodes]
+									.length;
 							i < max;
 							i++
 						) {
-							if ((<HTMLElement>this.parentNode)[PropertySymbol.childNodes][i] === this) {
-								(<HTMLElement>this.parentNode)[PropertySymbol.childNodes][i] = newElement;
+							if (
+								(<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.childNodes][i] ===
+								this
+							) {
+								(<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.childNodes][i] =
+									newElement;
 								break;
 							}
 						}
 
-						if ((<HTMLElement>this.parentNode)[PropertySymbol.children]) {
+						if ((<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.children]) {
 							for (
-								let i = 0, max = (<HTMLElement>this.parentNode)[PropertySymbol.children].length;
+								let i = 0,
+									max = (<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.children]
+										.length;
 								i < max;
 								i++
 							) {
-								if ((<HTMLElement>this.parentNode)[PropertySymbol.children][i] === this) {
-									(<HTMLElement>this.parentNode)[PropertySymbol.children][i] = newElement;
+								if (
+									(<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.children][i] ===
+									this
+								) {
+									(<HTMLElement>this[PropertySymbol.parentNode])[PropertySymbol.children][i] =
+										newElement;
 									break;
 								}
 							}
 						}
 
-						if (newElement.isConnected && newElement.connectedCallback) {
+						if (newElement[PropertySymbol.isConnected] && newElement.connectedCallback) {
 							newElement.connectedCallback();
 						}