happy-dom 2.24.3 → 2.25.1

package/src/nodes/node/Node.ts

@@ -9,7 +9,6 @@ import IDocument from '../document/IDocument';
 import IElement from '../element/IElement';
 import INodeList from './INodeList';
 import NodeListFactory from './NodeListFactory';
-import { IShadowRoot } from '../..';
 
 /**
  * Node.
@@ -27,9 +26,8 @@ export default class Node extends EventTarget implements INode {
 	public readonly parentNode: INode = null;
 	public readonly nodeType: number;
 	public readonly childNodes: INodeList<INode> = NodeListFactory.create();
-
-	// Protected properties
-	protected _isConnected = false;
+	public readonly isConnected: boolean = false;
+	public _rootNode: INode = null;
 
 	// Custom Properties (not part of HTML standard)
 	protected _observers: MutationObserverListener[] = [];
@@ -42,42 +40,6 @@ export default class Node extends EventTarget implements INode {
 		this.ownerDocument = (<typeof Node>this.constructor).ownerDocument;
 	}
 
-	/**
-	 * Returns "true" if connected to DOM.
-	 *
-	 * @returns "true" if connected.
-	 */
-	public get isConnected(): boolean {
-		return this._isConnected;
-	}
-
-	/**
-	 * Sets the connected state.
-	 *
-	 * @param isConnected "true" if connected.
-	 */
-	public set isConnected(isConnected) {
-		if (this._isConnected !== isConnected) {
-			this._isConnected = isConnected;
-
-			if (isConnected && this.connectedCallback) {
-				this.connectedCallback();
-			} else if (!isConnected && this.disconnectedCallback) {
-				this.disconnectedCallback();
-			}
-
-			for (const child of this.childNodes) {
-				child.isConnected = isConnected;
-			}
-
-			// eslint-disable-next-line
-			if ((<any>this).shadowRoot) {
-				// eslint-disable-next-line
-				(<any>this).shadowRoot.isConnected = isConnected;
-			}
-		}
-	}
-
 	/**
 	 * Get text value of children.
 	 *
@@ -176,7 +138,7 @@ export default class Node extends EventTarget implements INode {
 	public get parentElement(): IElement {
 		let parent = this.parentNode;
 		while (parent && parent.nodeType !== Node.ELEMENT_NODE) {
-			parent = this.parentNode;
+			parent = parent.parentNode;
 		}
 		return <IElement>parent;
 	}
@@ -208,21 +170,15 @@ export default class Node extends EventTarget implements INode {
 	 * @returns Node.
 	 */
 	public getRootNode(options?: { composed: boolean }): INode {
-		// eslint-disable-next-line
-        let parent: INode = this;
+		if (!this.isConnected) {
+			return this;
+		}
 
-		while (!!parent) {
-			if (!parent.parentNode) {
-				if (!options?.composed || !(<IShadowRoot>parent).host) {
-					return parent;
-				}
-				parent = (<IShadowRoot>parent).host;
-			} else {
-				parent = parent.parentNode;
-			}
+		if (this._rootNode && !options?.composed) {
+			return this._rootNode;
 		}
 
-		return null;
+		return this.ownerDocument;
 	}
 
 	/**
@@ -234,8 +190,11 @@ export default class Node extends EventTarget implements INode {
 	public cloneNode(deep = false): INode {
 		const clone = new (<typeof Node>this.constructor)();
 
-		for (const node of clone.childNodes.slice()) {
-			node.parentNode.removeChild(node);
+		// Document has childNodes directly when it is created
+		if (clone.childNodes.length) {
+			for (const node of clone.childNodes.slice()) {
+				node.parentNode.removeChild(node);
+			}
 		}
 
 		if (deep) {
@@ -281,8 +240,7 @@ export default class Node extends EventTarget implements INode {
 
 		this.childNodes.push(node);
 
-		(<Node>node.parentNode) = this;
-		node.isConnected = this.isConnected;
+		(<Node>node)._connectToNode(this);
 
 		// MutationObserver
 		if (this._observers.length > 0) {
@@ -318,8 +276,7 @@ export default class Node extends EventTarget implements INode {
 
 		this.childNodes.splice(index, 1);
 
-		(<Node>node.parentNode) = null;
-		node.isConnected = false;
+		(<Node>node)._connectToNode(null);
 
 		// MutationObserver
 		if (this._observers.length > 0) {
@@ -384,8 +341,7 @@ export default class Node extends EventTarget implements INode {
 
 		this.childNodes.splice(index, 0, newNode);
 
-		(<Node>newNode.parentNode) = this;
-		newNode.isConnected = this.isConnected;
+		(<Node>newNode)._connectToNode(this);
 
 		// MutationObserver
 		if (this._observers.length > 0) {
@@ -432,8 +388,16 @@ export default class Node extends EventTarget implements INode {
 
 		const returnValue = super.dispatchEvent(event);
 
-		if (event.bubbles && this.parentNode !== null && !event._propagationStopped) {
-			return this.parentNode.dispatchEvent(event);
+		if (event.bubbles && !event._propagationStopped) {
+			if (this.parentNode) {
+				return this.parentNode.dispatchEvent(event);
+			}
+
+			// eslint-disable-next-line
+			if(event.composed && (<any>this).host) {
+				// eslint-disable-next-line
+				return (<any>this).host.dispatchEvent(event);
+			}
 		}
 
 		return returnValue;
@@ -480,4 +444,38 @@ export default class Node extends EventTarget implements INode {
 			}
 		}
 	}
+
+	/**
+	 * Connects this element to another element.
+	 *
+	 * @param parentNode Parent node.
+	 */
+	public _connectToNode(parentNode: INode = null): void {
+		const isConnected = !!parentNode && parentNode.isConnected;
+
+		if (this.nodeType !== Node.DOCUMENT_FRAGMENT_NODE) {
+			(<INode>this.parentNode) = parentNode;
+			(<Node>this)._rootNode = isConnected && parentNode ? (<Node>parentNode)._rootNode : null;
+		}
+
+		if (this.isConnected !== isConnected) {
+			(<boolean>this.isConnected) = isConnected;
+
+			if (isConnected && this.connectedCallback) {
+				this.connectedCallback();
+			} else if (!isConnected && this.disconnectedCallback) {
+				this.disconnectedCallback();
+			}
+
+			for (const child of this.childNodes) {
+				(<Node>child)._connectToNode(this);
+			}
+
+			// eslint-disable-next-line
+			if ((<any>this).shadowRoot) {
+				// eslint-disable-next-line
+				(<any>this).shadowRoot._connectToNode(this);
+			}
+		}
+	}
 }

package/src/nodes/shadow-root/ShadowRoot.ts

@@ -4,6 +4,7 @@ import XMLSerializer from '../../xml-serializer/XMLSerializer';
 import IElement from '../element/IElement';
 import CSSStyleSheet from '../../css/CSSStyleSheet';
 import IShadowRoot from './IShadowRoot';
+import IHTMLElement from '../../nodes/html-element/IHTMLElement';
 
 /**
  * ShadowRoot.
@@ -42,6 +43,19 @@ export default class ShadowRoot extends DocumentFragment implements IShadowRoot
 		}
 	}
 
+	/**
+	 * Returns active element.
+	 *
+	 * @returns Active element.
+	 */
+	public get activeElement(): IHTMLElement {
+		const activeElement: IHTMLElement = this.ownerDocument['_activeElement'];
+		if (activeElement && activeElement.getRootNode() === this) {
+			return activeElement;
+		}
+		return null;
+	}
+
 	/**
 	 * Converts to string.
 	 *

package/src/query-selector/SelectorItem.ts

@@ -3,7 +3,7 @@ import Element from '../nodes/element/Element';
 
 const ATTRIBUTE_REGEXP = /\[([a-zA-Z0-9-_]+)\]|\[([a-zA-Z0-9-_]+)([~|^$*]{0,1})[ ]*=[ ]*["']{0,1}([^"']+)["']{0,1}\]/g;
 const ATTRIBUTE_NAME_REGEXP = /[^a-zA-Z0-9-_$]/;
-const PSUEDO_REGEXP = /:([a-zA-Z-]+)\(([0-9n+-]+|odd|even)\)|:([a-zA-Z-]+)/g;
+const PSUEDO_REGEXP = /:([a-zA-Z-]+)\(([0-9n+-]+|odd|even)\)|:not\(([^)]+)\)|:([a-zA-Z-]+)/g;
 const CLASS_REGEXP = /\.([a-zA-Z0-9-_$]+)/g;
 const TAG_NAME_REGEXP = /^[a-zA-Z0-9-]+/;
 
@@ -29,7 +29,8 @@ export default class SelectorItem {
 	constructor(selector: string) {
 		this.isAll = selector === '*';
 		this.isID = !this.isAll ? selector.startsWith('#') : false;
-		this.isAttribute = !this.isAll && !this.isID && selector.includes('[');
+		this.isAttribute =
+			!this.isAll && !this.isID && selector.includes('[') && !selector.includes(':not(');
 		this.isPseudo = !this.isAll && !this.isID && selector.includes(':');
 		this.isClass = !this.isAll && !this.isID && new RegExp(CLASS_REGEXP, 'g').test(selector);
 		this.tagName = !this.isAll && !this.isID ? selector.match(TAG_NAME_REGEXP) : null;
@@ -84,24 +85,17 @@ export default class SelectorItem {
 			while ((match = regexp.exec(selector))) {
 				if (match[1] && !this.matchesNthChild(element, match[1], match[2])) {
 					return false;
-				} else if (match[3] && !this.matchesPsuedo(element, match[3])) {
+				} else if (match[3] && this.matchesAttribute(element, match[3])) {
+					return false;
+				} else if (match[4] && !this.matchesPsuedo(element, match[4])) {
 					return false;
 				}
 			}
 		}
 
 		// Attribute match
-		if (this.isAttribute) {
-			const regexp = new RegExp(ATTRIBUTE_REGEXP, 'g');
-
-			while ((match = regexp.exec(selector))) {
-				if (
-					(match[1] && !this.matchesAttributeName(element, match[1])) ||
-					(match[2] && !this.matchesAttributeNameAndValue(element, match[2], match[4], match[3]))
-				) {
-					return false;
-				}
-			}
+		if (this.isAttribute && !this.matchesAttribute(element, selector)) {
+			return false;
 		}
 
 		return true;
@@ -217,6 +211,31 @@ export default class SelectorItem {
 		return false;
 	}
 
+	/**
+	 * Matches attribute.
+	 *
+	 * @param element Element.
+	 * @param selector Selector.
+	 * @returns True if it is a match.
+	 */
+	private matchesAttribute(element: Element, selector: string): boolean {
+		const regexp = new RegExp(ATTRIBUTE_REGEXP, 'g');
+		let match;
+
+		while ((match = regexp.exec(selector))) {
+			const isPsuedo = match.index > 0 && selector[match.index] === '(';
+			if (
+				!isPsuedo &&
+				((match[1] && !this.matchesAttributeName(element, match[1])) ||
+					(match[2] && !this.matchesAttributeNameAndValue(element, match[2], match[4], match[3])))
+			) {
+				return false;
+			}
+		}
+
+		return true;
+	}
+
 	/**
 	 * Matches attribute name only.
 	 *
@@ -224,7 +243,7 @@ export default class SelectorItem {
 	 * @param attributeName Attribute name.
 	 * @returns True if it is a match.
 	 */
-	private matchesAttributeName(element, attributeName): boolean {
+	private matchesAttributeName(element: Element, attributeName: string): boolean {
 		if (ATTRIBUTE_NAME_REGEXP.test(attributeName)) {
 			throw new DOMException(`The selector "${this.selector}" is not valid.`);
 		}
@@ -243,10 +262,10 @@ export default class SelectorItem {
 	 * @returns True if it is a match.
 	 */
 	private matchesAttributeNameAndValue(
-		element,
-		attributeName,
-		attributeValue,
-		matchType = null
+		element: Element,
+		attributeName: string,
+		attributeValue: string,
+		matchType: string = null
 	): boolean {
 		const attribute = element._attributes[attributeName.toLowerCase()];
 		const value = attributeValue;

package/src/window/Window.ts

@@ -42,6 +42,7 @@ import FileReader from '../file/FileReader';
 import History from '../history/History';
 import CSSStyleDeclaration from '../css/CSSStyleDeclaration';
 import MouseEvent from '../event/events/MouseEvent';
+import PointerEvent from '../event/events/PointerEvent';
 import FocusEvent from '../event/events/FocusEvent';
 import WheelEvent from '../event/events/WheelEvent';
 import DataTransfer from '../event/DataTransfer';
@@ -111,6 +112,7 @@ export default class Window extends EventTarget implements IWindow, NodeJS.Globa
 	public readonly AnimationEvent = AnimationEvent;
 	public readonly KeyboardEvent = KeyboardEvent;
 	public readonly MouseEvent = MouseEvent;
+	public readonly PointerEvent = PointerEvent;
 	public readonly FocusEvent = FocusEvent;
 	public readonly WheelEvent = WheelEvent;
 	public readonly InputEvent = InputEvent;