capricorn86#451@patch: Continue fixes missing innerHTML in html-templ…

…ate.

packages/happy-dom/src/nodes/html-template-element/HTMLTemplateElement.ts

@@ -3,8 +3,9 @@ import HTMLElement from '../html-element/HTMLElement';
 import IDocumentFragment from '../document-fragment/IDocumentFragment';
 import INode from '../node/INode';
 import IHTMLTemplateElement from './IHTMLTemplateElement';
-import XMLSerializer from '../../xml-serializer/XMLSerializer';
 import XMLParser from '../../xml-parser/XMLParser';
+import XMLSerializer from '../../xml-serializer/XMLSerializer';
+import DOMException from '../../exception/DOMException';
 
 /**
  * HTML Template Element.
@@ -13,12 +14,17 @@ import XMLParser from '../../xml-parser/XMLParser';
  * https://developer.mozilla.org/en-US/docs/Web/API/HTMLTemplateElement.
  */
 export default class HTMLTemplateElement extends HTMLElement implements IHTMLTemplateElement {
-	private _contentElement: IDocumentFragment = null;
+	public readonly content: IDocumentFragment = this.ownerDocument.createDocumentFragment();
 
 	/**
-	 * Sets inner HTML.
-	 *
-	 * @param html HTML.
+	 * @override
+	 */
+	public get innerHTML(): string {
+		return this.getInnerHTML();
+	}
+
+	/**
+	 * @override
 	 */
 	public set innerHTML(html: string) {
 		for (const child of this.content.childNodes.slice()) {
@@ -31,116 +37,95 @@ export default class HTMLTemplateElement extends HTMLElement implements IHTMLTem
 	}
 
 	/**
-	 * Returns inner HTML.
-	 *
-	 * @returns HTML.
+	 * @override
 	 */
-	public get innerHTML(): string {
-		const xmlSerializer = new XMLSerializer();
-		let xml = '';
-		for (const node of this.content.childNodes) {
-			xml += xmlSerializer.serializeToString(node);
-		}
-		return xml;
+	public get outerHTML(): string {
+		return new XMLSerializer().serializeToString(this.content);
 	}
 
 	/**
-	 * Returns the content.
-	 *
-	 * @returns Content.
+	 * @override
 	 */
-	public get content(): IDocumentFragment {
-		if (!this._contentElement) {
-			this._contentElement = this.ownerDocument.createDocumentFragment();
-		}
-		return this._contentElement;
+	public set outerHTML(_html: string) {
+		throw new DOMException(
+			`Failed to set the 'outerHTML' property on 'Element': This element has no parent node.`
+		);
 	}
 
 	/**
-	 * Previous sibling.
-	 *
-	 * @returns Node.
+	 * @override
 	 */
 	public get previousSibling(): INode {
 		return this.content.previousSibling;
 	}
 
 	/**
-	 * Next sibling.
-	 *
-	 * @returns Node.
+	 * @override
 	 */
 	public get nextSibling(): INode {
 		return this.content.nextSibling;
 	}
 
 	/**
-	 * First child.
-	 *
-	 * @returns Node.
+	 * @override
 	 */
 	public get firstChild(): INode {
 		return this.content.firstChild;
 	}
 
 	/**
-	 * Last child.
-	 *
-	 * @returns Node.
+	 * @override
 	 */
 	public get lastChild(): INode {
 		return this.content.lastChild;
 	}
 
 	/**
-	 * Append a child node to childNodes.
-	 *
-	 * @param  node Node to append.
-	 * @returns Appended node.
+	 * @override
+	 */
+	public getInnerHTML(options?: { includeShadowRoots?: boolean }): string {
+		const xmlSerializer = new XMLSerializer();
+		let xml = '';
+		for (const node of this.content.childNodes) {
+			xml += xmlSerializer.serializeToString(node, options);
+		}
+		return xml;
+	}
+
+	/**
+	 * @override
 	 */
 	public appendChild(node: INode): INode {
 		return this.content.appendChild(node);
 	}
 
 	/**
-	 * Remove Child element from childNodes array.
-	 *
-	 * @param node Node to remove.
+	 * @override
 	 */
 	public removeChild(node: Node): INode {
 		return this.content.removeChild(node);
 	}
 
 	/**
-	 * Inserts a node before another.
-	 *
-	 * @param newNode Node to insert.
-	 * @param referenceNode Node to insert before.
-	 * @returns Inserted node.
+	 * @override
 	 */
 	public insertBefore(newNode: INode, referenceNode: INode): INode {
 		return this.content.insertBefore(newNode, referenceNode);
 	}
 
 	/**
-	 * Replaces a node with another.
-	 *
-	 * @param newChild New child.
-	 * @param oldChild Old child.
-	 * @returns Replaced node.
+	 * @override
 	 */
 	public replaceChild(newChild: INode, oldChild: INode): INode {
 		return this.content.replaceChild(newChild, oldChild);
 	}
 
 	/**
-	 * Clones a node.
-	 *
 	 * @override
-	 * @param [deep=false] "true" to clone deep.
-	 * @returns Cloned node.
 	 */
 	public cloneNode(deep = false): IHTMLTemplateElement {
-		return <IHTMLTemplateElement>super.cloneNode(deep);
+		const clone = <IHTMLTemplateElement>super.cloneNode(deep);
+		(<IDocumentFragment>clone.content) = this.content.cloneNode(deep);
+		return clone;
 	}
 }