happy-dom 6.0.4 → 7.0.0

package/src/css/CSSRule.ts

@@ -1,22 +1,24 @@
 import CSSStyleSheet from './CSSStyleSheet';
+import CSSRuleTypeEnum from './CSSRuleTypeEnum';
 
 /**
  * CSSRule interface.
  */
 export default class CSSRule {
-	public static STYLE_RULE = 1;
-	public static IMPORT_RULE = 3;
-	public static MEDIA_RULE = 4;
-	public static FONT_FACE_RULE = 5;
-	public static PAGE_RULE = 6;
-	public static KEYFRAMES_RULE = 7;
-	public static KEYFRAME_RULE = 8;
-	public static NAMESPACE_RULE = 10;
-	public static COUNTER_STYLE_RULE = 11;
-	public static SUPPORTS_RULE = 12;
-	public static DOCUMENT_RULE = 13;
-	public static FONT_FEATURE_VALUES_RULE = 14;
-	public static REGION_STYLE_RULE = 16;
+	public static CONTAINER_RULE = CSSRuleTypeEnum.containerRule;
+	public static STYLE_RULE = CSSRuleTypeEnum.styleRule;
+	public static IMPORT_RULE = CSSRuleTypeEnum.importRule;
+	public static MEDIA_RULE = CSSRuleTypeEnum.mediaRule;
+	public static FONT_FACE_RULE = CSSRuleTypeEnum.fontFaceRule;
+	public static PAGE_RULE = CSSRuleTypeEnum.pageRule;
+	public static KEYFRAMES_RULE = CSSRuleTypeEnum.keyframesRule;
+	public static KEYFRAME_RULE = CSSRuleTypeEnum.keyframeRule;
+	public static NAMESPACE_RULE = CSSRuleTypeEnum.namespaceRule;
+	public static COUNTER_STYLE_RULE = CSSRuleTypeEnum.counterStyleRule;
+	public static SUPPORTS_RULE = CSSRuleTypeEnum.supportsRule;
+	public static DOCUMENT_RULE = CSSRuleTypeEnum.documentRule;
+	public static FONT_FEATURE_VALUES_RULE = CSSRuleTypeEnum.fontFeatureValuesRule;
+	public static REGION_STYLE_RULE = CSSRuleTypeEnum.regionStyleRule;
 
 	public parentRule: CSSRule = null;
 	public parentStyleSheet: CSSStyleSheet = null;

package/src/css/CSSRuleTypeEnum.ts

@@ -0,0 +1,18 @@
+enum CSSRuleTypeEnum {
+	containerRule = 0,
+	styleRule = 1,
+	importRule = 3,
+	mediaRule = 4,
+	fontFaceRule = 5,
+	pageRule = 6,
+	keyframesRule = 7,
+	keyframeRule = 8,
+	namespaceRule = 10,
+	counterStyleRule = 11,
+	supportsRule = 12,
+	documentRule = 13,
+	fontFeatureValuesRule = 14,
+	regionStyleRule = 16
+}
+
+export default CSSRuleTypeEnum;

package/src/css/CSSStyleSheet.ts

@@ -5,7 +5,7 @@ import CSSRule from './CSSRule';
 import MediaList from './MediaList';
 
 /**
- * Attr node interface.
+ * CSS StyleSheet.
  *
  * Reference:
  * https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet.
@@ -16,20 +16,16 @@ export default class CSSStyleSheet {
 	public namespaceURI: string = null;
 	public readonly cssRules: CSSRule[] = [];
 
-	// Constructable Stylesheets is a new feature that only Blink supports:
-	// https://wicg.github.io/construct-stylesheets/
-	// TODO: Not fully implemented.
+	// TODO: MediaList is not fully implemented.
 	public media: MediaList | string;
 	public title: string;
 	public alternate: boolean;
 	public disabled: boolean;
+	private _currentText: string = null;
 
 	/**
 	 * Constructor.
 	 *
-	 * Constructable Stylesheets is a new feature that only Blink supports:
-	 * https://wicg.github.io/construct-stylesheets/.
-	 *
 	 * @param [options] Options.
 	 * @param [options.media] Media.
 	 * @param [options.title] Title.
@@ -51,9 +47,7 @@ export default class CSSStyleSheet {
 	/**
 	 * Inserts a rule.
 	 *
-	 * Constructable Stylesheets is a new feature that only Blink supports:
-	 * https://wicg.github.io/construct-stylesheets/.
-	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet/insertRule
 	 * @param rule Rule.
 	 * @param [index] Index.
 	 * @returns The newly inserterted rule's index.
@@ -79,8 +73,7 @@ export default class CSSStyleSheet {
 					DOMExceptionNameEnum.indexSizeError
 				);
 			}
-			this.cssRules.splice(index, 0);
-			this.cssRules.push(rules[0]);
+			this.cssRules.splice(index, 0, rules[0]);
 			return index;
 		}
 
@@ -94,9 +87,7 @@ export default class CSSStyleSheet {
 	/**
 	 * Removes a rule.
 	 *
-	 * Constructable Stylesheets is a new feature that only Blink supports:
-	 * https://wicg.github.io/construct-stylesheets/.
-	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet/deleteRule
 	 * @param index Index.
 	 */
 	public deleteRule(index: number): void {
@@ -106,9 +97,7 @@ export default class CSSStyleSheet {
 	/**
 	 * Replaces all CSS rules.
 	 *
-	 * Constructable Stylesheets is a new feature that only Blink supports:
-	 * https://wicg.github.io/construct-stylesheets/.
-	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet/replace
 	 * @param text CSS text.
 	 * @returns Promise.
 	 */
@@ -119,12 +108,13 @@ export default class CSSStyleSheet {
 	/**
 	 * Replaces all CSS rules.
 	 *
-	 * Constructable Stylesheets is a new feature that only Blink supports:
-	 * https://wicg.github.io/construct-stylesheets/.
-	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet/replaceSync
 	 * @param text CSS text.
 	 */
 	public replaceSync(text: string): void {
-		(<CSSRule[]>this.cssRules) = CSSParser.parseFromString(this, text);
+		if (this._currentText !== text) {
+			this._currentText = text;
+			(<CSSRule[]>this.cssRules) = CSSParser.parseFromString(this, text);
+		}
 	}
 }

package/src/css/declaration/AbstractCSSStyleDeclaration.ts

@@ -0,0 +1,202 @@
+import IElement from '../../nodes/element/IElement';
+import Attr from '../../nodes/attr/Attr';
+import CSSRule from '../CSSRule';
+import DOMExceptionNameEnum from '../../exception/DOMExceptionNameEnum';
+import DOMException from '../../exception/DOMException';
+import CSSStyleDeclarationElementStyle from './utilities/CSSStyleDeclarationElementStyle';
+import CSSStyleDeclarationPropertyManager from './utilities/CSSStyleDeclarationPropertyManager';
+
+/**
+ * CSS Style Declaration.
+ */
+export default abstract class AbstractCSSStyleDeclaration {
+	public readonly parentRule: CSSRule = null;
+	protected _style: CSSStyleDeclarationPropertyManager = null;
+	protected _ownerElement: IElement;
+	protected _computed: boolean;
+	protected _elementStyle: CSSStyleDeclarationElementStyle = null;
+
+	/**
+	 * Constructor.
+	 *
+	 * @param [ownerElement] Computed style element.
+	 * @param [computed] Computed.
+	 */
+	constructor(ownerElement: IElement = null, computed = false) {
+		this._style = !ownerElement ? new CSSStyleDeclarationPropertyManager() : null;
+		this._ownerElement = ownerElement;
+		this._computed = ownerElement ? computed : false;
+		this._elementStyle = ownerElement
+			? new CSSStyleDeclarationElementStyle(ownerElement, this._computed)
+			: null;
+	}
+
+	/**
+	 * Returns length.
+	 *
+	 * @returns Length.
+	 */
+	public get length(): number {
+		if (this._ownerElement) {
+			const style = this._elementStyle.getElementStyle();
+			return style.size();
+		}
+
+		return this._style.size();
+	}
+
+	/**
+	 * Returns the style decleration as a CSS text.
+	 *
+	 * @returns CSS text.
+	 */
+	public get cssText(): string {
+		if (this._ownerElement) {
+			if (this._computed) {
+				return '';
+			}
+
+			return this._elementStyle.getElementStyle().toString();
+		}
+
+		return this._style.toString();
+	}
+
+	/**
+	 * Sets CSS text.
+	 *
+	 * @param cssText CSS text.
+	 */
+	public set cssText(cssText: string) {
+		if (this._computed) {
+			throw new DOMException(
+				`Failed to execute 'cssText' on 'CSSStyleDeclaration': These styles are computed, and the properties are therefore read-only.`,
+				DOMExceptionNameEnum.domException
+			);
+		}
+
+		if (this._ownerElement) {
+			const style = new CSSStyleDeclarationPropertyManager({ cssText });
+			if (!style.size()) {
+				delete this._ownerElement['_attributes']['style'];
+			} else {
+				if (!this._ownerElement['_attributes']['style']) {
+					Attr._ownerDocument = this._ownerElement.ownerDocument;
+					this._ownerElement['_attributes']['style'] = new Attr();
+					this._ownerElement['_attributes']['style'].name = 'style';
+				}
+
+				this._ownerElement['_attributes']['style'].value = style.toString();
+			}
+		} else {
+			this._style = new CSSStyleDeclarationPropertyManager({ cssText });
+		}
+	}
+
+	/**
+	 * Returns item.
+	 *
+	 * @param index Index.
+	 * @returns Item.
+	 */
+	public item(index: number): string {
+		if (this._ownerElement) {
+			return this._elementStyle.getElementStyle().item(index);
+		}
+		return this._style.item(index);
+	}
+
+	/**
+	 * Set a property.
+	 *
+	 * @param name Property name.
+	 * @param value Value. Must not contain "!important" as that should be set using the priority parameter.
+	 * @param [priority] Can be "important", or an empty string.
+	 */
+	public setProperty(name: string, value: string, priority?: 'important' | '' | undefined): void {
+		if (this._computed) {
+			throw new DOMException(
+				`Failed to execute 'setProperty' on 'CSSStyleDeclaration': These styles are computed, and therefore the '${name}' property is read-only.`,
+				DOMExceptionNameEnum.domException
+			);
+		}
+
+		if (priority !== '' && priority !== undefined && priority !== 'important') {
+			return;
+		}
+
+		if (!value) {
+			this.removeProperty(name);
+		} else if (this._ownerElement) {
+			if (!this._ownerElement['_attributes']['style']) {
+				Attr._ownerDocument = this._ownerElement.ownerDocument;
+				this._ownerElement['_attributes']['style'] = new Attr();
+				this._ownerElement['_attributes']['style'].name = 'style';
+			}
+
+			const style = this._elementStyle.getElementStyle();
+			style.set(name, value, !!priority);
+
+			this._ownerElement['_attributes']['style'].value = style.toString();
+		} else {
+			this._style.set(name, value, !!priority);
+		}
+	}
+
+	/**
+	 * Removes a property.
+	 *
+	 * @param name Property name in kebab case.
+	 * @param value Value. Must not contain "!important" as that should be set using the priority parameter.
+	 * @param [priority] Can be "important", or an empty string.
+	 */
+	public removeProperty(name: string): void {
+		if (this._computed) {
+			throw new DOMException(
+				`Failed to execute 'removeProperty' on 'CSSStyleDeclaration': These styles are computed, and therefore the '${name}' property is read-only.`,
+				DOMExceptionNameEnum.domException
+			);
+		}
+
+		if (this._ownerElement) {
+			const style = this._elementStyle.getElementStyle();
+			style.remove(name);
+			const newCSSText = style.toString();
+			if (newCSSText) {
+				this._ownerElement['_attributes']['style'].value = newCSSText;
+			} else {
+				delete this._ownerElement['_attributes']['style'];
+			}
+		} else {
+			this._style.remove(name);
+		}
+	}
+
+	/**
+	 * Returns a property.
+	 *
+	 * @param name Property name in kebab case.
+	 * @returns Property value.
+	 */
+	public getPropertyValue(name: string): string {
+		if (this._ownerElement) {
+			const style = this._elementStyle.getElementStyle();
+			return style.get(name)?.value || '';
+		}
+		return this._style.get(name)?.value || '';
+	}
+
+	/**
+	 * Returns a property.
+	 *
+	 * @param name Property name in kebab case.
+	 * @returns "important" if set to be important.
+	 */
+	public getPropertyPriority(name: string): string {
+		if (this._ownerElement) {
+			const style = this._elementStyle.getElementStyle();
+			return style.get(name)?.important ? 'important' : '';
+		}
+		return this._style.get(name)?.important ? 'important' : '';
+	}
+}