happy-dom 8.8.0 → 9.0.0

package/src/nodes/html-element/HTMLElement.ts

@@ -63,7 +63,7 @@ export default class HTMLElement extends Element implements IHTMLElement {
 	 * @returns Tab index.
 	 */
 	public get tabIndex(): number {
-		const tabIndex = this.getAttributeNS(null, 'tabindex');
+		const tabIndex = this.getAttribute('tabindex');
 		return tabIndex !== null ? Number(tabIndex) : -1;
 	}
 
@@ -74,9 +74,9 @@ export default class HTMLElement extends Element implements IHTMLElement {
 	 */
 	public set tabIndex(tabIndex: number) {
 		if (tabIndex === -1) {
-			this.removeAttributeNS(null, 'tabindex');
+			this.removeAttribute('tabindex');
 		} else {
-			this.setAttributeNS(null, 'tabindex', String(tabIndex));
+			this.setAttribute('tabindex', String(tabIndex));
 		}
 	}
 
@@ -290,7 +290,7 @@ export default class HTMLElement extends Element implements IHTMLElement {
 	 * @returns Direction.
 	 */
 	public get dir(): string {
-		return this.getAttributeNS(null, 'dir') || '';
+		return this.getAttribute('dir') || '';
 	}
 
 	/**
@@ -299,7 +299,7 @@ export default class HTMLElement extends Element implements IHTMLElement {
 	 * @param direction Direction.
 	 */
 	public set dir(direction: string) {
-		this.setAttributeNS(null, 'dir', direction);
+		this.setAttribute('dir', direction);
 	}
 
 	/**
@@ -308,7 +308,7 @@ export default class HTMLElement extends Element implements IHTMLElement {
 	 * @returns Hidden.
 	 */
 	public get hidden(): boolean {
-		return this.getAttributeNS(null, 'hidden') !== null;
+		return this.getAttribute('hidden') !== null;
 	}
 
 	/**
@@ -318,9 +318,9 @@ export default class HTMLElement extends Element implements IHTMLElement {
 	 */
 	public set hidden(hidden: boolean) {
 		if (!hidden) {
-			this.removeAttributeNS(null, 'hidden');
+			this.removeAttribute('hidden');
 		} else {
-			this.setAttributeNS(null, 'hidden', '');
+			this.setAttribute('hidden', '');
 		}
 	}
 
@@ -330,7 +330,7 @@ export default class HTMLElement extends Element implements IHTMLElement {
 	 * @returns Language.
 	 */
 	public get lang(): string {
-		return this.getAttributeNS(null, 'lang') || '';
+		return this.getAttribute('lang') || '';
 	}
 
 	/**
@@ -339,7 +339,7 @@ export default class HTMLElement extends Element implements IHTMLElement {
 	 * @param language Language.
 	 */
 	public set lang(lang: string) {
-		this.setAttributeNS(null, 'lang', lang);
+		this.setAttribute('lang', lang);
 	}
 
 	/**
@@ -348,7 +348,7 @@ export default class HTMLElement extends Element implements IHTMLElement {
 	 * @returns Title.
 	 */
 	public get title(): string {
-		return this.getAttributeNS(null, 'title') || '';
+		return this.getAttribute('title') || '';
 	}
 
 	/**
@@ -357,7 +357,7 @@ export default class HTMLElement extends Element implements IHTMLElement {
 	 * @param title Title.
 	 */
 	public set title(title: string) {
-		this.setAttributeNS(null, 'title', title);
+		this.setAttribute('title', title);
 	}
 
 	/**

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

@@ -0,0 +1,76 @@
+import IHTMLFormControlsCollection from './IHTMLFormControlsCollection';
+import IHTMLInputElement from '../html-input-element/IHTMLInputElement';
+import IHTMLTextAreaElement from '../html-text-area-element/IHTMLTextAreaElement';
+import IHTMLSelectElement from '../html-select-element/IHTMLSelectElement';
+import HTMLCollection from '../element/HTMLCollection';
+import RadioNodeList from './RadioNodeList';
+import IHTMLButtonElement from '../html-button-element/IHTMLButtonElement';
+import IRadioNodeList from './IRadioNodeList';
+
+/**
+ * HTMLFormControlsCollection.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormControlsCollection
+ */
+export default class HTMLFormControlsCollection
+	extends HTMLCollection<
+		IHTMLInputElement | IHTMLTextAreaElement | IHTMLSelectElement | IHTMLButtonElement,
+		| IHTMLInputElement
+		| IHTMLTextAreaElement
+		| IHTMLSelectElement
+		| IHTMLButtonElement
+		| IRadioNodeList
+	>
+	implements IHTMLFormControlsCollection
+{
+	public _namedItems: { [k: string]: RadioNodeList } = {};
+
+	/**
+	 * Appends named item.
+	 *
+	 * @param node Node.
+	 * @param name Name.
+	 */
+	public _appendNamedItem(
+		node: IHTMLInputElement | IHTMLTextAreaElement | IHTMLSelectElement | IHTMLButtonElement,
+		name: string
+	): void {
+		if (name) {
+			this._namedItems[name] = this._namedItems[name] || new RadioNodeList();
+
+			if (!this._namedItems[name].includes(node)) {
+				this._namedItems[name].push(node);
+			}
+
+			this[name] =
+				this._namedItems[name].length > 1 ? this._namedItems[name] : this._namedItems[name][0];
+		}
+	}
+
+	/**
+	 * Appends named item.
+	 *
+	 * @param node Node.
+	 * @param name Name.
+	 */
+	public _removeNamedItem(
+		node: IHTMLInputElement | IHTMLTextAreaElement | IHTMLSelectElement | IHTMLButtonElement,
+		name: string
+	): void {
+		if (name && this._namedItems[name]) {
+			const index = this._namedItems[name].indexOf(node);
+
+			if (index > -1) {
+				this._namedItems[name].splice(index, 1);
+
+				if (this._namedItems[name].length === 0) {
+					delete this._namedItems[name];
+					delete this[name];
+				} else {
+					this[name] =
+						this._namedItems[name].length > 1 ? this._namedItems[name] : this._namedItems[name][0];
+				}
+			}
+		}
+	}
+}

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

@@ -1,7 +1,13 @@
 import HTMLElement from '../html-element/HTMLElement';
-import IElement from '../element/IElement';
 import IHTMLFormElement from './IHTMLFormElement';
 import Event from '../../event/Event';
+import HTMLFormControlsCollection from './HTMLFormControlsCollection';
+import IHTMLFormControlsCollection from './IHTMLFormControlsCollection';
+import INode from '../node/INode';
+import IHTMLInputElement from '../html-input-element/IHTMLInputElement';
+import IHTMLTextAreaElement from '../html-text-area-element/IHTMLTextAreaElement';
+import IHTMLSelectElement from '../html-select-element/IHTMLSelectElement';
+import IHTMLButtonElement from '../html-button-element/IHTMLButtonElement';
 
 /**
  * HTML Form Element.
@@ -10,18 +16,25 @@ import Event from '../../event/Event';
  * https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement.
  */
 export default class HTMLFormElement extends HTMLElement implements IHTMLFormElement {
+	// Public properties.
+	public readonly elements: IHTMLFormControlsCollection = new HTMLFormControlsCollection();
+	public readonly length = 0;
+
 	// Events
 	public onformdata: (event: Event) => void | null = null;
 	public onreset: (event: Event) => void | null = null;
 	public onsubmit: (event: Event) => void | null = null;
 
+	// Private properties
+	public _formNode: INode = this;
+
 	/**
 	 * Returns name.
 	 *
 	 * @returns Name.
 	 */
 	public get name(): string {
-		return this.getAttributeNS(null, 'name') || '';
+		return this.getAttribute('name') || '';
 	}
 
 	/**
@@ -30,7 +43,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @param name Name.
 	 */
 	public set name(name: string) {
-		this.setAttributeNS(null, 'name', name);
+		this.setAttribute('name', name);
 	}
 
 	/**
@@ -39,7 +52,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @returns Method.
 	 */
 	public get method(): string {
-		return this.getAttributeNS(null, 'method') || 'get';
+		return this.getAttribute('method') || 'get';
 	}
 
 	/**
@@ -48,7 +61,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @param method Method.
 	 */
 	public set method(method: string) {
-		this.setAttributeNS(null, 'method', method);
+		this.setAttribute('method', method);
 	}
 
 	/**
@@ -57,7 +70,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @returns Target.
 	 */
 	public get target(): string {
-		return this.getAttributeNS(null, 'target') || '';
+		return this.getAttribute('target') || '';
 	}
 
 	/**
@@ -66,7 +79,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @param target Target.
 	 */
 	public set target(target: string) {
-		this.setAttributeNS(null, 'target', target);
+		this.setAttribute('target', target);
 	}
 
 	/**
@@ -75,7 +88,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @returns Action.
 	 */
 	public get action(): string {
-		return this.getAttributeNS(null, 'action') || '';
+		return this.getAttribute('action') || '';
 	}
 
 	/**
@@ -84,7 +97,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @param action Action.
 	 */
 	public set action(action: string) {
-		this.setAttributeNS(null, 'action', action);
+		this.setAttribute('action', action);
 	}
 
 	/**
@@ -93,7 +106,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @returns Encoding.
 	 */
 	public get encoding(): string {
-		return this.getAttributeNS(null, 'encoding') || '';
+		return this.getAttribute('encoding') || '';
 	}
 
 	/**
@@ -102,7 +115,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @param encoding Encoding.
 	 */
 	public set encoding(encoding: string) {
-		this.setAttributeNS(null, 'encoding', encoding);
+		this.setAttribute('encoding', encoding);
 	}
 
 	/**
@@ -111,7 +124,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @returns Enctype.
 	 */
 	public get enctype(): string {
-		return this.getAttributeNS(null, 'enctype') || '';
+		return this.getAttribute('enctype') || '';
 	}
 
 	/**
@@ -120,7 +133,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @param enctype Enctype.
 	 */
 	public set enctype(enctype: string) {
-		this.setAttributeNS(null, 'enctype', enctype);
+		this.setAttribute('enctype', enctype);
 	}
 
 	/**
@@ -129,7 +142,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @returns Autocomplete.
 	 */
 	public get autocomplete(): string {
-		return this.getAttributeNS(null, 'autocomplete') || '';
+		return this.getAttribute('autocomplete') || '';
 	}
 
 	/**
@@ -138,7 +151,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @param autocomplete Autocomplete.
 	 */
 	public set autocomplete(autocomplete: string) {
-		this.setAttributeNS(null, 'autocomplete', autocomplete);
+		this.setAttribute('autocomplete', autocomplete);
 	}
 
 	/**
@@ -147,7 +160,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @returns Accept charset.
 	 */
 	public get acceptCharset(): string {
-		return this.getAttributeNS(null, 'acceptcharset') || '';
+		return this.getAttribute('acceptcharset') || '';
 	}
 
 	/**
@@ -156,7 +169,7 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @param acceptCharset Accept charset.
 	 */
 	public set acceptCharset(acceptCharset: string) {
-		this.setAttributeNS(null, 'acceptcharset', acceptCharset);
+		this.setAttribute('acceptcharset', acceptCharset);
 	}
 
 	/**
@@ -164,8 +177,8 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 *
 	 * @returns No validate.
 	 */
-	public get noValidate(): string {
-		return this.getAttributeNS(null, 'novalidate') || '';
+	public get noValidate(): boolean {
+		return this.getAttribute('novalidate') !== null;
 	}
 
 	/**
@@ -173,42 +186,60 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 *
 	 * @param noValidate No validate.
 	 */
-	public set noValidate(noValidate: string) {
-		this.setAttributeNS(null, 'novalidate', noValidate);
+	public set noValidate(noValidate: boolean) {
+		if (!noValidate) {
+			this.removeAttribute('novalidate');
+		} else {
+			this.setAttribute('novalidate', '');
+		}
 	}
 
 	/**
-	 * Returns input elements.
+	 * Submits form. No submit event is raised. In particular, the form's "submit" event handler is not run.
 	 *
-	 * @returns Elements.
+	 * In Happy DOM this means that nothing happens.
 	 */
-	public get elements(): IElement[] {
-		return this.querySelectorAll('input,textarea');
-	}
+	public submit(): void {}
 
 	/**
-	 * Returns number of input elements.
+	 * Submits form, reports validity and raises submit event.
 	 *
-	 * @returns Length.
+	 * @param [submitter] Submitter.
 	 */
-	public get length(): number {
-		return this.elements.length;
+	public requestSubmit(submitter?: IHTMLInputElement | IHTMLButtonElement): void {
+		const noValidate = submitter?.formNoValidate || this.noValidate;
+		if (noValidate || this.checkValidity()) {
+			this.dispatchEvent(new Event('submit', { bubbles: true, cancelable: true }));
+		}
 	}
 
-	/**
-	 * Submits form.
-	 */
-	public submit(): void {}
-
 	/**
 	 * Resets form.
 	 */
-	public reset(): void {}
+	public reset(): void {
+		for (const element of this.elements) {
+			if (element.tagName === 'INPUT' || element.tagName === 'TEXTAREA') {
+				element['_value'] = null;
+				element['_checked'] = null;
+			} else if (element.tagName === 'TEXTAREA') {
+				element['_value'] = null;
+			} else if (element.tagName === 'SELECT') {
+				let hasSelectedAttribute = false;
+				for (const option of (<IHTMLSelectElement>element).options) {
+					if (option.hasAttribute('selected')) {
+						hasSelectedAttribute = true;
+						option.selected = true;
+						break;
+					}
+				}
+				if (!hasSelectedAttribute && (<IHTMLSelectElement>element).options.length > 0) {
+					(<IHTMLSelectElement>element).options[0].selected = true;
+				}
+			}
+		}
 
-	/**
-	 * Reports validity.
-	 */
-	public reportValidity(): void {}
+		this.dispatchEvent(new Event('reset', { bubbles: true, cancelable: true }));
+	}
 
 	/**
 	 * Checks validity.
@@ -216,7 +247,32 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	 * @returns "true" if validation does'nt fail.
 	 */
 	public checkValidity(): boolean {
-		return true;
+		const radioValidationState: { [k: string]: boolean } = {};
+		let isFormValid = true;
+
+		for (const element of this.elements) {
+			if (element.tagName === 'INPUT' && element.type === 'radio' && element.name) {
+				if (!radioValidationState[element.name]) {
+					radioValidationState[element.name] = true;
+					if (!element.checkValidity()) {
+						isFormValid = false;
+					}
+				}
+			} else if (!element.checkValidity()) {
+				isFormValid = false;
+			}
+		}
+
+		return isFormValid;
+	}
+
+	/**
+	 * Reports validity.
+	 *
+	 * @returns "true" if validation does'nt fail.
+	 */
+	public reportValidity(): boolean {
+		return this.checkValidity();
 	}
 
 	/**
@@ -229,4 +285,54 @@ export default class HTMLFormElement extends HTMLElement implements IHTMLFormEle
 	public cloneNode(deep = false): IHTMLFormElement {
 		return <IHTMLFormElement>super.cloneNode(deep);
 	}
+
+	/**
+	 * Appends a form control item.
+	 *
+	 * @param node Node.
+	 * @param name Name
+	 */
+	public _appendFormControlItem(
+		node: IHTMLInputElement | IHTMLTextAreaElement | IHTMLSelectElement | IHTMLButtonElement,
+		name: string
+	): void {
+		if (!this.elements.includes(node)) {
+			this[this.elements.length] = node;
+			this.elements.push(node);
+			(<number>this.length) = this.elements.length;
+		}
+
+		(<HTMLFormControlsCollection>this.elements)._appendNamedItem(node, name);
+		this[name] = this.elements[name];
+	}
+
+	/**
+	 * Remove a form control item.
+	 *
+	 * @param node Node.
+	 * @param name Name.
+	 */
+	public _removeFormControlItem(
+		node: IHTMLInputElement | IHTMLTextAreaElement | IHTMLSelectElement | IHTMLButtonElement,
+		name: string
+	): void {
+		const index = this.elements.indexOf(node);
+
+		if (index !== -1) {
+			this.elements.splice(index, 1);
+			for (let i = index; i < this.length; i++) {
+				this[i] = this[i + 1];
+			}
+			delete this[this.length - 1];
+			(<number>this.length)--;
+		}
+
+		(<HTMLFormControlsCollection>this.elements)._removeNamedItem(node, name);
+
+		if (this.elements[name]) {
+			this[name] = this.elements[name];
+		} else {
+			delete this[name];
+		}
+	}
 }

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

@@ -0,0 +1,45 @@
+import IHTMLCollection from '../element/IHTMLCollection';
+import IHTMLButtonElement from '../html-button-element/IHTMLButtonElement';
+import IHTMLInputElement from '../html-input-element/IHTMLInputElement';
+import IHTMLSelectElement from '../html-select-element/IHTMLSelectElement';
+import IHTMLTextAreaElement from '../html-text-area-element/IHTMLTextAreaElement';
+import IRadioNodeList from './IRadioNodeList';
+
+/**
+ * HTMLFormControlsCollection.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormControlsCollection
+ */
+export default interface IHTMLFormControlsCollection
+	extends IHTMLCollection<
+		IHTMLInputElement | IHTMLTextAreaElement | IHTMLSelectElement | IHTMLButtonElement,
+		| IHTMLInputElement
+		| IHTMLTextAreaElement
+		| IHTMLSelectElement
+		| IHTMLButtonElement
+		| IRadioNodeList
+	> {
+	/**
+	 * Returns item by index.
+	 *
+	 * @param index Index.
+	 */
+	item(
+		index: number
+	): IHTMLInputElement | IHTMLTextAreaElement | IHTMLSelectElement | IHTMLButtonElement | null;
+
+	/**
+	 * Returns named item.
+	 *
+	 * @param name Name.
+	 */
+	namedItem(
+		name: string
+	):
+		| IHTMLInputElement
+		| IHTMLTextAreaElement
+		| IHTMLSelectElement
+		| IHTMLButtonElement
+		| IRadioNodeList
+		| null;
+}

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

@@ -1,6 +1,8 @@
 import Event from '../../event/Event';
-import IElement from '../element/IElement';
+import IHTMLButtonElement from '../html-button-element/IHTMLButtonElement';
 import IHTMLElement from '../html-element/IHTMLElement';
+import IHTMLInputElement from '../html-input-element/IHTMLInputElement';
+import IHTMLFormControlsCollection from './IHTMLFormControlsCollection';
 
 /**
  * HTML Form Element.
@@ -17,9 +19,9 @@ export default interface IHTMLFormElement extends IHTMLElement {
 	enctype: string;
 	autocomplete: string;
 	acceptCharset: string;
-	noValidate: string;
-	elements: IElement[];
-	length: number;
+	noValidate: boolean;
+	readonly elements: IHTMLFormControlsCollection;
+	readonly length: number;
 
 	// Events
 	onformdata: (event: Event) => void | null;
@@ -27,10 +29,19 @@ export default interface IHTMLFormElement extends IHTMLElement {
 	onsubmit: (event: Event) => void | null;
 
 	/**
-	 * Submits form.
+	 * 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.
 	 */
 	submit(): void;
 
+	/**
+	 * Submits form, reports validity and raises submit event.
+	 *
+	 * @param [submitter] Submitter.
+	 */
+	requestSubmit(submitter?: IHTMLInputElement | IHTMLButtonElement): void;
+
 	/**
 	 * Resets form.
 	 */
@@ -39,7 +50,7 @@ export default interface IHTMLFormElement extends IHTMLElement {
 	/**
 	 * Reports validity.
 	 */
-	reportValidity(): void;
+	reportValidity(): boolean;
 
 	/**
 	 * Checks validity.

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

@@ -0,0 +1,16 @@
+import IElement from '../element/IElement';
+import INodeList from '../node/INodeList';
+
+/**
+ * RadioNodeList.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/RadioNodeList
+ */
+export default interface IRadioNodeList extends INodeList<IElement> {
+	/**
+	 * Returns value.
+	 *
+	 * @returns Value.
+	 */
+	readonly value: string;
+}

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

@@ -0,0 +1,24 @@
+import IElement from '../element/IElement';
+import NodeList from '../node/NodeList';
+import IRadioNodeList from './IRadioNodeList';
+
+/**
+ * RadioNodeList
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/RadioNodeList
+ */
+export default class RadioNodeList extends NodeList<IElement> implements IRadioNodeList {
+	/**
+	 * Returns value.
+	 *
+	 * @returns Value.
+	 */
+	public get value(): string {
+		for (const node of this) {
+			if (node.checked) {
+				return node.value;
+			}
+		}
+		return null;
+	}
+}