happy-dom 14.12.3 → 15.0.0

package/src/nodes/element/HTMLCollection.ts

@@ -1,89 +1,255 @@
+import ClassMethodBinder from '../../ClassMethodBinder.js';
 import * as PropertySymbol from '../../PropertySymbol.js';
+import Element from './Element.js';
 
 /**
- * HTML collection.
+ * HTMLCollection.
+ *
+ * We are extending Array here to improve performance.
+ * However, we should not expose Array methods to the outside.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLCollection
  */
-export default class HTMLCollection<T> extends Array implements HTMLCollection<T> {
-	protected [PropertySymbol.namedItems]: { [k: string]: T[] } = {};
+export default class HTMLCollection<T extends Element, NamedItem = T> {
+	[index: number]: T;
+	protected [PropertySymbol.query]: () => T[];
 
 	/**
-	 * Returns item by index.
+	 * Constructor.
 	 *
-	 * @param index Index.
+	 * @param [illegalConstructorSymbol] Illegal constructor symbol.
+	 * @param query Query function.
 	 */
-	public item(index: number): T | null {
-		return index >= 0 && this[index] ? this[index] : null;
+	constructor(illegalConstructorSymbol?: symbol, query: () => T[] = () => []) {
+		if (illegalConstructorSymbol !== PropertySymbol.illegalConstructor) {
+			throw new TypeError('Illegal constructor');
+		}
+
+		this[PropertySymbol.query] = query;
+
+		// This only works for one level of inheritance, but it should be fine as there is no collection that goes deeper according to spec.
+		ClassMethodBinder.bindMethods(
+			this,
+			this.constructor !== HTMLCollection ? [HTMLCollection, this.constructor] : [HTMLCollection],
+			{
+				bindSymbols: true,
+				forwardToPrototype: true
+			}
+		);
+
+		return new Proxy(this, {
+			get: (target, property) => {
+				if (property === 'length') {
+					return query().length;
+				}
+				if (property in target || typeof property === 'symbol') {
+					return target[property];
+				}
+
+				const index = Number(property);
+				if (!isNaN(index)) {
+					return query()[index];
+				}
+				return target.namedItem(<string>property) || undefined;
+			},
+			set(target, property, newValue): boolean {
+				if (typeof property === 'symbol') {
+					target[property] = newValue;
+					return true;
+				}
+				const index = Number(property);
+				if (isNaN(index)) {
+					target[property] = newValue;
+				}
+				return true;
+			},
+			deleteProperty(target, property): boolean {
+				if (typeof property === 'symbol') {
+					delete target[property];
+					return true;
+				}
+				const index = Number(property);
+				if (isNaN(index)) {
+					delete target[property];
+				}
+				return true;
+			},
+			ownKeys(): string[] {
+				const keys: string[] = [];
+				const items = query();
+				for (let i = 0; i < items.length; i++) {
+					const item = items[i];
+					const name =
+						item[PropertySymbol.attributes][PropertySymbol.namedItems].get('id')?.[
+							PropertySymbol.value
+						] ||
+						item[PropertySymbol.attributes][PropertySymbol.namedItems].get('name')?.[
+							PropertySymbol.value
+						];
+					keys.push(String(i));
+
+					if (name) {
+						keys.push(name);
+					}
+				}
+				return keys;
+			},
+			has(target, property): boolean {
+				if (property in target) {
+					return true;
+				}
+
+				const items = query();
+				const index = Number(property);
+
+				if (!isNaN(index) && index >= 0 && index < items.length) {
+					return true;
+				}
+
+				property = String(property);
+
+				for (let i = 0; i < items.length; i++) {
+					const item = items[i];
+					const name =
+						item[PropertySymbol.attributes][PropertySymbol.namedItems].get('id')?.[
+							PropertySymbol.value
+						] ||
+						item[PropertySymbol.attributes][PropertySymbol.namedItems].get('name')?.[
+							PropertySymbol.value
+						];
+
+					if (name && name === property) {
+						return true;
+					}
+				}
+
+				return false;
+			},
+			defineProperty(target, property, descriptor): boolean {
+				if (property in target) {
+					Object.defineProperty(target, property, descriptor);
+					return true;
+				}
+
+				return false;
+			},
+			getOwnPropertyDescriptor(target, property): PropertyDescriptor {
+				if (property in target || typeof property === 'symbol') {
+					return;
+				}
+
+				const items = query();
+				const index = Number(property);
+
+				if (!isNaN(index) && index >= 0 && index < items.length) {
+					return {
+						value: items[index],
+						writable: false,
+						enumerable: true,
+						configurable: true
+					};
+				}
+
+				for (let i = 0; i < items.length; i++) {
+					const item = items[i];
+					const name =
+						item[PropertySymbol.attributes][PropertySymbol.namedItems].get('id')?.[
+							PropertySymbol.value
+						] ||
+						item[PropertySymbol.attributes][PropertySymbol.namedItems].get('name')?.[
+							PropertySymbol.value
+						];
+
+					if (name && name === property) {
+						return {
+							value: item,
+							writable: false,
+							enumerable: true,
+							configurable: true
+						};
+					}
+				}
+			}
+		});
 	}
 
 	/**
-	 * Returns named item.
+	 * Returns length.
 	 *
-	 * @param name Name.
-	 * @returns Node.
+	 * @returns Length.
 	 */
-	public namedItem(name: string): T | null {
-		return this[PropertySymbol.namedItems][name] && this[PropertySymbol.namedItems][name].length
-			? this[PropertySymbol.namedItems][name][0]
-			: null;
+	public get length(): number {
+		return this[PropertySymbol.query]().length;
 	}
 
 	/**
-	 * Appends named item.
+	 * Returns `Symbol.toStringTag`.
 	 *
-	 * @param node Node.
-	 * @param name Name.
+	 * @returns `Symbol.toStringTag`.
 	 */
-	public [PropertySymbol.appendNamedItem](node: T, name: string): void {
-		if (name) {
-			this[PropertySymbol.namedItems][name] = this[PropertySymbol.namedItems][name] || [];
-
-			if (!this[PropertySymbol.namedItems][name].includes(node)) {
-				this[PropertySymbol.namedItems][name].push(node);
-			}
+	public get [Symbol.toStringTag](): string {
+		return this.constructor.name;
+	}
 
-			if (!this.hasOwnProperty(name) && this[PropertySymbol.isValidPropertyName](name)) {
-				this[name] = this[PropertySymbol.namedItems][name][0];
-			}
-		}
+	/**
+	 * Returns `[object HTMLCollection]`.
+	 *
+	 * @returns `[object HTMLCollection]`.
+	 */
+	public toLocaleString(): string {
+		return `[object ${this.constructor.name}]`;
 	}
 
 	/**
-	 * Appends named item.
+	 * Returns `[object HTMLCollection]`.
 	 *
-	 * @param node Node.
-	 * @param name Name.
+	 * @returns `[object HTMLCollection]`.
 	 */
-	public [PropertySymbol.removeNamedItem](node: T, name: string): void {
-		if (name && this[PropertySymbol.namedItems][name]) {
-			const index = this[PropertySymbol.namedItems][name].indexOf(node);
+	public toString(): string {
+		return `[object ${this.constructor.name}]`;
+	}
 
-			if (index > -1) {
-				this[PropertySymbol.namedItems][name].splice(index, 1);
+	/**
+	 * Returns item by index.
+	 *
+	 * @param index Index.
+	 */
+	public item(index: number): T {
+		const items = this[PropertySymbol.query]();
+		return index >= 0 && items[index] ? items[index] : null;
+	}
 
-				if (this[PropertySymbol.namedItems][name].length === 0) {
-					delete this[PropertySymbol.namedItems][name];
-					if (this.hasOwnProperty(name) && this[PropertySymbol.isValidPropertyName](name)) {
-						delete this[name];
-					}
-				} else if (this[PropertySymbol.isValidPropertyName](name)) {
-					this[name] = this[PropertySymbol.namedItems][name][0];
-				}
-			}
-		}
+	/**
+	 * Returns an iterator, allowing you to go through all values of the key/value pairs contained in this object.
+	 *
+	 * @returns Iterator.
+	 */
+	public [Symbol.iterator](): IterableIterator<T> {
+		const items = this[PropertySymbol.query]();
+		return items[Symbol.iterator]();
 	}
 
 	/**
-	 * Returns "true" if the property name is valid.
+	 * Returns named item.
 	 *
 	 * @param name Name.
-	 * @returns True if the property name is valid.
+	 * @returns Node.
 	 */
-	protected [PropertySymbol.isValidPropertyName](name: string): boolean {
-		return (
-			!!name &&
-			!this.constructor.prototype.hasOwnProperty(name) &&
-			!Array.prototype.hasOwnProperty(name) &&
-			(isNaN(Number(name)) || name.includes('.'))
-		);
+	public namedItem(name: string): NamedItem | null {
+		const items = this[PropertySymbol.query]();
+		name = String(name);
+		for (const item of items) {
+			if (
+				item[PropertySymbol.attributes][PropertySymbol.namedItems].get('id')?.[
+					PropertySymbol.value
+				] === name ||
+				item[PropertySymbol.attributes][PropertySymbol.namedItems].get('name')?.[
+					PropertySymbol.value
+				] === name
+			) {
+				return <NamedItem>(<unknown>item);
+			}
+		}
+		return null;
 	}
 }

package/src/nodes/element/NamedNodeMap.ts

@@ -0,0 +1,273 @@
+import * as PropertySymbol from '../../PropertySymbol.js';
+import Attr from '../attr/Attr.js';
+import DOMException from '../../exception/DOMException.js';
+import DOMExceptionNameEnum from '../../exception/DOMExceptionNameEnum.js';
+import Element from './Element.js';
+import NamespaceURI from '../../config/NamespaceURI.js';
+
+/**
+ * Named Node Map.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/NamedNodeMap
+ */
+export default class NamedNodeMap {
+	[index: number]: Attr;
+
+	// All items with the namespaceURI as prefix
+	public [PropertySymbol.namespaceItems]: Map<string, Attr> = new Map();
+
+	// Items without namespaceURI as prefix, where the HTML namespace is the default namespace
+	public [PropertySymbol.namedItems]: Map<string, Attr> = new Map();
+
+	public declare [PropertySymbol.ownerElement]: Element;
+
+	/**
+	 * Constructor.
+	 *
+	 * @param ownerElement Owner element.
+	 */
+	constructor(ownerElement: Element) {
+		this[PropertySymbol.ownerElement] = ownerElement;
+	}
+
+	/**
+	 * Returns length.
+	 *
+	 * @returns Length.
+	 */
+	public get length(): number {
+		return this[PropertySymbol.namespaceItems].size;
+	}
+
+	/**
+	 * Returns string.
+	 *
+	 * @returns string.
+	 */
+	public get [Symbol.toStringTag](): string {
+		return 'NamedNodeMap';
+	}
+
+	/**
+	 * Returns string.
+	 *
+	 * @returns string.
+	 */
+	public toString(): string {
+		return '[object NamedNodeMap]';
+	}
+
+	/**
+	 * Iterator.
+	 *
+	 * @returns Iterator.
+	 */
+	public [Symbol.iterator](): IterableIterator<Attr> {
+		return this[PropertySymbol.namespaceItems].values();
+	}
+
+	/**
+	 * Returns item by index.
+	 *
+	 * @param index Index.
+	 */
+	public item(index: number): Attr | null {
+		const items = Array.from(this[PropertySymbol.namespaceItems].values());
+		return index >= 0 && items[index] ? items[index] : null;
+	}
+
+	/**
+	 * Returns named item.
+	 *
+	 * @param name Name.
+	 * @returns Item.
+	 */
+	public getNamedItem(name: string): Attr | null {
+		return (
+			this[PropertySymbol.namedItems].get(
+				this[PropertySymbol.getNamedItemKey](
+					this[PropertySymbol.ownerElement][PropertySymbol.namespaceURI],
+					name
+				)
+			) || null
+		);
+	}
+
+	/**
+	 * Returns item by name and namespace.
+	 *
+	 * @param namespace Namespace.
+	 * @param localName Local name of the attribute.
+	 * @returns Item.
+	 */
+	public getNamedItemNS(namespace: string, localName: string): Attr | null {
+		for (const item of this[PropertySymbol.namespaceItems].values()) {
+			if (
+				item[PropertySymbol.namespaceURI] === namespace &&
+				item[PropertySymbol.localName] === localName
+			) {
+				return item;
+			}
+		}
+		return null;
+	}
+
+	/**
+	 * Sets named item.
+	 *
+	 * @param item Item.
+	 * @returns Replaced item.
+	 */
+	public setNamedItem(item: Attr): Attr | null {
+		return this[PropertySymbol.setNamedItem](item);
+	}
+
+	/**
+	 * Adds a new namespaced item.
+	 *
+	 * @alias setNamedItem()
+	 * @param item Item.
+	 * @returns Replaced item.
+	 */
+	public setNamedItemNS(item: Attr): Attr | null {
+		return this[PropertySymbol.setNamedItem](item);
+	}
+
+	/**
+	 * Removes an item.
+	 *
+	 * @throws DOMException
+	 * @param name Name of item.
+	 * @returns Removed item.
+	 */
+	public removeNamedItem(name: string): Attr {
+		const item = this.getNamedItem(name);
+
+		if (!item) {
+			throw new DOMException(
+				`Failed to execute 'removeNamedItem' on 'NamedNodeMap': No item with name '${name}' was found.`,
+				DOMExceptionNameEnum.notFoundError
+			);
+		}
+
+		this[PropertySymbol.removeNamedItem](item);
+
+		return item;
+	}
+
+	/**
+	 * Removes a namespaced item.
+	 *
+	 * @param namespace Namespace.
+	 * @param localName Local name of the item.
+	 * @returns Removed item.
+	 */
+	public removeNamedItemNS(namespace: string, localName: string): Attr | null {
+		const item = this.getNamedItemNS(namespace, localName);
+
+		if (!item) {
+			throw new DOMException(
+				`Failed to execute 'removeNamedItemNS' on 'NamedNodeMap': No item with name '${localName}' in namespace '${namespace}' was found.`,
+				DOMExceptionNameEnum.notFoundError
+			);
+		}
+
+		this[PropertySymbol.removeNamedItem](item);
+
+		return item;
+	}
+
+	/**
+	 * Sets named item.
+	 *
+	 * @param item Item.
+	 * @param [ignoreListeners] Ignore listeners.
+	 * @returns Replaced item.
+	 */
+	public [PropertySymbol.setNamedItem](item: Attr, ignoreListeners = false): Attr {
+		if (!item[PropertySymbol.name]) {
+			return null;
+		}
+
+		item[PropertySymbol.ownerElement] = this[PropertySymbol.ownerElement];
+
+		const namespaceItemKey = this[PropertySymbol.getNamespaceItemKey](item);
+		const replacedItem = this[PropertySymbol.namespaceItems].get(namespaceItemKey) || null;
+		const replacedNamedItem =
+			this[PropertySymbol.namedItems].get(item[PropertySymbol.name]) || null;
+
+		this[PropertySymbol.namespaceItems].set(namespaceItemKey, item);
+
+		// The HTML namespace should be prioritized over other namespaces in the namedItems map
+		// The HTML namespace is the default namespace
+		if (
+			(!replacedNamedItem ||
+				(replacedNamedItem[PropertySymbol.namespaceURI] &&
+					replacedNamedItem[PropertySymbol.namespaceURI] !== NamespaceURI.html) ||
+				!item[PropertySymbol.namespaceURI] ||
+				item[PropertySymbol.namespaceURI] === NamespaceURI.html) &&
+			// Only lower case names should be stored in the namedItems map
+			(this[PropertySymbol.ownerElement][PropertySymbol.namespaceURI] !== NamespaceURI.html ||
+				item[PropertySymbol.name].toLowerCase() === item[PropertySymbol.name])
+		) {
+			this[PropertySymbol.namedItems].set(item[PropertySymbol.name], item);
+		}
+
+		if (!ignoreListeners) {
+			this[PropertySymbol.ownerElement][PropertySymbol.onSetAttribute](item, replacedItem);
+		}
+
+		return replacedItem;
+	}
+
+	/**
+	 * Removes named item.
+	 *
+	 * @param item Item.
+	 * @param ignoreListeners
+	 */
+	public [PropertySymbol.removeNamedItem](item: Attr, ignoreListeners = false): void {
+		item[PropertySymbol.ownerElement] = null;
+		this[PropertySymbol.namespaceItems].delete(this[PropertySymbol.getNamespaceItemKey](item));
+		this[PropertySymbol.namedItems].delete(
+			this[PropertySymbol.getNamedItemKey](
+				this[PropertySymbol.ownerElement][PropertySymbol.namespaceURI],
+				item[PropertySymbol.name]
+			)
+		);
+
+		if (!ignoreListeners) {
+			this[PropertySymbol.ownerElement][PropertySymbol.onRemoveAttribute](item);
+		}
+	}
+
+	/**
+	 * Returns item name based on namespace.
+	 *
+	 * @param namespaceURI Namespace.
+	 * @param name Name.
+	 * @returns Item name based on namespace.
+	 */
+	private [PropertySymbol.getNamedItemKey](namespaceURI: string, name: string): string {
+		if (!namespaceURI || namespaceURI === NamespaceURI.html) {
+			return name.toLowerCase();
+		}
+		return name;
+	}
+
+	/**
+	 * Returns item key.
+	 *
+	 * @param item Item.
+	 * @returns Key.
+	 */
+	private [PropertySymbol.getNamespaceItemKey](item: Attr): string {
+		if (
+			!item[PropertySymbol.namespaceURI] ||
+			item[PropertySymbol.namespaceURI] === NamespaceURI.html
+		) {
+			return item[PropertySymbol.name].toLowerCase();
+		}
+		return `${item[PropertySymbol.namespaceURI] || ''}:${item[PropertySymbol.name]}`;
+	}
+}

package/src/nodes/element/NamedNodeMapProxyFactory.ts

@@ -0,0 +1,124 @@
+/* eslint-disable filenames/match-exported */
+
+import ClassMethodBinder from '../../ClassMethodBinder.js';
+import * as PropertySymbol from '../../PropertySymbol.js';
+import NamedNodeMap from './NamedNodeMap.js';
+
+/**
+ * Named Node Map.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/NamedNodeMap
+ */
+export default class NamedNodeMapProxyFactory {
+	/**
+	 * Constructor.
+	 *
+	 * @param namedNodeMap
+	 */
+	public static createProxy(namedNodeMap: NamedNodeMap): NamedNodeMap {
+		const namedItems = namedNodeMap[PropertySymbol.namedItems];
+		const namespaceItems = namedNodeMap[PropertySymbol.namespaceItems];
+
+		ClassMethodBinder.bindMethods(namedNodeMap, [NamedNodeMap], {
+			bindSymbols: true,
+			forwardToPrototype: true
+		});
+
+		return new Proxy<NamedNodeMap>(namedNodeMap, {
+			get: (target, property) => {
+				if (property === 'length') {
+					return namespaceItems.size;
+				}
+				if (property in target || typeof property === 'symbol') {
+					return target[property];
+				}
+				const index = Number(property);
+				if (!isNaN(index)) {
+					return Array.from(namespaceItems.values())[index];
+				}
+				return target.getNamedItem(<string>property) || undefined;
+			},
+			set(target, property, newValue): boolean {
+				if (typeof property === 'symbol') {
+					target[property] = newValue;
+					return true;
+				}
+				const index = Number(property);
+				if (isNaN(index)) {
+					target[property] = newValue;
+				}
+				return true;
+			},
+			deleteProperty(target, property): boolean {
+				if (typeof property === 'symbol') {
+					delete target[property];
+					return true;
+				}
+				const index = Number(property);
+				if (isNaN(index)) {
+					delete target[property];
+				}
+				return true;
+			},
+			ownKeys(): string[] {
+				const keys = Array.from(namedItems.keys());
+				for (let i = 0, max = namespaceItems.size; i < max; i++) {
+					keys.push(String(i));
+				}
+				return keys;
+			},
+			has(target, property): boolean {
+				if (typeof property === 'symbol') {
+					return false;
+				}
+
+				if (property in target || namedItems.has(property)) {
+					return true;
+				}
+
+				const index = Number(property);
+
+				if (!isNaN(index) && index >= 0 && index < namespaceItems.size) {
+					return true;
+				}
+
+				return false;
+			},
+			defineProperty(target, property, descriptor): boolean {
+				if (property in target) {
+					Object.defineProperty(target, property, descriptor);
+					return true;
+				}
+
+				return false;
+			},
+			getOwnPropertyDescriptor(target, property): PropertyDescriptor {
+				if (property in target || typeof property === 'symbol') {
+					return;
+				}
+
+				const index = Number(property);
+
+				if (!isNaN(index) && index >= 0 && index < namespaceItems.size) {
+					return {
+						value: Array.from(namespaceItems.values())[index],
+						writable: false,
+						enumerable: true,
+						configurable: true
+					};
+				}
+
+				const namedItem = target.getNamedItem(<string>property);
+
+				if (namedItem) {
+					return {
+						value: namedItem,
+						writable: false,
+						enumerable: true,
+						configurable: true
+					};
+				}
+			}
+		});
+	}
+}