happy-dom 6.0.4 → 7.0.0

package/src/css/declaration/utilities/CSSStyleDeclarationValueParser.ts

@@ -0,0 +1,437 @@
+const COLOR_REGEXP =
+	/^#([0-9a-fA-F]{3,4}){1,2}$|^rgb\(([^)]*)\)$|^rgba\(([^)]*)\)$|^hsla?\(\s*(-?\d+|-?\d*.\d+)\s*,\s*(-?\d+|-?\d*.\d+)%\s*,\s*(-?\d+|-?\d*.\d+)%\s*(,\s*(-?\d+|-?\d*.\d+)\s*)?\)/;
+
+const LENGTH_REGEXP = /^(0|[-+]?[0-9]*\.?[0-9]+(in|cm|em|mm|pt|pc|px|ex|rem|vh|vw|ch))$/;
+const PERCENTAGE_REGEXP = /^[-+]?[0-9]*\.?[0-9]+%$/;
+const DEGREE_REGEXP = /^[0-9]+deg$/;
+const URL_REGEXP = /^url\(\s*([^)]*)\s*\)$/;
+const INTEGER_REGEXP = /^[0-9]+$/;
+const FLOAT_REGEXP = /^[0-9.]+$/;
+const CALC_REGEXP = /^calc\([^^)]+\)$/;
+const CSS_VARIABLE_REGEXP = /^var\( *(--[^) ]+)\)$/;
+const FIT_CONTENT_REGEXP = /^fit-content\([^^)]+\)$/;
+const GRADIENT_REGEXP =
+	/^(repeating-linear|linear|radial|repeating-radial|conic|repeating-conic)-gradient\([^)]+\)$/;
+const GLOBALS = ['inherit', 'initial', 'unset', 'revert'];
+const COLORS = [
+	'currentcolor',
+	'transparent',
+	'silver',
+	'gray',
+	'white',
+	'maroon',
+	'red',
+	'purple',
+	'fuchsia',
+	'green',
+	'lime',
+	'olive',
+	'yellow',
+	'navy',
+	'blue',
+	'teal',
+	'aqua',
+	'antiquewhite',
+	'aquamarine',
+	'azure',
+	'beige',
+	'bisque',
+	'blanchedalmond',
+	'blueviolet',
+	'brown',
+	'burlywood',
+	'cadetblue',
+	'chartreuse',
+	'chocolate',
+	'coral',
+	'cornflowerblue',
+	'cornsilk',
+	'crimson',
+	'darkblue',
+	'darkcyan',
+	'darkgoldenrod',
+	'darkgray',
+	'darkgreen',
+	'darkgrey',
+	'darkkhaki',
+	'darkmagenta',
+	'darkolivegreen',
+	'darkorange',
+	'darkorchid',
+	'darkred',
+	'darksalmon',
+	'darkseagreen',
+	'darkslateblue',
+	'darkslategray',
+	'darkslategrey',
+	'darkturquoise',
+	'darkviolet',
+	'deeppink',
+	'deepskyblue',
+	'dimgray',
+	'dimgrey',
+	'dodgerblue',
+	'firebrick',
+	'floralwhite',
+	'forestgreen',
+	'gainsboro',
+	'ghostwhite',
+	'gold',
+	'goldenrod',
+	'greenyellow',
+	'grey',
+	'honeydew',
+	'hotpink',
+	'indianred',
+	'indigo',
+	'ivory',
+	'khaki',
+	'lavender',
+	'lavenderblush',
+	'lawngreen',
+	'lemonchiffon',
+	'lightblue',
+	'lightcoral',
+	'lightcyan',
+	'lightgoldenrodyellow',
+	'lightgray',
+	'lightgreen',
+	'lightgrey',
+	'lightpink',
+	'lightsalmon',
+	'lightseagreen',
+	'lightskyblue',
+	'lightslategray',
+	'lightslategrey',
+	'lightsteelblue',
+	'lightyellow',
+	'limegreen',
+	'linen',
+	'mediumaquamarine',
+	'mediumblue',
+	'mediumorchid',
+	'mediumpurple',
+	'mediumseagreen',
+	'mediumslateblue',
+	'mediumspringgreen',
+	'mediumturquoise',
+	'mediumvioletred',
+	'midnightblue',
+	'mintcream',
+	'mistyrose',
+	'moccasin',
+	'navajowhite',
+	'oldlace',
+	'olivedrab',
+	'orangered',
+	'orchid',
+	'palegoldenrod',
+	'palegreen',
+	'paleturquoise',
+	'palevioletred',
+	'papayawhip',
+	'peachpuff',
+	'peru',
+	'pink',
+	'plum',
+	'powderblue',
+	'rosybrown',
+	'royalblue',
+	'saddlebrown',
+	'salmon',
+	'sandybrown',
+	'seagreen',
+	'seashell',
+	'sienna',
+	'skyblue',
+	'slateblue',
+	'slategray',
+	'slategrey',
+	'snow',
+	'springgreen',
+	'steelblue',
+	'tan',
+	'thistle',
+	'tomato',
+	'turquoise',
+	'violet',
+	'wheat',
+	'whitesmoke',
+	'yellowgreen'
+];
+
+/**
+ * Style declaration value parser.
+ */
+export default class CSSStyleDeclarationValueParser {
+	/**
+	 * Returns length.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getLength(value: string): string {
+		if (value === '0') {
+			return '0px';
+		}
+		if (LENGTH_REGEXP.test(value)) {
+			return value;
+		}
+		return null;
+	}
+
+	/**
+	 * Returns percentance.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getPercentage(value: string): string {
+		if (value === '0') {
+			return '0%';
+		}
+		if (PERCENTAGE_REGEXP.test(value)) {
+			return value;
+		}
+		return null;
+	}
+
+	/**
+	 * Returns degree.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getDegree(value: string): string {
+		if (value === '0') {
+			return '0deg';
+		}
+		if (DEGREE_REGEXP.test(value)) {
+			return value;
+		}
+		return null;
+	}
+
+	/**
+	 * Returns calc.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getCalc(value: string): string {
+		if (CALC_REGEXP.test(value)) {
+			return value;
+		}
+		return null;
+	}
+
+	/**
+	 * Returns fit content.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getFitContent(value: string): string {
+		const lowerValue = value.toLowerCase();
+		if (
+			lowerValue === 'auto' ||
+			lowerValue === 'max-content' ||
+			lowerValue === 'min-content' ||
+			lowerValue === 'fit-content'
+		) {
+			return lowerValue;
+		}
+		if (FIT_CONTENT_REGEXP.test(lowerValue)) {
+			return lowerValue;
+		}
+		return null;
+	}
+
+	/**
+	 * Returns measurement.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getMeasurement(value: string): string {
+		return this.getLength(value) || this.getPercentage(value);
+	}
+
+	/**
+	 * Returns measurement or auto, min-content, max-content or fit-content.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getContentMeasurement(value: string): string {
+		return this.getFitContent(value) || this.getMeasurement(value);
+	}
+
+	/**
+	 * Returns measurement or auto, min-content, max-content or fit-content.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getAutoMeasurement(value: string): string {
+		if (value.toLocaleLowerCase() === 'auto') {
+			return 'auto';
+		}
+		return this.getMeasurement(value);
+	}
+
+	/**
+	 * Returns integer.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getInteger(value: string): string {
+		if (INTEGER_REGEXP.test(value)) {
+			return value;
+		}
+		return null;
+	}
+
+	/**
+	 * Returns float.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getFloat(value: string): string {
+		if (FLOAT_REGEXP.test(value)) {
+			return value;
+		}
+		return null;
+	}
+
+	/**
+	 * Returns gradient.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getGradient(value: string): string {
+		if (GRADIENT_REGEXP.test(value)) {
+			return value;
+		}
+		return null;
+	}
+
+	/**
+	 * Returns color.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getColor(value: string): string {
+		const lowerValue = value.toLowerCase();
+		if (COLORS.includes(lowerValue)) {
+			return lowerValue;
+		}
+		if (COLOR_REGEXP.test(value)) {
+			return value.replace(/,([^ ])/g, ', $1');
+		}
+		return null;
+	}
+
+	/**
+	 * Returns URL.
+	 *
+	 * Based on:
+	 * https://github.com/jsdom/cssstyle/blob/master/lib/parsers.js#L222
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getURL(value: string): string {
+		if (!value) {
+			return null;
+		}
+
+		if (value.toLowerCase() === 'none') {
+			return 'none';
+		}
+
+		const result = URL_REGEXP.exec(value);
+
+		if (!result) {
+			return null;
+		}
+
+		let url = result[1];
+
+		if ((url[0] === '"' || url[0] === "'") && url[0] !== url[url.length - 1]) {
+			return null;
+		}
+
+		if (url[0] === '"' || url[0] === "'") {
+			url = url.substring(1, url.length - 1);
+		}
+
+		for (let i = 0; i < url.length; i++) {
+			switch (url[i]) {
+				case '(':
+				case ')':
+				case ' ':
+				case '\t':
+				case '\n':
+				case "'":
+				case '"':
+					return null;
+				case '\\':
+					i++;
+					break;
+			}
+		}
+
+		return `url("${url}")`;
+	}
+
+	/**
+	 * Returns global initial value.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getInitial(value: string): string {
+		return value.toLowerCase() === 'initial' ? 'initial' : null;
+	}
+
+	/**
+	 * Returns CSS variable.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getVariable(value: string): string {
+		const cssVariableMatch = value.match(CSS_VARIABLE_REGEXP);
+		if (cssVariableMatch) {
+			return `var(${cssVariableMatch[1]})`;
+		}
+		return null;
+	}
+
+	/**
+	 * Returns global.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getGlobal(value: string): string {
+		const lowerValue = value.toLowerCase();
+		return GLOBALS.includes(lowerValue) ? lowerValue : null;
+	}
+
+	/**
+	 * Returns global, unless it is not set to 'initial' as it is sometimes treated different.
+	 *
+	 * @param value Value.
+	 * @returns Parsed value.
+	 */
+	public static getGlobalExceptInitial(value: string): string {
+		const lowerValue = value.toLowerCase();
+		return lowerValue !== 'initial' && GLOBALS.includes(lowerValue) ? lowerValue : null;
+	}
+}

package/src/css/declaration/utilities/ICSSStyleDeclarationPropertyValue.ts

@@ -0,0 +1,4 @@
+export default interface ICSSStyleDeclarationPropertyValue {
+	readonly value: string;
+	readonly important: boolean;
+}

package/src/css/rules/CSSContainerRule.ts

@@ -0,0 +1,23 @@
+import CSSRule from '../CSSRule';
+
+/**
+ * CSSRule interface.
+ */
+export default class CSSContainerRule extends CSSRule {
+	public readonly type = CSSRule.CONTAINER_RULE;
+	public readonly cssRules: CSSRule[] = [];
+	public readonly conditionalText = '';
+
+	/**
+	 * Returns css text.
+	 *
+	 * @returns CSS text.
+	 */
+	public get cssText(): string {
+		let cssText = '';
+		for (const cssRule of this.cssRules) {
+			cssText += cssRule.cssText;
+		}
+		return `@container ${this.conditionalText} { ${cssText} }`;
+	}
+}

package/src/css/rules/CSSFontFaceRule.ts

@@ -1,10 +1,25 @@
 import CSSRule from '../CSSRule';
-import CSSStyleDeclaration from '../CSSStyleDeclaration';
+import CSSStyleDeclaration from '../declaration/CSSStyleDeclaration';
 
 /**
  * CSSRule interface.
  */
 export default class CSSFontFaceRule extends CSSRule {
 	public readonly type = CSSRule.FONT_FACE_RULE;
-	public readonly style: CSSStyleDeclaration;
+	public _cssText = '';
+	private _style: CSSStyleDeclaration = null;
+
+	/**
+	 * Returns style.
+	 *
+	 * @returns Style.
+	 */
+	public get style(): CSSStyleDeclaration {
+		if (!this._style) {
+			this._style = new CSSStyleDeclaration();
+			(<CSSRule>this._style.parentRule) = this;
+			this._style.cssText = this._cssText;
+		}
+		return this._style;
+	}
 }

package/src/css/rules/CSSKeyframeRule.ts

@@ -1,13 +1,28 @@
 import CSSRule from '../CSSRule';
-import CSSStyleDeclaration from '../CSSStyleDeclaration';
+import CSSStyleDeclaration from '../declaration/CSSStyleDeclaration';
 
 /**
  * CSSRule interface.
  */
 export default class CSSKeyframeRule extends CSSRule {
 	public readonly type = CSSRule.KEYFRAME_RULE;
-	public readonly style: CSSStyleDeclaration;
 	public readonly keyText: string;
+	public _cssText = '';
+	private _style: CSSStyleDeclaration = null;
+
+	/**
+	 * Returns style.
+	 *
+	 * @returns Style.
+	 */
+	public get style(): CSSStyleDeclaration {
+		if (!this._style) {
+			this._style = new CSSStyleDeclaration();
+			(<CSSRule>this._style.parentRule) = this;
+			this._style.cssText = this._cssText;
+		}
+		return this._style;
+	}
 
 	/**
 	 * Returns css text.

package/src/css/rules/CSSKeyframesRule.ts

@@ -1,5 +1,5 @@
 import CSSRule from '../CSSRule';
-import CSSStyleDeclaration from '../CSSStyleDeclaration';
+import CSSStyleDeclaration from '../declaration/CSSStyleDeclaration';
 import CSSKeyframeRule from './CSSKeyframeRule';
 
 const CSS_RULE_REGEXP = /([^{]+){([^}]+)}/;

package/src/css/rules/CSSStyleRule.ts

@@ -1,14 +1,29 @@
 import CSSRule from '../CSSRule';
-import CSSStyleDeclaration from '../CSSStyleDeclaration';
+import CSSStyleDeclaration from '../declaration/CSSStyleDeclaration';
 
 /**
  * CSSRule interface.
  */
 export default class CSSStyleRule extends CSSRule {
 	public readonly type = CSSRule.STYLE_RULE;
-	public readonly style: CSSStyleDeclaration;
 	public readonly selectorText = '';
 	public readonly styleMap = new Map();
+	public _cssText = '';
+	private _style: CSSStyleDeclaration = null;
+
+	/**
+	 * Returns style.
+	 *
+	 * @returns Style.
+	 */
+	public get style(): CSSStyleDeclaration {
+		if (!this._style) {
+			this._style = new CSSStyleDeclaration();
+			(<CSSRule>this._style.parentRule) = this;
+			this._style.cssText = this._cssText;
+		}
+		return this._style;
+	}
 
 	/**
 	 * Returns css text.

package/src/event/Event.ts

@@ -1,5 +1,4 @@
 import IEventInit from './IEventInit';
-import EventTarget from './EventTarget';
 import INode from '../nodes/node/INode';
 import IWindow from '../window/IWindow';
 import IShadowRoot from '../nodes/shadow-root/IShadowRoot';
@@ -10,8 +9,8 @@ import IEventTarget from './IEventTarget';
  */
 export default class Event {
 	public composed = false;
-	public currentTarget: EventTarget = null;
-	public target: EventTarget = null;
+	public currentTarget: IEventTarget = null;
+	public target: IEventTarget = null;
 	public bubbles = false;
 	public cancelable = false;
 	public defaultPrevented = false;

package/src/event/events/IMediaQueryListInit.ts

@@ -0,0 +1,6 @@
+import IEventInit from '../IEventInit';
+
+export default interface IMediaQueryListInit extends IEventInit {
+	matches?: boolean;
+	media?: string;
+}

package/src/event/events/MediaQueryListEvent.ts

@@ -0,0 +1,25 @@
+import Event from '../Event';
+import IMediaQueryListInit from './IMediaQueryListInit';
+
+/**
+ *
+ */
+export default class MediaQueryListEvent extends Event {
+	public readonly matches: boolean = false;
+	public readonly media: string = '';
+
+	/**
+	 * Constructor.
+	 *
+	 * @param type Event type.
+	 * @param [eventInit] Event init.
+	 */
+	constructor(type: string, eventInit: IMediaQueryListInit = null) {
+		super(type, eventInit);
+
+		if (eventInit) {
+			this.matches = eventInit.matches || false;
+			this.media = eventInit.media || '';
+		}
+	}
+}

package/src/exception/DOMException.ts

@@ -1,3 +1,5 @@
+import DOMExceptionNameEnum from './DOMExceptionNameEnum';
+
 /**
  * DOM Exception.
  *
@@ -14,8 +16,6 @@ export default class DOMException extends Error {
 	constructor(message: string, name: string = null) {
 		super(message);
 
-		if (name) {
-			this.name = name;
-		}
+		this.name = name || DOMExceptionNameEnum.domException;
 	}
 }

package/src/exception/DOMExceptionNameEnum.ts

@@ -7,6 +7,7 @@ enum DOMExceptionNameEnum {
 	wrongDocumentError = 'WrongDocumentError',
 	invalidNodeTypeError = 'InvalidNodeTypeError',
 	invalidCharacterError = 'InvalidCharacterError',
-	notFoundError = 'NotFoundError'
+	notFoundError = 'NotFoundError',
+	domException = 'DOMException'
 }
 export default DOMExceptionNameEnum;

package/src/file/Blob.ts

@@ -110,6 +110,22 @@ export default class Blob implements IBlob {
 		return blob;
 	}
 
+	/**
+	 * Returns a Promise that resolves to a ArrayBuffer.
+	 *
+	 * @returns ArrayBuffer.
+	 */
+
+	// Reference:
+	// https://github.com/web-std/io/blob/c88170bf24f064adfbb3586a21fb76650ca5a9ab/packages/blob/src/blob.js#L139-L148
+	// https://stackoverflow.com/questions/8609289/convert-a-binary-nodejs-buffer-to-javascript-arraybuffer
+	/**
+	 *
+	 */
+	public async arrayBuffer(): Promise<ArrayBuffer> {
+		return new Uint8Array(this._buffer).buffer;
+	}
+
 	/**
 	 * Returns a Promise that resolves to a text.
 	 *

package/src/index.ts

@@ -13,7 +13,7 @@ import File from './file/File';
 import FileReader from './file/FileReader';
 import DOMException from './exception/DOMException';
 import History from './history/History';
-import CSSStyleDeclaration from './css/CSSStyleDeclaration';
+import CSSStyleDeclaration from './css/declaration/CSSStyleDeclaration';
 import Screen from './screen/Screen';
 import AsyncTaskManager from './async-task-manager/AsyncTaskManager';
 import NodeFilter from './tree-walker/NodeFilter';
@@ -100,6 +100,13 @@ import CustomElementRegistry from './custom-element/CustomElementRegistry';
 import XMLParser from './xml-parser/XMLParser';
 import XMLSerializer from './xml-serializer/XMLSerializer';
 import CSSStyleSheet from './css/CSSStyleSheet';
+import CSSRule from './css/CSSRule';
+import CSSContainerRule from './css/rules/CSSContainerRule';
+import CSSFontFaceRule from './css/rules/CSSFontFaceRule';
+import CSSKeyframeRule from './css/rules/CSSKeyframeRule';
+import CSSKeyframesRule from './css/rules/CSSKeyframesRule';
+import CSSMediaRule from './css/rules/CSSMediaRule';
+import CSSStyleRule from './css/rules/CSSStyleRule';
 import Storage from './storage/Storage';
 import DOMRect from './nodes/element/DOMRect';
 import { URLSearchParams } from 'url';
@@ -211,6 +218,13 @@ export {
 	XMLParser,
 	XMLSerializer,
 	CSSStyleSheet,
+	CSSRule,
+	CSSContainerRule,
+	CSSFontFaceRule,
+	CSSKeyframeRule,
+	CSSKeyframesRule,
+	CSSMediaRule,
+	CSSStyleRule,
 	Storage,
 	DOMRect,
 	URLSearchParams,