happy-dom 13.6.1 → 13.7.0

package/src/nodes/element/Element.ts

@@ -34,6 +34,8 @@ import WindowBrowserSettingsReader from '../../window/WindowBrowserSettingsReade
 import BrowserErrorCaptureEnum from '../../browser/enums/BrowserErrorCaptureEnum.js';
 import NodeFactory from '../NodeFactory.js';
 import NodeTypeEnum from '../node/NodeTypeEnum.js';
+import IHTMLElementTagNameMap from '../../config/IHTMLElementTagNameMap.js';
+import ISVGElementTagNameMap from '../../config/ISVGElementTagNameMap.js';
 
 /**
  * Element.
@@ -875,6 +877,34 @@ export default class Element extends Node implements IElement {
 	 * @param selector CSS selector.
 	 * @returns Matching elements.
 	 */
+	public querySelectorAll<K extends keyof IHTMLElementTagNameMap>(
+		selector: K
+	): INodeList<IHTMLElementTagNameMap[K]>;
+
+	/**
+	 * Query CSS selector to find matching elments.
+	 *
+	 * @param selector CSS selector.
+	 * @returns Matching elements.
+	 */
+	public querySelectorAll<K extends keyof ISVGElementTagNameMap>(
+		selector: K
+	): INodeList<ISVGElementTagNameMap[K]>;
+
+	/**
+	 * Query CSS selector to find matching elments.
+	 *
+	 * @param selector CSS selector.
+	 * @returns Matching elements.
+	 */
+	public querySelectorAll(selector: string): INodeList<IElement>;
+
+	/**
+	 * Query CSS selector to find matching elments.
+	 *
+	 * @param selector CSS selector.
+	 * @returns Matching elements.
+	 */
 	public querySelectorAll(selector: string): INodeList<IElement> {
 		return QuerySelector.querySelectorAll(this, selector);
 	}
@@ -885,7 +915,35 @@ export default class Element extends Node implements IElement {
 	 * @param selector CSS selector.
 	 * @returns Matching element.
 	 */
-	public querySelector(selector: string): IElement {
+	public querySelector<K extends keyof IHTMLElementTagNameMap>(
+		selector: K
+	): IHTMLElementTagNameMap[K] | null;
+
+	/**
+	 * Query CSS Selector to find matching node.
+	 *
+	 * @param selector CSS selector.
+	 * @returns Matching element.
+	 */
+	public querySelector<K extends keyof ISVGElementTagNameMap>(
+		selector: K
+	): ISVGElementTagNameMap[K] | null;
+
+	/**
+	 * Query CSS Selector to find matching node.
+	 *
+	 * @param selector CSS selector.
+	 * @returns Matching element.
+	 */
+	public querySelector(selector: string): IElement | null;
+
+	/**
+	 * Query CSS Selector to find matching node.
+	 *
+	 * @param selector CSS selector.
+	 * @returns Matching element.
+	 */
+	public querySelector(selector: string): IElement | null {
 		return QuerySelector.querySelector(this, selector);
 	}
 
@@ -899,6 +957,34 @@ export default class Element extends Node implements IElement {
 		return ParentNodeUtility.getElementsByClassName(this, className);
 	}
 
+	/**
+	 * Returns an elements by tag name.
+	 *
+	 * @param tagName Tag name.
+	 * @returns Matching element.
+	 */
+	public getElementsByTagName<K extends keyof IHTMLElementTagNameMap>(
+		tagName: K
+	): IHTMLCollection<IHTMLElementTagNameMap[K]>;
+
+	/**
+	 * Returns an elements by tag name.
+	 *
+	 * @param tagName Tag name.
+	 * @returns Matching element.
+	 */
+	public getElementsByTagName<K extends keyof ISVGElementTagNameMap>(
+		tagName: K
+	): IHTMLCollection<ISVGElementTagNameMap[K]>;
+
+	/**
+	 * Returns an elements by tag name.
+	 *
+	 * @param tagName Tag name.
+	 * @returns Matching element.
+	 */
+	public getElementsByTagName(tagName: string): IHTMLCollection<IElement>;
+
 	/**
 	 * Returns an elements by tag name.
 	 *
@@ -909,6 +995,39 @@ export default class Element extends Node implements IElement {
 		return ParentNodeUtility.getElementsByTagName(this, tagName);
 	}
 
+	/**
+	 * Returns an elements by tag name and namespace.
+	 *
+	 * @param namespaceURI Namespace URI.
+	 * @param tagName Tag name.
+	 * @returns Matching element.
+	 */
+	public getElementsByTagNameNS<K extends keyof IHTMLElementTagNameMap>(
+		namespaceURI: 'http://www.w3.org/1999/xhtml',
+		tagName: K
+	): IHTMLCollection<IHTMLElementTagNameMap[K]>;
+
+	/**
+	 * Returns an elements by tag name and namespace.
+	 *
+	 * @param namespaceURI Namespace URI.
+	 * @param tagName Tag name.
+	 * @returns Matching element.
+	 */
+	public getElementsByTagNameNS<K extends keyof ISVGElementTagNameMap>(
+		namespaceURI: 'http://www.w3.org/2000/svg',
+		tagName: K
+	): IHTMLCollection<ISVGElementTagNameMap[K]>;
+
+	/**
+	 * Returns an elements by tag name and namespace.
+	 *
+	 * @param namespaceURI Namespace URI.
+	 * @param tagName Tag name.
+	 * @returns Matching element.
+	 */
+	public getElementsByTagNameNS(namespaceURI: string, tagName: string): IHTMLCollection<IElement>;
+
 	/**
 	 * Returns an elements by tag name and namespace.
 	 *

package/src/nodes/element/HTMLCollection.ts

@@ -81,6 +81,7 @@ export default class HTMLCollection<T> extends Array implements IHTMLCollection<
 	 */
 	protected [PropertySymbol.isValidPropertyName](name: string): boolean {
 		return (
+			!!name &&
 			!this.constructor.prototype.hasOwnProperty(name) &&
 			!Array.prototype.hasOwnProperty(name) &&
 			(isNaN(Number(name)) || name.includes('.'))

package/src/nodes/html-anchor-element/HTMLAnchorElement.ts

@@ -9,6 +9,7 @@ import INamedNodeMap from '../../named-node-map/INamedNodeMap.js';
 import HTMLAnchorElementNamedNodeMap from './HTMLAnchorElementNamedNodeMap.js';
 import Event from '../../event/Event.js';
 import EventPhaseEnum from '../../event/EventPhaseEnum.js';
+import PointerEvent from '../../event/events/PointerEvent.js';
 
 /**
  * HTML Anchor Element.
@@ -429,6 +430,7 @@ export default class HTMLAnchorElement extends HTMLElement implements IHTMLAncho
 
 		if (
 			event.type === 'click' &&
+			event instanceof PointerEvent &&
 			(event.eventPhase === EventPhaseEnum.atTarget ||
 				event.eventPhase === EventPhaseEnum.bubbling) &&
 			!event.defaultPrevented &&

package/src/nodes/html-button-element/HTMLButtonElement.ts

@@ -12,6 +12,8 @@ import INode from '../node/INode.js';
 import INodeList from '../node/INodeList.js';
 import HTMLButtonElementNamedNodeMap from './HTMLButtonElementNamedNodeMap.js';
 import IHTMLButtonElement from './IHTMLButtonElement.js';
+import PointerEvent from '../../event/events/PointerEvent.js';
+import { URL } from 'url';
 
 const BUTTON_TYPES = ['submit', 'reset', 'button', 'menu'];
 
@@ -122,6 +124,71 @@ export default class HTMLButtonElement extends HTMLElement implements IHTMLButto
 		this.setAttribute('type', this.#sanitizeType(v));
 	}
 
+	/**
+	 * Returns form action.
+	 *
+	 * @returns Form action.
+	 */
+	public get formAction(): string {
+		if (!this.hasAttribute('formaction')) {
+			return this[PropertySymbol.ownerDocument].location.href;
+		}
+
+		try {
+			return new URL(
+				this.getAttribute('formaction') || '',
+				this[PropertySymbol.ownerDocument].location.href
+			).href;
+		} catch (e) {
+			return '';
+		}
+	}
+
+	/**
+	 * Sets form action.
+	 *
+	 * @param formAction Form action.
+	 */
+	public set formAction(formAction: string) {
+		this.setAttribute('formaction', formAction);
+	}
+
+	/**
+	 * Returns form enctype.
+	 *
+	 * @returns Form enctype.
+	 */
+	public get formEnctype(): string {
+		return this.getAttribute('formenctype') || '';
+	}
+
+	/**
+	 * Sets form enctype.
+	 *
+	 * @param formEnctype Form enctype.
+	 */
+	public set formEnctype(formEnctype: string) {
+		this.setAttribute('formenctype', formEnctype);
+	}
+
+	/**
+	 * Returns form method.
+	 *
+	 * @returns Form method.
+	 */
+	public get formMethod(): string {
+		return this.getAttribute('formmethod') || '';
+	}
+
+	/**
+	 * Sets form method.
+	 *
+	 * @param formMethod Form method.
+	 */
+	public set formMethod(formMethod: string) {
+		this.setAttribute('formmethod', formMethod);
+	}
+
 	/**
 	 * Returns no validate.
 	 *
@@ -144,13 +211,40 @@ export default class HTMLButtonElement extends HTMLElement implements IHTMLButto
 		}
 	}
 
+	/**
+	 * Returns form target.
+	 *
+	 * @returns Form target.
+	 */
+	public get formTarget(): string {
+		return this.getAttribute('formtarget') || '';
+	}
+
+	/**
+	 * Sets form target.
+	 *
+	 * @param formTarget Form target.
+	 */
+	public set formTarget(formTarget: string) {
+		this.setAttribute('formtarget', formTarget);
+	}
+
 	/**
 	 * Returns the parent form element.
 	 *
 	 * @returns Form.
 	 */
-	public get form(): IHTMLFormElement {
-		return <IHTMLFormElement>this[PropertySymbol.formNode];
+	public get form(): IHTMLFormElement | null {
+		if (this[PropertySymbol.formNode]) {
+			return <IHTMLFormElement>this[PropertySymbol.formNode];
+		}
+		if (!this.isConnected) {
+			return null;
+		}
+		const formID = this.getAttribute('form');
+		return formID
+			? <IHTMLFormElement>this[PropertySymbol.ownerDocument].getElementById(formID)
+			: null;
 	}
 
 	/**
@@ -201,7 +295,12 @@ export default class HTMLButtonElement extends HTMLElement implements IHTMLButto
 	 * @override
 	 */
 	public override dispatchEvent(event: Event): boolean {
-		if (event.type === 'click' && event.eventPhase === EventPhaseEnum.none && this.disabled) {
+		if (
+			event.type === 'click' &&
+			event instanceof PointerEvent &&
+			event.eventPhase === EventPhaseEnum.none &&
+			this.disabled
+		) {
 			return false;
 		}
 
@@ -209,12 +308,15 @@ export default class HTMLButtonElement extends HTMLElement implements IHTMLButto
 
 		if (
 			event.type === 'click' &&
+			event instanceof PointerEvent &&
 			(event.eventPhase === EventPhaseEnum.atTarget ||
 				event.eventPhase === EventPhaseEnum.bubbling) &&
-			this[PropertySymbol.formNode] &&
 			this[PropertySymbol.isConnected]
 		) {
-			const form = <IHTMLFormElement>this[PropertySymbol.formNode];
+			const form = this.form;
+			if (!form) {
+				return returnValue;
+			}
 			switch (this.type) {
 				case 'submit':
 					form.requestSubmit(this);

package/src/nodes/html-button-element/IHTMLButtonElement.ts

@@ -15,9 +15,13 @@ export default interface IHTMLButtonElement extends IHTMLElement {
 	value: string;
 	disabled: boolean;
 	type: string;
+	formAction: string;
+	formEnctype: string;
+	formMethod: string;
 	formNoValidate: boolean;
+	formTarget: string;
 	readonly validity: ValidityState;
-	readonly form: IHTMLFormElement;
+	readonly form: IHTMLFormElement | null;
 	readonly validationMessage: string;
 	readonly labels: INodeList<IHTMLLabelElement>;
 

package/src/nodes/html-form-element/HTMLFormControlsCollection.ts

@@ -118,6 +118,7 @@ export default class HTMLFormControlsCollection
 	 */
 	protected [PropertySymbol.isValidPropertyName](name: string): boolean {
 		return (
+			!!name &&
 			!this.constructor.prototype.hasOwnProperty(name) &&
 			!Array.prototype.hasOwnProperty(name) &&
 			(isNaN(Number(name)) || name.includes('.'))

package/src/nodes/html-form-element/HTMLFormElement.ts

@@ -10,6 +10,11 @@ import IHTMLInputElement from '../html-input-element/IHTMLInputElement.js';
 import IHTMLTextAreaElement from '../html-text-area-element/IHTMLTextAreaElement.js';
 import IHTMLSelectElement from '../html-select-element/IHTMLSelectElement.js';
 import IHTMLButtonElement from '../html-button-element/IHTMLButtonElement.js';
+import IBrowserFrame from '../../browser/types/IBrowserFrame.js';
+import BrowserFrameNavigator from '../../browser/utilities/BrowserFrameNavigator.js';
+import FormData from '../../form-data/FormData.js';
+import Element from '../element/Element.js';
+import Node from '../node/Node.js';
 
 /**
  * HTML Form Element.
@@ -28,6 +33,19 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	public onreset: (event: Event) => void | null = null;
 	public onsubmit: (event: Event) => void | null = null;
 
+	// Private properties
+	#browserFrame: IBrowserFrame;
+
+	/**
+	 * Constructor.
+	 *
+	 * @param browserFrame Browser frame.
+	 */
+	constructor(browserFrame: IBrowserFrame) {
+		super();
+		this.#browserFrame = browserFrame;
+	}
+
 	/**
 	 * Returns elements.
 	 *
@@ -106,7 +124,18 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @returns Action.
 	 */
 	public get action(): string {
-		return this.getAttribute('action') || '';
+		if (!this.hasAttribute('action')) {
+			return this[PropertySymbol.ownerDocument].location.href;
+		}
+
+		try {
+			return new URL(
+				this.getAttribute('action') || '',
+				this[PropertySymbol.ownerDocument].location.href
+			).href;
+		} catch (e) {
+			return '';
+		}
 	}
 
 	/**
@@ -214,10 +243,10 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 
 	/**
 	 * Submits form. No submit event is raised. In particular, the form's "submit" event handler is not run.
-	 *
-	 * In Happy DOM this means that nothing happens.
 	 */
-	public submit(): void {}
+	public submit(): void {
+		this.#submit();
+	}
 
 	/**
 	 * Submits form, reports validity and raises submit event.
@@ -230,6 +259,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 			this.dispatchEvent(
 				new SubmitEvent('submit', { bubbles: true, cancelable: true, submitter: submitter || this })
 			);
+			this.#submit(submitter);
 		}
 	}
 
@@ -375,8 +405,84 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 */
 	protected [PropertySymbol.isValidPropertyName](name: string): boolean {
 		return (
-			!this.constructor.prototype.hasOwnProperty(name) &&
+			!!name &&
+			!HTMLFormElement.prototype.hasOwnProperty(name) &&
+			!HTMLElement.prototype.hasOwnProperty(name) &&
+			!Element.prototype.hasOwnProperty(name) &&
+			!Node.prototype.hasOwnProperty(name) &&
 			(isNaN(Number(name)) || name.includes('.'))
 		);
 	}
+
+	/**
+	 * Submits form.
+	 *
+	 * @param [submitter] Submitter.
+	 */
+	#submit(submitter?: IHTMLInputElement | IHTMLButtonElement): void {
+		const action = submitter?.hasAttribute('formaction')
+			? submitter?.formAction || this.action
+			: this.action;
+
+		if (!action) {
+			// The URL is invalid when the action is empty.
+			// This is what Chrome does when the URL is invalid.
+			this[PropertySymbol.ownerDocument].location.hash = '#blocked';
+			return;
+		}
+
+		const method = submitter?.formMethod || this.method;
+		const formData = new FormData(this);
+		let targetFrame: IBrowserFrame;
+
+		switch (submitter?.formTarget || this.target) {
+			default:
+			case '_self':
+				targetFrame = this.#browserFrame;
+				break;
+			case '_top':
+				targetFrame = this.#browserFrame.page.mainFrame;
+				break;
+			case '_parent':
+				targetFrame = this.#browserFrame.parentFrame ?? this.#browserFrame;
+				break;
+			case '_blank':
+				const newPage = this.#browserFrame.page.context.newPage();
+				targetFrame = newPage.mainFrame;
+				targetFrame[PropertySymbol.openerFrame] = this.#browserFrame;
+				break;
+		}
+
+		if (method === 'get') {
+			const url = new URL(action);
+
+			for (const [key, value] of formData) {
+				if (typeof value === 'string') {
+					url.searchParams.append(key, value);
+				}
+			}
+
+			BrowserFrameNavigator.navigate({
+				windowClass: this[PropertySymbol.ownerDocument][PropertySymbol.defaultView].constructor,
+				frame: targetFrame,
+				url: url.href,
+				goToOptions: {
+					referrer: this.#browserFrame.page.mainFrame.window.location.origin
+				}
+			});
+
+			return;
+		}
+
+		BrowserFrameNavigator.navigate({
+			windowClass: this[PropertySymbol.ownerDocument][PropertySymbol.defaultView].constructor,
+			frame: targetFrame,
+			method: method,
+			url: action,
+			formData,
+			goToOptions: {
+				referrer: this.#browserFrame.page.mainFrame.window.location.origin
+			}
+		});
+	}
 }

package/src/nodes/html-iframe-element/HTMLIFrameElement.ts

@@ -172,6 +172,22 @@ export default class HTMLIFrameElement extends HTMLElement implements IHTMLIFram
 		this.setAttribute('srcdoc', srcdoc);
 	}
 
+	/**
+	 * Returns referrer policy.
+	 */
+	public get referrerPolicy(): string {
+		return this.getAttribute('referrerpolicy') || '';
+	}
+
+	/**
+	 * Sets referrer policy.
+	 *
+	 * @param referrerPolicy Referrer policy.
+	 */
+	public set referrerPolicy(referrerPolicy: string) {
+		this.setAttribute('referrerpolicy', referrerPolicy);
+	}
+
 	/**
 	 * Returns content document.
 	 *

package/src/nodes/html-iframe-element/HTMLIFrameElementPageLoader.ts

@@ -10,6 +10,7 @@ import DOMException from '../../exception/DOMException.js';
 import DOMExceptionNameEnum from '../../exception/DOMExceptionNameEnum.js';
 import BrowserFrameURL from '../../browser/utilities/BrowserFrameURL.js';
 import BrowserFrameFactory from '../../browser/utilities/BrowserFrameFactory.js';
+import IRequestReferrerPolicy from '../../fetch/types/IRequestReferrerPolicy.js';
 
 /**
  * HTML Iframe page loader.
@@ -84,7 +85,10 @@ export default class HTMLIFrameElementPageLoader {
 			parentWindow;
 
 		this.#browserIFrame
-			.goto(targetURL.href)
+			.goto(targetURL.href, {
+				referrer: originURL.origin,
+				referrerPolicy: <IRequestReferrerPolicy>this.#element.referrerPolicy
+			})
 			.then(() => this.#element.dispatchEvent(new Event('load')))
 			.catch((error) => WindowErrorUtility.dispatchError(this.#element, error));
 

package/src/nodes/html-iframe-element/IHTMLIFrameElement.ts

@@ -18,6 +18,7 @@ export default interface IHTMLIFrameElement extends IHTMLElement {
 	name: string | null;
 	sandbox: string | null;
 	srcdoc: string | null;
+	referrerPolicy: string | null;
 	readonly contentDocument: IDocument | null;
 	readonly contentWindow: IBrowserWindow | ICrossOriginBrowserWindow | null;