happy-dom 14.12.3 → 15.0.0

package/src/nodes/html-table-element/HTMLTableElement.ts

@@ -0,0 +1,337 @@
+import HTMLCollection from '../element/HTMLCollection.js';
+import HTMLElement from '../html-element/HTMLElement.js';
+import HTMLTableRowElement from '../html-table-row-element/HTMLTableRowElement.js';
+import * as PropertySymbol from '../../PropertySymbol.js';
+import QuerySelector from '../../query-selector/QuerySelector.js';
+import HTMLTableCaptionElement from '../html-table-caption-element/HTMLTableCaptionElement.js';
+import HTMLTableSectionElement from '../html-table-section-element/HTMLTableSectionElement.js';
+import DOMException from '../../exception/DOMException.js';
+import DOMExceptionNameEnum from '../../exception/DOMExceptionNameEnum.js';
+
+/**
+ * HTMLTableElement
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLTableElement
+ */
+export default class HTMLTableElement extends HTMLElement {
+	public [PropertySymbol.rows]: HTMLCollection<HTMLTableRowElement> | null = null;
+	public [PropertySymbol.tBodies]: HTMLCollection<HTMLTableSectionElement> | null = null;
+
+	/**
+	 * Returns caption.
+	 *
+	 * @returns Caption.
+	 */
+	public get caption(): HTMLTableCaptionElement | null {
+		return QuerySelector.querySelector(this, 'caption');
+	}
+
+	/**
+	 * Sets caption.
+	 *
+	 * @param caption Caption.
+	 */
+	public set caption(caption: HTMLTableCaptionElement | null) {
+		if (caption) {
+			if (!(caption instanceof HTMLTableCaptionElement)) {
+				throw new TypeError(
+					"Failed to set the 'caption' property on 'HTMLTableElement': Failed to convert value to 'HTMLTableCaptionElement'."
+				);
+			}
+
+			this.caption?.remove();
+			this.insertBefore(caption, this.firstChild);
+		} else {
+			this.caption?.remove();
+		}
+	}
+
+	/**
+	 * Returns table section element.
+	 *
+	 * @returns Table section element.
+	 */
+	public get tHead(): HTMLTableSectionElement | null {
+		return QuerySelector.querySelector(this, 'thead');
+	}
+
+	/**
+	 * Sets table section element.
+	 *
+	 * @param tHead Table section element.
+	 */
+	public set tHead(tHead: HTMLTableSectionElement | null) {
+		if (tHead) {
+			if (!(tHead instanceof HTMLTableSectionElement)) {
+				throw new TypeError(
+					"Failed to set the 'tHead' property on 'HTMLTableElement': Failed to convert value to 'HTMLTableSectionElement'."
+				);
+			}
+
+			this.tHead?.remove();
+
+			// It should be inserted in the tree immediately before the first element that is neither a <caption>, nor a <colgroup>
+			let found = false;
+			for (const child of this[PropertySymbol.elementArray]) {
+				if (
+					child[PropertySymbol.tagName] !== 'CAPTION' &&
+					child[PropertySymbol.tagName] !== 'COLGROUP'
+				) {
+					this.insertBefore(tHead, child);
+					found = true;
+					break;
+				}
+			}
+
+			// Add as last child if there is no such element
+			if (!found) {
+				this.appendChild(tHead);
+			}
+		} else {
+			this.tHead?.remove();
+		}
+	}
+
+	/**
+	 * Returns table section element.
+	 *
+	 * @returns Table section element.
+	 */
+	public get tFoot(): HTMLTableSectionElement | null {
+		return QuerySelector.querySelector(this, 'tfoot');
+	}
+
+	/**
+	 * Sets table section element.
+	 *
+	 * @param tFoot Table section element.
+	 */
+	public set tFoot(tFoot: HTMLTableSectionElement | null) {
+		if (tFoot) {
+			if (!(tFoot instanceof HTMLTableSectionElement)) {
+				throw new TypeError(
+					"Failed to set the 'tFoot' property on 'HTMLTableElement': Failed to convert value to 'HTMLTableSectionElement'."
+				);
+			}
+
+			this.tFoot?.remove();
+
+			// It should be inserted in the tree immediately before the first element that is neither a <caption>, <colgroup>, nor a <thead>
+			let found = false;
+			for (const child of this[PropertySymbol.elementArray]) {
+				if (
+					child[PropertySymbol.tagName] !== 'CAPTION' &&
+					child[PropertySymbol.tagName] !== 'COLGROUP' &&
+					child[PropertySymbol.tagName] !== 'THEAD'
+				) {
+					this.insertBefore(tFoot, child);
+					found = true;
+					break;
+				}
+			}
+
+			// Add as last child if there is no such element
+			if (!found) {
+				this.appendChild(tFoot);
+			}
+		} else {
+			this.tFoot?.remove();
+		}
+	}
+
+	/**
+	 * Returns rows.
+	 *
+	 * @returns Rows.
+	 */
+	public get rows(): HTMLCollection<HTMLTableRowElement> {
+		if (!this[PropertySymbol.rows]) {
+			this[PropertySymbol.rows] = new HTMLCollection<HTMLTableRowElement>(
+				PropertySymbol.illegalConstructor,
+				() =>
+					<HTMLTableRowElement[]>QuerySelector.querySelectorAll(this, 'tr')[PropertySymbol.items]
+			);
+		}
+		return this[PropertySymbol.rows];
+	}
+
+	/**
+	 * Returns bodies.
+	 *
+	 * @returns Bodies.
+	 */
+	public get tBodies(): HTMLCollection<HTMLTableSectionElement> {
+		if (!this[PropertySymbol.tBodies]) {
+			this[PropertySymbol.tBodies] = new HTMLCollection<HTMLTableSectionElement>(
+				PropertySymbol.illegalConstructor,
+				() =>
+					<HTMLTableSectionElement[]>(
+						QuerySelector.querySelectorAll(this, 'tbody')[PropertySymbol.items]
+					)
+			);
+		}
+		return this[PropertySymbol.tBodies];
+	}
+
+	/**
+	 * Returns an HTMLTableSectionElement representing the first <thead> that is a child of the element. If none is found, a new one is created and inserted in the tree immediately before the first element that is neither a <caption>, nor a <colgroup>, or as the last child if there is no such element.
+	 *
+	 * @returns Table section element.
+	 */
+	public createTHead(): HTMLTableSectionElement {
+		const existingTHead = this.tHead;
+		if (existingTHead) {
+			return existingTHead;
+		}
+		const tHead = this[PropertySymbol.ownerDocument].createElement('thead');
+		this.tHead = tHead;
+		return tHead;
+	}
+
+	/**
+	 * Removes the first <thead> that is a child of the element.
+	 */
+	public deleteTHead(): void {
+		this.tHead = null;
+	}
+
+	/**
+	 * Returns an HTMLTableSectionElement representing the first <tfoot> that is a child of the element. If none is found, a new one is created and inserted in the tree as the last child.
+	 *
+	 * @returns Table section element.
+	 */
+	public createTFoot(): HTMLTableSectionElement {
+		const existingTFoot = this.tFoot;
+		if (existingTFoot) {
+			return existingTFoot;
+		}
+		const tFoot = this[PropertySymbol.ownerDocument].createElement('tfoot');
+		this.tFoot = tFoot;
+		return tFoot;
+	}
+
+	/**
+	 * Removes the first <tfoot> that is a child of the element.
+	 */
+	public deleteTFoot(): void {
+		this.tFoot = null;
+	}
+
+	/**
+	 * Returns a HTMLTableSectionElement representing a new <tbody> that is a child of the element. It is inserted in the tree after the last element that is a <tbody>, or as the last child if there is no such element.
+	 *
+	 * @returns Table section element.
+	 */
+	public createTBody(): HTMLTableSectionElement {
+		const tBodies = QuerySelector.querySelectorAll(this, 'tbody')[PropertySymbol.items];
+		const tBody = this[PropertySymbol.ownerDocument].createElement('tbody');
+
+		if (tBodies.length > 0) {
+			const lastTBody = tBodies[tBodies.length - 1];
+			lastTBody.parentNode.insertBefore(tBody, lastTBody.nextSibling);
+			return tBody;
+		}
+
+		this.appendChild(tBody);
+
+		return tBody;
+	}
+
+	/**
+	 * Returns an HTMLTableCaptionElement representing the first <caption> that is a child of the element. If none is found, a new one is created and inserted in the tree as the first child of the <table> element.
+	 */
+	public createCaption(): HTMLTableCaptionElement {
+		const existingCaption = this.caption;
+		if (existingCaption) {
+			return existingCaption;
+		}
+		const caption = this[PropertySymbol.ownerDocument].createElement('caption');
+		this.caption = caption;
+		return caption;
+	}
+
+	/**
+	 * Removes the first <caption> that is a child of the element.
+	 */
+	public deleteCaption(): void {
+		this.caption = null;
+	}
+
+	/**
+	 * Returns an HTMLTableRowElement representing a new row of the table. It inserts it in the rows collection immediately before the <tr> element at the given index position. If necessary a <tbody> is created. If the index is -1, the new row is appended to the collection. If the index is smaller than -1 or greater than the number of rows in the collection, a DOMException with the value IndexSizeError is raised.
+	 *
+	 * @param [index] Index.
+	 * @returns Row.
+	 */
+	public insertRow(index: number = -1): HTMLTableRowElement {
+		if (typeof index !== 'number') {
+			index = -1;
+		}
+
+		const rows = QuerySelector.querySelectorAll(this, 'tr')[PropertySymbol.items];
+
+		if (index < -1) {
+			throw new DOMException(
+				`Failed to execute 'insertRow' on 'HTMLTableElement': The index provided (${index}) is less than -1.`,
+				DOMExceptionNameEnum.indexSizeError
+			);
+		}
+
+		if (index > rows.length) {
+			throw new DOMException(
+				`Failed to execute 'insertRow' on 'HTMLTableElement': The index provided (${index}) is greater than the number of rows (${rows.length}).`,
+				DOMExceptionNameEnum.indexSizeError
+			);
+		}
+
+		const row = this[PropertySymbol.ownerDocument].createElement('tr');
+
+		if (index === -1 || index === rows.length) {
+			this.appendChild(row);
+			return row;
+		}
+
+		rows[index].parentNode.insertBefore(row, rows[index]);
+
+		return row;
+	}
+
+	/**
+	 * Removes the row corresponding to the index given in parameter. If the index value is -1 the last row is removed; if it is smaller than -1 or greater than the amount of rows in the collection, a DOMException with the value IndexSizeError is raised.
+	 *
+	 * @param index Index.
+	 */
+	public deleteRow(index: number): void {
+		if (arguments.length === 0) {
+			throw new TypeError(
+				"Failed to execute 'deleteRow' on 'HTMLTableElement': 1 argument required, but only 0 present."
+			);
+		}
+
+		if (typeof index !== 'number') {
+			index = -1;
+		}
+
+		if (index < -1) {
+			throw new DOMException(
+				`Failed to execute 'deleteRow' on 'HTMLTableElement': The index provided (${index}) is less than -1.`,
+				DOMExceptionNameEnum.indexSizeError
+			);
+		}
+
+		const rows = QuerySelector.querySelectorAll(this, 'tr')[PropertySymbol.items];
+
+		if (index >= rows.length) {
+			throw new DOMException(
+				`Failed to execute 'deleteRow' on 'HTMLTableElement': The index provided (${index}) is greater than the number of rows in the table (${rows.length}).`,
+				DOMExceptionNameEnum.indexSizeError
+			);
+		}
+
+		if (index === -1) {
+			index = rows.length - 1;
+		}
+
+		rows[index].remove();
+	}
+}

package/src/nodes/html-table-row-element/HTMLTableRowElement.ts

@@ -0,0 +1,149 @@
+import HTMLCollection from '../element/HTMLCollection.js';
+import HTMLElement from '../html-element/HTMLElement.js';
+import HTMLTableCellElement from '../html-table-cell-element/HTMLTableCellElement.js';
+import * as PropertySymbol from '../../PropertySymbol.js';
+import QuerySelector from '../../query-selector/QuerySelector.js';
+import HTMLTableSectionElement from '../html-table-section-element/HTMLTableSectionElement.js';
+import DOMException from '../../exception/DOMException.js';
+import DOMExceptionNameEnum from '../../exception/DOMExceptionNameEnum.js';
+
+/**
+ * HTMLTableRowElement
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLTableRowElement
+ */
+export default class HTMLTableRowElement extends HTMLElement {
+	public [PropertySymbol.cells]: HTMLCollection<HTMLTableCellElement> | null = null;
+
+	/**
+	 * Returns cells.
+	 *
+	 * @returns Cells.
+	 */
+	public get cells(): HTMLCollection<HTMLTableCellElement> {
+		if (!this[PropertySymbol.cells]) {
+			this[PropertySymbol.cells] = new HTMLCollection<HTMLTableCellElement>(
+				PropertySymbol.illegalConstructor,
+				() =>
+					<HTMLTableCellElement[]>(
+						QuerySelector.querySelectorAll(this, 'td,th')[PropertySymbol.items]
+					)
+			);
+		}
+		return this[PropertySymbol.cells];
+	}
+
+	/**
+	 * Returns a number that gives the logical position of the row within the entire table. If the row is not part of a table, returns -1.
+	 *
+	 * @returns Row index.
+	 */
+	public get rowIndex(): number {
+		let parent = this.parentNode;
+		while (parent) {
+			if (parent[PropertySymbol.tagName] === 'TABLE') {
+				const rows = QuerySelector.querySelectorAll(<HTMLElement>parent, 'tr')[
+					PropertySymbol.items
+				];
+				return rows.indexOf(this);
+			}
+			parent = parent.parentNode;
+		}
+		return -1;
+	}
+
+	/**
+	 * Returns a number that gives the logical position of the row within the table section it belongs to. If the row is not part of a section, returns -1.
+	 */
+	public get sectionRowIndex(): number {
+		let parent = this.parentNode;
+		while (parent) {
+			if (parent instanceof HTMLTableSectionElement) {
+				const rows = QuerySelector.querySelectorAll(<HTMLElement>parent, 'tr')[
+					PropertySymbol.items
+				];
+				return rows.indexOf(this);
+			}
+			parent = parent.parentNode;
+		}
+		return -1;
+	}
+
+	/**
+	 * Returns an HTMLTableCellElement representing a new cell of the row. The cell is inserted in the collection of cells immediately before the given index position in the row. If index is -1, the new cell is appended to the collection. If index is less than -1 or greater than the number of cells in the collection, a DOMException with the value IndexSizeError is raised.
+	 *
+	 * @param [index] Index.
+	 * @returns Cell.
+	 */
+	public insertCell(index: number = -1): HTMLTableCellElement {
+		if (typeof index !== 'number') {
+			index = -1;
+		}
+
+		const cells = QuerySelector.querySelectorAll(this, 'td,th')[PropertySymbol.items];
+
+		if (index < -1) {
+			throw new DOMException(
+				`Failed to execute 'insertCell' on 'HTMLTableRowElement': The index provided (${index}) is less than -1.`,
+				DOMExceptionNameEnum.indexSizeError
+			);
+		}
+
+		if (index > cells.length) {
+			throw new DOMException(
+				`Failed to execute 'insertCell' on 'HTMLTableRowElement': The index provided (${index}) is greater than the number of cells (${cells.length}).`,
+				DOMExceptionNameEnum.indexSizeError
+			);
+		}
+
+		const cell = this[PropertySymbol.ownerDocument].createElement('th');
+
+		if (index === -1 || index === cells.length) {
+			this.appendChild(cell);
+			return cell;
+		}
+
+		cells[index].parentNode.insertBefore(cell, cells[index]);
+
+		return cell;
+	}
+
+	/**
+	 * Removes the cell corresponding to index. If index is -1, the last cell of the row is removed. If index is less than -1 or greater than the amount of cells in the collection, a DOMException with the value IndexSizeError is raised.
+	 *
+	 * @param index Index.
+	 */
+	public deleteCell(index: number): void {
+		if (arguments.length === 0) {
+			throw new TypeError(
+				"Failed to execute 'deleteCell' on 'HTMLTableRowElement': 1 argument required, but only 0 present."
+			);
+		}
+
+		if (typeof index !== 'number') {
+			index = -1;
+		}
+
+		if (index < -1) {
+			throw new DOMException(
+				`Failed to execute 'deleteCell' on 'HTMLTableRowElement': The index provided (${index}) is less than -1.`,
+				DOMExceptionNameEnum.indexSizeError
+			);
+		}
+
+		const cells = QuerySelector.querySelectorAll(this, 'td,th')[PropertySymbol.items];
+
+		if (index >= cells.length) {
+			throw new DOMException(
+				`Failed to execute 'deleteCell' on 'HTMLTableRowElement': The index provided (${index}) is greater than the number of cells in the row (${cells.length}).`,
+				DOMExceptionNameEnum.indexSizeError
+			);
+		}
+
+		if (index === -1) {
+			index = cells.length - 1;
+		}
+
+		cells[index].remove();
+	}
+}

package/src/nodes/html-table-section-element/HTMLTableSectionElement.ts

@@ -0,0 +1,7 @@
+import HTMLElement from '../html-element/HTMLElement.js';
+/**
+ * HTMLTableSectionElement
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLTableSectionElement
+ */
+export default class HTMLTableSectionElement extends HTMLElement {}

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

@@ -4,6 +4,7 @@ import DocumentFragment from '../document-fragment/DocumentFragment.js';
 import Node from '../node/Node.js';
 import XMLSerializer from '../../xml-serializer/XMLSerializer.js';
 import XMLParser from '../../xml-parser/XMLParser.js';
+import ShadowRoot from '../shadow-root/ShadowRoot.js';
 
 /**
  * HTML Template Element.
@@ -13,7 +14,7 @@ import XMLParser from '../../xml-parser/XMLParser.js';
  */
 export default class HTMLTemplateElement extends HTMLElement {
 	// Public properties
-	public cloneNode: (deep?: boolean) => HTMLTemplateElement;
+	public declare cloneNode: (deep?: boolean) => HTMLTemplateElement;
 
 	// Internal properties
 	public [PropertySymbol.content]: DocumentFragment =
@@ -31,18 +32,19 @@ export default class HTMLTemplateElement extends HTMLElement {
 	/**
 	 * @override
 	 */
-	public get innerHTML(): string {
-		return this.getInnerHTML();
+	public override get innerHTML(): string {
+		return this.getHTML();
 	}
 
 	/**
 	 * @override
 	 */
-	public set innerHTML(html: string) {
+	public override set innerHTML(html: string) {
 		const content = <DocumentFragment>this[PropertySymbol.content];
+		const childNodes = content[PropertySymbol.nodeArray];
 
-		for (const child of content[PropertySymbol.childNodes].slice()) {
-			this[PropertySymbol.content].removeChild(child);
+		while (childNodes.length) {
+			content.removeChild(childNodes[0]);
 		}
 
 		XMLParser.parse(this[PropertySymbol.ownerDocument], html, {
@@ -53,59 +55,83 @@ export default class HTMLTemplateElement extends HTMLElement {
 	/**
 	 * @override
 	 */
-	public get firstChild(): Node {
+	public override get firstChild(): Node {
 		return this[PropertySymbol.content].firstChild;
 	}
 
 	/**
 	 * @override
 	 */
-	public get lastChild(): Node {
+	public override get lastChild(): Node {
 		return this[PropertySymbol.content].lastChild;
 	}
 
 	/**
+	 * @deprecated
 	 * @override
 	 */
-	public getInnerHTML(options?: { includeShadowRoots?: boolean }): string {
-		const xmlSerializer = new XMLSerializer({
-			includeShadowRoots: options && options.includeShadowRoots,
-			escapeEntities: false
-		});
+	public override getInnerHTML(_options?: { includeShadowRoots?: boolean }): string {
+		const xmlSerializer = new XMLSerializer();
+
+		// Options should be ignored as shadow roots should not be serialized for HTMLTemplateElement.
+
 		const content = <DocumentFragment>this[PropertySymbol.content];
 		let xml = '';
-		for (const node of content[PropertySymbol.childNodes]) {
+
+		for (const node of content[PropertySymbol.nodeArray]) {
 			xml += xmlSerializer.serializeToString(node);
 		}
+
+		return xml;
+	}
+
+	/**
+	 * @override
+	 */
+	public override getHTML(_options?: {
+		serializableShadowRoots?: boolean;
+		shadowRoots?: ShadowRoot[];
+	}): string {
+		const xmlSerializer = new XMLSerializer();
+
+		// Options should be ignored as shadow roots should not be serialized for HTMLTemplateElement.
+
+		const content = <DocumentFragment>this[PropertySymbol.content];
+		let xml = '';
+
+		for (const node of content[PropertySymbol.nodeArray]) {
+			xml += xmlSerializer.serializeToString(node);
+		}
+
 		return xml;
 	}
 
 	/**
 	 * @override
 	 */
-	public override [PropertySymbol.appendChild](node: Node): Node {
-		return this[PropertySymbol.content].appendChild(node);
+	public override [PropertySymbol.appendChild](node: Node, isDuringParsing = false): Node {
+		return this[PropertySymbol.content][PropertySymbol.appendChild](node, isDuringParsing);
 	}
 
 	/**
 	 * @override
 	 */
 	public override [PropertySymbol.removeChild](node: Node): Node {
-		return this[PropertySymbol.content].removeChild(node);
+		return this[PropertySymbol.content][PropertySymbol.removeChild](node);
 	}
 
 	/**
 	 * @override
 	 */
 	public override [PropertySymbol.insertBefore](newNode: Node, referenceNode: Node): Node {
-		return this[PropertySymbol.content].insertBefore(newNode, referenceNode);
+		return this[PropertySymbol.content][PropertySymbol.insertBefore](newNode, referenceNode);
 	}
 
 	/**
 	 * @override
 	 */
 	public override [PropertySymbol.replaceChild](newChild: Node, oldChild: Node): Node {
-		return this[PropertySymbol.content].replaceChild(newChild, oldChild);
+		return this[PropertySymbol.content][PropertySymbol.replaceChild](newChild, oldChild);
 	}
 
 	/**