#451 fixes missing inner html in html template

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

@@ -3,6 +3,8 @@ 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';
 
 /**
  * HTML Template Element.
@@ -13,6 +15,35 @@ import IHTMLTemplateElement from './IHTMLTemplateElement';
 export default class HTMLTemplateElement extends HTMLElement implements IHTMLTemplateElement {
 	private _contentElement: IDocumentFragment = null;
 
+	/**
+	 * Sets inner HTML.
+	 *
+	 * @param html HTML.
+	 */
+	public set innerHTML(html: string) {
+		for (const child of this.content.childNodes.slice()) {
+			this.content.removeChild(child);
+		}
+
+		for (const node of XMLParser.parse(this.ownerDocument, html).childNodes.slice()) {
+			this.content.appendChild(node);
+		}
+	}
+
+	/**
+	 * Returns inner HTML.
+	 *
+	 * @returns HTML.
+	 */
+	public get innerHTML(): string {
+		const xmlSerializer = new XMLSerializer();
+		let xml = '';
+		for (const node of this.content.childNodes) {
+			xml += xmlSerializer.serializeToString(node);
+		}
+		return xml;
+	}
+
 	/**
 	 * Returns the content.
 	 *

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

@@ -0,0 +1,29 @@
+import Window from '../../../src/window/Window';
+import Document from '../../../src/nodes/document/Document';
+import HTMLTemplateElement from '../../../src/nodes/html-template-element/HTMLTemplateElement';
+
+describe('HTMLTemplateElement', () => {
+	let window: Window;
+	let document: Document;
+	let element: HTMLTemplateElement;
+
+	beforeEach(() => {
+		window = new Window();
+		document = window.document;
+		element = <HTMLTemplateElement>document.createElement('template');
+	});
+
+	afterEach(() => {
+		jest.restoreAllMocks();
+	});
+
+	it('InnerHTML', () => {
+		const div = '<div>happy-dom is cool!</div>';
+		expect(element.content.childNodes.length).toBe(0);
+		element.innerHTML = div;
+		expect(element.innerHTML).toBe(div);
+		expect(element.content.childNodes.length).toBe(1);
+		element.innerHTML = '';
+		expect(element.content.childNodes.length).toBe(0);
+	});
+});