happy-dom 14.12.3 → 15.1.0

package/src/nodes/html-link-element/HTMLLinkElement.ts

@@ -3,12 +3,13 @@ import * as PropertySymbol from '../../PropertySymbol.js';
 import HTMLElement from '../html-element/HTMLElement.js';
 import Event from '../../event/Event.js';
 import ErrorEvent from '../../event/events/ErrorEvent.js';
-import Node from '../../nodes/node/Node.js';
-import DOMTokenList from '../../dom-token-list/DOMTokenList.js';
-import NamedNodeMap from '../../named-node-map/NamedNodeMap.js';
-import HTMLLinkElementNamedNodeMap from './HTMLLinkElementNamedNodeMap.js';
-import HTMLLinkElementStyleSheetLoader from './HTMLLinkElementStyleSheetLoader.js';
-import IBrowserFrame from '../../browser/types/IBrowserFrame.js';
+import DOMTokenList from '../element/DOMTokenList.js';
+import Attr from '../attr/Attr.js';
+import WindowErrorUtility from '../../window/WindowErrorUtility.js';
+import DOMExceptionNameEnum from '../../exception/DOMExceptionNameEnum.js';
+import ResourceFetch from '../../fetch/ResourceFetch.js';
+import DocumentReadyStateManager from '../document/DocumentReadyStateManager.js';
+import WindowBrowserContext from '../../window/WindowBrowserContext.js';
 
 /**
  * HTML Link Element.
@@ -22,27 +23,10 @@ export default class HTMLLinkElement extends HTMLElement {
 	public onload: (event: Event) => void = null;
 
 	// Internal properties
-	public override [PropertySymbol.attributes]: NamedNodeMap;
 	public [PropertySymbol.sheet]: CSSStyleSheet = null;
 	public [PropertySymbol.evaluateCSS] = true;
-	public [PropertySymbol.relList]: DOMTokenList = null;
-	#styleSheetLoader: HTMLLinkElementStyleSheetLoader;
-
-	/**
-	 * Constructor.
-	 *
-	 * @param browserFrame Browser frame.
-	 */
-	constructor(browserFrame: IBrowserFrame) {
-		super();
-
-		this.#styleSheetLoader = new HTMLLinkElementStyleSheetLoader({
-			element: this,
-			browserFrame
-		});
-
-		this[PropertySymbol.attributes] = new HTMLLinkElementNamedNodeMap(this, this.#styleSheetLoader);
-	}
+	public [PropertySymbol.relList]: DOMTokenList | null = null;
+	#loadedStyleSheetURL: string | null = null;
 
 	/**
 	 * Returns sheet.
@@ -219,18 +203,115 @@ export default class HTMLLinkElement extends HTMLElement {
 	/**
 	 * @override
 	 */
-	public override [PropertySymbol.connectToNode](parentNode: Node = null): void {
-		const isConnected = this[PropertySymbol.isConnected];
-		const isParentConnected = parentNode ? parentNode[PropertySymbol.isConnected] : false;
+	public override [PropertySymbol.connectedToDocument](): void {
+		super[PropertySymbol.connectedToDocument]();
+		if (this[PropertySymbol.evaluateCSS]) {
+			this.#loadStyleSheet(this.getAttribute('href'), this.getAttribute('rel'));
+		}
+	}
+
+	/**
+	 * @override
+	 */
+	public override [PropertySymbol.onSetAttribute](
+		attribute: Attr,
+		replacedAttribute: Attr | null
+	): void {
+		super[PropertySymbol.onSetAttribute](attribute, replacedAttribute);
+
+		if (attribute[PropertySymbol.name] === 'rel') {
+			this.#loadStyleSheet(this.getAttribute('href'), attribute[PropertySymbol.value]);
+		} else if (attribute[PropertySymbol.name] === 'href') {
+			this.#loadStyleSheet(attribute[PropertySymbol.value], this.getAttribute('rel'));
+		}
+	}
+
+	/**
+	 * Returns a URL relative to the given Location object.
+	 *
+	 * @param url URL.
+	 * @param rel Rel.
+	 */
+	async #loadStyleSheet(url: string | null, rel: string | null): Promise<void> {
+		const window = this[PropertySymbol.window];
+		const browserFrame = new WindowBrowserContext(window).getBrowserFrame();
+
+		if (!browserFrame) {
+			return;
+		}
+
+		const browserSettings = browserFrame.page?.context?.browser?.settings;
+
+		if (!url || !rel || rel.toLowerCase() !== 'stylesheet' || !this[PropertySymbol.isConnected]) {
+			return;
+		}
+
+		let absoluteURL: string;
+		try {
+			absoluteURL = new URL(url, window.location.href).href;
+		} catch (error) {
+			return;
+		}
+
+		if (this.#loadedStyleSheetURL === absoluteURL) {
+			return;
+		}
+
+		if (browserSettings && browserSettings.disableCSSFileLoading) {
+			if (browserSettings.handleDisabledFileLoadingAsSuccess) {
+				this.dispatchEvent(new Event('load'));
+			} else {
+				WindowErrorUtility.dispatchError(
+					this,
+					new window.DOMException(
+						`Failed to load external stylesheet "${absoluteURL}". CSS file loading is disabled.`,
+						DOMExceptionNameEnum.notSupportedError
+					)
+				);
+			}
+			return;
+		}
+
+		const resourceFetch = new ResourceFetch({
+			browserFrame,
+			window: window
+		});
+		const readyStateManager = (<{ [PropertySymbol.readyStateManager]: DocumentReadyStateManager }>(
+			(<unknown>window)
+		))[PropertySymbol.readyStateManager];
+
+		this.#loadedStyleSheetURL = absoluteURL;
+
+		readyStateManager.startTask();
+
+		let code: string | null = null;
+		let error: Error | null = null;
+
+		try {
+			code = await resourceFetch.fetch(absoluteURL);
+		} catch (e) {
+			error = e;
+		}
+
+		readyStateManager.endTask();
+
+		if (error) {
+			WindowErrorUtility.dispatchError(this, error);
+		} else {
+			const styleSheet = new CSSStyleSheet();
+			styleSheet.replaceSync(code);
+			this[PropertySymbol.sheet] = styleSheet;
 
-		super[PropertySymbol.connectToNode](parentNode);
+			// Computed style cache is affected by all mutations.
+			const document = this[PropertySymbol.ownerDocument];
+			if (document) {
+				for (const item of document[PropertySymbol.affectsComputedStyleCache]) {
+					item.result = null;
+				}
+				document[PropertySymbol.affectsComputedStyleCache] = [];
+			}
 
-		if (
-			isParentConnected &&
-			isConnected !== isParentConnected &&
-			this[PropertySymbol.evaluateCSS]
-		) {
-			this.#styleSheetLoader.loadStyleSheet(this.getAttribute('href'), this.getAttribute('rel'));
+			this.dispatchEvent(new Event('load'));
 		}
 	}
 }

package/src/nodes/html-map-element/HTMLMapElement.ts

@@ -0,0 +1,47 @@
+import HTMLCollection from '../element/HTMLCollection.js';
+import HTMLElement from '../html-element/HTMLElement.js';
+import * as PropertySymbol from '../../PropertySymbol.js';
+import HTMLAreaElement from '../html-area-element/HTMLAreaElement.js';
+import ParentNodeUtility from '../parent-node/ParentNodeUtility.js';
+
+/**
+ * HTMLMapElement
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLMapElement
+ */
+export default class HTMLMapElement extends HTMLElement {
+	public [PropertySymbol.areas]: HTMLCollection<HTMLAreaElement> | null = null;
+
+	/**
+	 * Returns areas.
+	 *
+	 * @returns Areas.
+	 */
+	public get areas(): HTMLCollection<HTMLAreaElement> {
+		if (!this[PropertySymbol.areas]) {
+			this[PropertySymbol.areas] = ParentNodeUtility.getElementsByTagName<HTMLAreaElement>(
+				this,
+				'area'
+			);
+		}
+		return this[PropertySymbol.areas];
+	}
+
+	/**
+	 * Returns name.
+	 *
+	 * @returns Name.
+	 */
+	public get name(): string {
+		return this.getAttribute('name') || '';
+	}
+
+	/**
+	 * Sets name.
+	 *
+	 * @param name Name.
+	 */
+	public set name(name: string) {
+		this.setAttribute('name', name);
+	}
+}