@acemir/cssom 0.9.29 → 0.9.30

package/build/CSSOM.js

@@ -716,6 +716,122 @@ Object.defineProperty(CSSOM.CSSCounterStyleRule.prototype, "parse", {
 
 
 
+/**
+ * @constructor
+ * @see https://drafts.css-houdini.org/css-properties-values-api/#the-css-property-rule-interface
+ */
+CSSOM.CSSPropertyRule = function CSSPropertyRule() {
+	CSSOM.CSSRule.call(this);
+	this.__name = "";
+	this.__syntax = "";
+	this.__inherits = false;
+	this.__initialValue = null;
+};
+
+CSSOM.CSSPropertyRule.prototype = Object.create(CSSOM.CSSRule.prototype);
+CSSOM.CSSPropertyRule.prototype.constructor = CSSOM.CSSPropertyRule;
+
+Object.setPrototypeOf(CSSOM.CSSPropertyRule, CSSOM.CSSRule);
+
+Object.defineProperty(CSSOM.CSSPropertyRule.prototype, "type", {
+	value: 0,
+	writable: false
+});
+
+Object.defineProperty(CSSOM.CSSPropertyRule.prototype, "cssText", {
+	get: function() {
+		var text = "@property " + this.name + " {";
+		if (this.syntax !== "") {
+			text += " syntax: \"" + this.syntax.replace(/\\/g, '\\\\').replace(/"/g, '\\"') + "\";";
+		}
+		text += " inherits: " + (this.inherits ? "true" : "false") + ";";
+		if (this.initialValue !== null) {
+			text += " initial-value: " + this.initialValue + ";";
+		}
+		text += " }";
+		return text;
+	}
+});
+
+Object.defineProperty(CSSOM.CSSPropertyRule.prototype, "name", {
+	get: function() {
+		return this.__name;
+	}
+});
+
+Object.defineProperty(CSSOM.CSSPropertyRule.prototype, "syntax", {
+	get: function() {
+		return this.__syntax;
+	}
+});
+
+Object.defineProperty(CSSOM.CSSPropertyRule.prototype, "inherits", {
+	get: function() {
+		return this.__inherits;
+	}
+});
+
+Object.defineProperty(CSSOM.CSSPropertyRule.prototype, "initialValue", {
+	get: function() {
+		return this.__initialValue;
+	}
+});
+
+/**
+ * NON-STANDARD
+ * Rule text parser.
+ * @param {string} cssText
+ * @returns {boolean} True if the rule is valid and was parsed successfully
+ */
+Object.defineProperty(CSSOM.CSSPropertyRule.prototype, "parse", {
+	value: function(cssText) {
+		// Extract the name from "@property <name> { ... }"
+		var match = cssText.match(/@property\s+(--[^\s{]+)\s*\{([^]*)\}/);
+		if (!match) {
+			return false;
+		}
+		
+		this.__name = match[1];
+		var bodyText = match[2];
+		
+		// Parse syntax descriptor (REQUIRED)
+		var syntaxMatch = bodyText.match(/syntax\s*:\s*(['"])([^]*?)\1\s*;/);
+		if (!syntaxMatch) {
+			return false; // syntax is required
+		}
+		this.__syntax = syntaxMatch[2];
+		
+		// Syntax cannot be empty
+		if (this.__syntax === "") {
+			return false;
+		}
+		
+		// Parse inherits descriptor (REQUIRED)
+		var inheritsMatch = bodyText.match(/inherits\s*:\s*(true|false)\s*;/);
+		if (!inheritsMatch) {
+			return false; // inherits is required
+		}
+		this.__inherits = inheritsMatch[1] === "true";
+		
+		// Parse initial-value descriptor (OPTIONAL, but required if syntax is not "*")
+		var initialValueMatch = bodyText.match(/initial-value\s*:\s*([^;]+);/);
+		if (initialValueMatch) {
+			this.__initialValue = initialValueMatch[1].trim();
+		} else {
+			// If syntax is not "*", initial-value is required
+			if (this.__syntax !== "*") {
+				return false;
+			}
+		}
+		
+		return true; // Successfully parsed
+	}
+});
+
+
+
+
+
 /**
  * @constructor
  * @see https://www.w3.org/TR/css-conditional-3/#the-cssconditionrule-interface
@@ -781,7 +897,8 @@ Object.defineProperty(CSSOM.CSSStyleRule.prototype, "selectorText", {
 
 			this.__selectorText = trimmedValue;
 		}
-	}
+	},
+	configurable: true
 });
 
 Object.defineProperty(CSSOM.CSSStyleRule.prototype, "style", {
@@ -794,7 +911,8 @@ Object.defineProperty(CSSOM.CSSStyleRule.prototype, "style", {
 		} else {
 			this.__style = value;
 		}
-	}
+	},
+	configurable: true
 });
 
 Object.defineProperty(CSSOM.CSSStyleRule.prototype, "cssText", {
@@ -934,6 +1052,7 @@ Object.defineProperties(CSSOM.CSSMediaRule.prototype, {
         this.__media = value;
       }
     },
+    configurable: true,
     enumerable: true
   },
   "conditionText": {
@@ -1728,6 +1847,11 @@ CSSOM.CSSStyleSheet.prototype.insertRule = function(rule, index) {
 	
 	// Validate rule ordering based on CSS specification
 	if (cssRule.constructor.name === 'CSSImportRule') {
+		if (this.__constructed === true) {
+			errorUtils.throwError(this, 'DOMException',
+				"Failed to execute 'insertRule' on '" + this.constructor.name + "': Can't insert @import rules into a constructed stylesheet.",
+				'SyntaxError');
+		}
 		// @import rules cannot be inserted after @layer rules that already exist
 		// They can only be inserted at the beginning or after other @import rules
 		var firstLayerIndex = findFirstNonConstructorIndex(this.cssRules, ['CSSImportRule']);
@@ -3023,6 +3147,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 		"containerBlock": true,
 		"conditionBlock": true,
 		"counterStyleBlock": true,
+		"propertyBlock": true,
 		'documentRule-begin': true,
 		"scopeBlock": true,
 		"layerBlock": true,
@@ -3054,6 +3179,10 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 		if (ownerNodeMedia) {
 			styleSheet.media.mediaText = ownerNodeMedia;
 		}
+		var ownerNodeTitle = opts.ownerNode.title || (opts.ownerNode.getAttribute && opts.ownerNode.getAttribute("title"));
+		if (ownerNodeTitle) {
+			styleSheet.__title = ownerNodeTitle;
+		}
 	}
 
 	if (opts && opts.ownerRule) {
@@ -3069,7 +3198,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 	var ancestorRules = [];
 	var prevScope;
 
-	var name, priority = "", styleRule, mediaRule, containerRule, counterStyleRule, supportsRule, importRule, fontFaceRule, keyframesRule, documentRule, hostRule, startingStyleRule, scopeRule, pageRule, layerBlockRule, layerStatementRule, nestedSelectorRule, namespaceRule;
+	var name, priority = "", styleRule, mediaRule, containerRule, counterStyleRule, propertyRule, supportsRule, importRule, fontFaceRule, keyframesRule, documentRule, hostRule, startingStyleRule, scopeRule, pageRule, layerBlockRule, layerStatementRule, nestedSelectorRule, namespaceRule;
 
 	// Track defined namespace prefixes for validation
 	var definedNamespacePrefixes = {};
@@ -3384,6 +3513,44 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 		return invalidNestingPattern.test(selector);
 	};
 
+	/**
+	 * Checks if an at-rule can be nested based on parent chain validation.
+	 * Used for at-rules like `@counter-style`, `@property` and `@font-face` rules that can only be nested inside
+	 * `CSSScopeRule` or `CSSConditionRule` without `CSSStyleRule` in parent chain.
+	 * @returns {boolean} `true` if nesting is allowed, `false` otherwise
+	 */
+	function canAtRuleBeNested() {
+		if (currentScope === topScope) {
+			return true; // Top-level is always allowed
+		}
+
+		var hasStyleRuleInChain = false;
+		var hasValidParent = false;
+
+		// Check currentScope
+		if (currentScope.constructor.name === 'CSSStyleRule') {
+			hasStyleRuleInChain = true;
+		} else if (currentScope instanceof CSSOM.CSSScopeRule || currentScope instanceof CSSOM.CSSConditionRule) {
+			hasValidParent = true;
+		}
+
+		// Check ancestorRules for CSSStyleRule
+		if (!hasStyleRuleInChain) {
+			for (var j = 0; j < ancestorRules.length; j++) {
+				if (ancestorRules[j].constructor.name === 'CSSStyleRule') {
+					hasStyleRuleInChain = true;
+					break;
+				}
+				if (ancestorRules[j] instanceof CSSOM.CSSScopeRule || ancestorRules[j] instanceof CSSOM.CSSConditionRule) {
+					hasValidParent = true;
+				}
+			}
+		}
+
+		// Allow nesting if we have a valid parent and no style rule in the chain
+		return hasValidParent && !hasStyleRuleInChain;
+	}
+
 	function validateAtRule(atRuleKey, validCallback, cannotBeNested) {
 		var isValid = false;
 		var sourceRuleRegExp = atRuleKey === "@import" ? forwardImportRuleValidationRegExp : forwardRuleValidationRegExp;
@@ -4565,13 +4732,28 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 					buffer = "";
 					break;
 				} else if (token.indexOf("@counter-style", i) === i) {
+					buffer = "";
+					// @counter-style can be nested only inside CSSScopeRule or CSSConditionRule
+					// and only if there's no CSSStyleRule in the parent chain
+					var cannotBeNested = !canAtRuleBeNested();
 					validateAtRule("@counter-style", function () {
 						state = "counterStyleBlock"
 						counterStyleRule = new CSSOM.CSSCounterStyleRule();
 						counterStyleRule.__starts = i;
 						i += "counter-style".length;
-					}, true);
+					}, cannotBeNested);
+					break;
+				} else if (token.indexOf("@property", i) === i) {
 					buffer = "";
+					// @property can be nested only inside CSSScopeRule or CSSConditionRule
+					// and only if there's no CSSStyleRule in the parent chain
+					var cannotBeNested = !canAtRuleBeNested();
+					validateAtRule("@property", function () {
+						state = "propertyBlock"
+						propertyRule = new CSSOM.CSSPropertyRule();
+						propertyRule.__starts = i;
+						i += "property".length;
+					}, cannotBeNested);
 					break;
 				} else if (token.indexOf("@scope", i) === i) {
 					validateAtRule("@scope", function () {
@@ -4647,36 +4829,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 					buffer = "";
 					// @font-face can be nested only inside CSSScopeRule or CSSConditionRule
 					// and only if there's no CSSStyleRule in the parent chain
-					var cannotBeNested = true;
-					if (currentScope !== topScope) {
-						var hasStyleRuleInChain = false;
-						var hasValidParent = false;
-
-						// Check currentScope
-						if (currentScope.constructor.name === 'CSSStyleRule') {
-							hasStyleRuleInChain = true;
-						} else if (currentScope instanceof CSSOM.CSSScopeRule || currentScope instanceof CSSOM.CSSConditionRule) {
-							hasValidParent = true;
-						}
-
-						// Check ancestorRules for CSSStyleRule
-						if (!hasStyleRuleInChain) {
-							for (var j = 0; j < ancestorRules.length; j++) {
-								if (ancestorRules[j].constructor.name === 'CSSStyleRule') {
-									hasStyleRuleInChain = true;
-									break;
-								}
-								if (ancestorRules[j] instanceof CSSOM.CSSScopeRule || ancestorRules[j] instanceof CSSOM.CSSConditionRule) {
-									hasValidParent = true;
-								}
-							}
-						}
-
-						// Allow nesting if we have a valid parent and no style rule in the chain
-						if (hasValidParent && !hasStyleRuleInChain) {
-							cannotBeNested = false;
-						}
-					}
+					var cannotBeNested = !canAtRuleBeNested();
 					validateAtRule("@font-face", function () {
 						state = "fontFaceRule-begin";
 						i += "font-face".length;
@@ -4793,8 +4946,25 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 
 					if (isValidCounterStyleName) {
 						counterStyleRule.name = counterStyleName;
-						currentScope = parentRule = counterStyleRule;
+						if (parentRule) {
+							counterStyleRule.__parentRule = parentRule;
+						}
 						counterStyleRule.__parentStyleSheet = styleSheet;
+						styleRule = counterStyleRule;
+					}
+					buffer = "";
+				} else if (state === "propertyBlock") {
+					var propertyName = buffer.trim().replace(/\n/g, "");
+					// Validate: name must start with -- (custom property)
+					var isValidPropertyName = propertyName.indexOf("--") === 0;
+
+					if (isValidPropertyName) {
+						propertyRule.__name = propertyName;
+						if (parentRule) {
+							propertyRule.__parentRule = parentRule;
+						}
+						propertyRule.__parentStyleSheet = styleSheet;
+						styleRule = propertyRule;
 					}
 					buffer = "";
 				} else if (state === "conditionBlock") {
@@ -5082,6 +5252,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 							if (opts && opts.globalObject && opts.globalObject.CSSStyleSheet) {
 								importRule.__styleSheet = new opts.globalObject.CSSStyleSheet();
 							}
+							importRule.styleSheet.__constructed = false;
 							importRule.__parentStyleSheet = importRule.styleSheet.__parentStyleSheet = styleSheet;
 							importRule.parse(buffer + character);
 							topScope.cssRules.push(importRule);
@@ -5163,11 +5334,50 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 				if (state === "counterStyleBlock") {
 					// FIXME : Implement missing properties on CSSCounterStyleRule interface and update parse method
 					// For now it's just assigning entire rule text
-					counterStyleRule.parse("@counter-style " + counterStyleRule.name + " { " + buffer + " }");
+					if (counterStyleRule.name) {
+						// Only process if name was set (valid)
+						counterStyleRule.parse("@counter-style " + counterStyleRule.name + " { " + buffer + " }");
+						counterStyleRule.__ends = i + 1;
+						// Add to parent's cssRules
+						if (counterStyleRule.__parentRule) {
+							counterStyleRule.__parentRule.cssRules.push(counterStyleRule);
+						} else {
+							topScope.cssRules.push(counterStyleRule);
+						}
+					}
+					// Restore currentScope to parent after closing this rule
+					if (counterStyleRule.__parentRule) {
+						currentScope = counterStyleRule.__parentRule;
+					}
+					styleRule = null;
 					buffer = "";
 					state = "before-selector";
+					break;
+				}
+				if (state === "propertyBlock") {
+					// Only process if name was set (valid)
+					if (propertyRule.__name) {
+						var parseSuccess = propertyRule.parse("@property " + propertyRule.__name + " { " + buffer + " }");
+						// Only add the rule if parse was successful (syntax, inherits, and initial-value validation passed)
+						if (parseSuccess) {
+							propertyRule.__ends = i + 1;
+							// Add to parent's cssRules
+							if (propertyRule.__parentRule) {
+								propertyRule.__parentRule.cssRules.push(propertyRule);
+							} else {
+								topScope.cssRules.push(propertyRule);
+							}
+						}
+					}
+					// Restore currentScope to parent after closing this rule
+					if (propertyRule.__parentRule) {
+						currentScope = propertyRule.__parentRule;
+					}
+					styleRule = null;
+					buffer = "";
+					state = "before-selector";
+					break;
 				}
-
 				switch (state) {
 					case "value":
 						styleRule.style.setProperty(name, buffer.trim(), priority, parseError);
@@ -5292,6 +5502,8 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 										currentScope.cssRules.push(prevScope);
 									}
 									nestedSelectorRule = currentScope;
+									// Stop here to preserve context for sibling selectors
+									break;
 								} else {
 									// Top-level CSSStyleRule with nested grouping rule
 									prevScope = currentScope;

package/lib/CSSMediaRule.js

@@ -42,6 +42,7 @@ Object.defineProperties(CSSOM.CSSMediaRule.prototype, {
         this.__media = value;
       }
     },
+    configurable: true,
     enumerable: true
   },
   "conditionText": {

package/lib/CSSPropertyRule.js

@@ -0,0 +1,122 @@
+//.CommonJS
+var CSSOM = {
+	CSSRule: require("./CSSRule").CSSRule
+};
+///CommonJS
+
+
+/**
+ * @constructor
+ * @see https://drafts.css-houdini.org/css-properties-values-api/#the-css-property-rule-interface
+ */
+CSSOM.CSSPropertyRule = function CSSPropertyRule() {
+	CSSOM.CSSRule.call(this);
+	this.__name = "";
+	this.__syntax = "";
+	this.__inherits = false;
+	this.__initialValue = null;
+};
+
+CSSOM.CSSPropertyRule.prototype = Object.create(CSSOM.CSSRule.prototype);
+CSSOM.CSSPropertyRule.prototype.constructor = CSSOM.CSSPropertyRule;
+
+Object.setPrototypeOf(CSSOM.CSSPropertyRule, CSSOM.CSSRule);
+
+Object.defineProperty(CSSOM.CSSPropertyRule.prototype, "type", {
+	value: 0,
+	writable: false
+});
+
+Object.defineProperty(CSSOM.CSSPropertyRule.prototype, "cssText", {
+	get: function() {
+		var text = "@property " + this.name + " {";
+		if (this.syntax !== "") {
+			text += " syntax: \"" + this.syntax.replace(/\\/g, '\\\\').replace(/"/g, '\\"') + "\";";
+		}
+		text += " inherits: " + (this.inherits ? "true" : "false") + ";";
+		if (this.initialValue !== null) {
+			text += " initial-value: " + this.initialValue + ";";
+		}
+		text += " }";
+		return text;
+	}
+});
+
+Object.defineProperty(CSSOM.CSSPropertyRule.prototype, "name", {
+	get: function() {
+		return this.__name;
+	}
+});
+
+Object.defineProperty(CSSOM.CSSPropertyRule.prototype, "syntax", {
+	get: function() {
+		return this.__syntax;
+	}
+});
+
+Object.defineProperty(CSSOM.CSSPropertyRule.prototype, "inherits", {
+	get: function() {
+		return this.__inherits;
+	}
+});
+
+Object.defineProperty(CSSOM.CSSPropertyRule.prototype, "initialValue", {
+	get: function() {
+		return this.__initialValue;
+	}
+});
+
+/**
+ * NON-STANDARD
+ * Rule text parser.
+ * @param {string} cssText
+ * @returns {boolean} True if the rule is valid and was parsed successfully
+ */
+Object.defineProperty(CSSOM.CSSPropertyRule.prototype, "parse", {
+	value: function(cssText) {
+		// Extract the name from "@property <name> { ... }"
+		var match = cssText.match(/@property\s+(--[^\s{]+)\s*\{([^]*)\}/);
+		if (!match) {
+			return false;
+		}
+		
+		this.__name = match[1];
+		var bodyText = match[2];
+		
+		// Parse syntax descriptor (REQUIRED)
+		var syntaxMatch = bodyText.match(/syntax\s*:\s*(['"])([^]*?)\1\s*;/);
+		if (!syntaxMatch) {
+			return false; // syntax is required
+		}
+		this.__syntax = syntaxMatch[2];
+		
+		// Syntax cannot be empty
+		if (this.__syntax === "") {
+			return false;
+		}
+		
+		// Parse inherits descriptor (REQUIRED)
+		var inheritsMatch = bodyText.match(/inherits\s*:\s*(true|false)\s*;/);
+		if (!inheritsMatch) {
+			return false; // inherits is required
+		}
+		this.__inherits = inheritsMatch[1] === "true";
+		
+		// Parse initial-value descriptor (OPTIONAL, but required if syntax is not "*")
+		var initialValueMatch = bodyText.match(/initial-value\s*:\s*([^;]+);/);
+		if (initialValueMatch) {
+			this.__initialValue = initialValueMatch[1].trim();
+		} else {
+			// If syntax is not "*", initial-value is required
+			if (this.__syntax !== "*") {
+				return false;
+			}
+		}
+		
+		return true; // Successfully parsed
+	}
+});
+
+//.CommonJS
+exports.CSSPropertyRule = CSSOM.CSSPropertyRule;
+///CommonJS

package/lib/CSSStyleRule.js

@@ -55,7 +55,8 @@ Object.defineProperty(CSSOM.CSSStyleRule.prototype, "selectorText", {
 
 			this.__selectorText = trimmedValue;
 		}
-	}
+	},
+	configurable: true
 });
 
 Object.defineProperty(CSSOM.CSSStyleRule.prototype, "style", {
@@ -68,7 +69,8 @@ Object.defineProperty(CSSOM.CSSStyleRule.prototype, "style", {
 		} else {
 			this.__style = value;
 		}
-	}
+	},
+	configurable: true
 });
 
 Object.defineProperty(CSSOM.CSSStyleRule.prototype, "cssText", {

package/lib/CSSStyleSheet.js

@@ -123,6 +123,11 @@ CSSOM.CSSStyleSheet.prototype.insertRule = function(rule, index) {
 	
 	// Validate rule ordering based on CSS specification
 	if (cssRule.constructor.name === 'CSSImportRule') {
+		if (this.__constructed === true) {
+			errorUtils.throwError(this, 'DOMException',
+				"Failed to execute 'insertRule' on '" + this.constructor.name + "': Can't insert @import rules into a constructed stylesheet.",
+				'SyntaxError');
+		}
 		// @import rules cannot be inserted after @layer rules that already exist
 		// They can only be inserted at the beginning or after other @import rules
 		var firstLayerIndex = findFirstNonConstructorIndex(this.cssRules, ['CSSImportRule']);

package/lib/index.js

@@ -13,6 +13,7 @@ exports.CSSRuleList = require('./CSSRuleList').CSSRuleList;
 exports.CSSNestedDeclarations = require('./CSSNestedDeclarations').CSSNestedDeclarations;
 exports.CSSGroupingRule = require('./CSSGroupingRule').CSSGroupingRule;
 exports.CSSCounterStyleRule = require('./CSSCounterStyleRule').CSSCounterStyleRule;
+exports.CSSPropertyRule = require('./CSSPropertyRule').CSSPropertyRule;
 exports.CSSConditionRule = require('./CSSConditionRule').CSSConditionRule;
 exports.CSSStyleRule = require('./CSSStyleRule').CSSStyleRule;
 exports.MediaList = require('./MediaList').MediaList;

package/lib/parse.js

@@ -52,6 +52,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 		"containerBlock": true,
 		"conditionBlock": true,
 		"counterStyleBlock": true,
+		"propertyBlock": true,
 		'documentRule-begin': true,
 		"scopeBlock": true,
 		"layerBlock": true,
@@ -83,6 +84,10 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 		if (ownerNodeMedia) {
 			styleSheet.media.mediaText = ownerNodeMedia;
 		}
+		var ownerNodeTitle = opts.ownerNode.title || (opts.ownerNode.getAttribute && opts.ownerNode.getAttribute("title"));
+		if (ownerNodeTitle) {
+			styleSheet.__title = ownerNodeTitle;
+		}
 	}
 
 	if (opts && opts.ownerRule) {
@@ -98,7 +103,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 	var ancestorRules = [];
 	var prevScope;
 
-	var name, priority = "", styleRule, mediaRule, containerRule, counterStyleRule, supportsRule, importRule, fontFaceRule, keyframesRule, documentRule, hostRule, startingStyleRule, scopeRule, pageRule, layerBlockRule, layerStatementRule, nestedSelectorRule, namespaceRule;
+	var name, priority = "", styleRule, mediaRule, containerRule, counterStyleRule, propertyRule, supportsRule, importRule, fontFaceRule, keyframesRule, documentRule, hostRule, startingStyleRule, scopeRule, pageRule, layerBlockRule, layerStatementRule, nestedSelectorRule, namespaceRule;
 
 	// Track defined namespace prefixes for validation
 	var definedNamespacePrefixes = {};
@@ -413,6 +418,44 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 		return invalidNestingPattern.test(selector);
 	};
 
+	/**
+	 * Checks if an at-rule can be nested based on parent chain validation.
+	 * Used for at-rules like `@counter-style`, `@property` and `@font-face` rules that can only be nested inside
+	 * `CSSScopeRule` or `CSSConditionRule` without `CSSStyleRule` in parent chain.
+	 * @returns {boolean} `true` if nesting is allowed, `false` otherwise
+	 */
+	function canAtRuleBeNested() {
+		if (currentScope === topScope) {
+			return true; // Top-level is always allowed
+		}
+
+		var hasStyleRuleInChain = false;
+		var hasValidParent = false;
+
+		// Check currentScope
+		if (currentScope.constructor.name === 'CSSStyleRule') {
+			hasStyleRuleInChain = true;
+		} else if (currentScope instanceof CSSOM.CSSScopeRule || currentScope instanceof CSSOM.CSSConditionRule) {
+			hasValidParent = true;
+		}
+
+		// Check ancestorRules for CSSStyleRule
+		if (!hasStyleRuleInChain) {
+			for (var j = 0; j < ancestorRules.length; j++) {
+				if (ancestorRules[j].constructor.name === 'CSSStyleRule') {
+					hasStyleRuleInChain = true;
+					break;
+				}
+				if (ancestorRules[j] instanceof CSSOM.CSSScopeRule || ancestorRules[j] instanceof CSSOM.CSSConditionRule) {
+					hasValidParent = true;
+				}
+			}
+		}
+
+		// Allow nesting if we have a valid parent and no style rule in the chain
+		return hasValidParent && !hasStyleRuleInChain;
+	}
+
 	function validateAtRule(atRuleKey, validCallback, cannotBeNested) {
 		var isValid = false;
 		var sourceRuleRegExp = atRuleKey === "@import" ? forwardImportRuleValidationRegExp : forwardRuleValidationRegExp;
@@ -1594,13 +1637,28 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 					buffer = "";
 					break;
 				} else if (token.indexOf("@counter-style", i) === i) {
+					buffer = "";
+					// @counter-style can be nested only inside CSSScopeRule or CSSConditionRule
+					// and only if there's no CSSStyleRule in the parent chain
+					var cannotBeNested = !canAtRuleBeNested();
 					validateAtRule("@counter-style", function () {
 						state = "counterStyleBlock"
 						counterStyleRule = new CSSOM.CSSCounterStyleRule();
 						counterStyleRule.__starts = i;
 						i += "counter-style".length;
-					}, true);
+					}, cannotBeNested);
+					break;
+				} else if (token.indexOf("@property", i) === i) {
 					buffer = "";
+					// @property can be nested only inside CSSScopeRule or CSSConditionRule
+					// and only if there's no CSSStyleRule in the parent chain
+					var cannotBeNested = !canAtRuleBeNested();
+					validateAtRule("@property", function () {
+						state = "propertyBlock"
+						propertyRule = new CSSOM.CSSPropertyRule();
+						propertyRule.__starts = i;
+						i += "property".length;
+					}, cannotBeNested);
 					break;
 				} else if (token.indexOf("@scope", i) === i) {
 					validateAtRule("@scope", function () {
@@ -1676,36 +1734,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 					buffer = "";
 					// @font-face can be nested only inside CSSScopeRule or CSSConditionRule
 					// and only if there's no CSSStyleRule in the parent chain
-					var cannotBeNested = true;
-					if (currentScope !== topScope) {
-						var hasStyleRuleInChain = false;
-						var hasValidParent = false;
-
-						// Check currentScope
-						if (currentScope.constructor.name === 'CSSStyleRule') {
-							hasStyleRuleInChain = true;
-						} else if (currentScope instanceof CSSOM.CSSScopeRule || currentScope instanceof CSSOM.CSSConditionRule) {
-							hasValidParent = true;
-						}
-
-						// Check ancestorRules for CSSStyleRule
-						if (!hasStyleRuleInChain) {
-							for (var j = 0; j < ancestorRules.length; j++) {
-								if (ancestorRules[j].constructor.name === 'CSSStyleRule') {
-									hasStyleRuleInChain = true;
-									break;
-								}
-								if (ancestorRules[j] instanceof CSSOM.CSSScopeRule || ancestorRules[j] instanceof CSSOM.CSSConditionRule) {
-									hasValidParent = true;
-								}
-							}
-						}
-
-						// Allow nesting if we have a valid parent and no style rule in the chain
-						if (hasValidParent && !hasStyleRuleInChain) {
-							cannotBeNested = false;
-						}
-					}
+					var cannotBeNested = !canAtRuleBeNested();
 					validateAtRule("@font-face", function () {
 						state = "fontFaceRule-begin";
 						i += "font-face".length;
@@ -1822,8 +1851,25 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 
 					if (isValidCounterStyleName) {
 						counterStyleRule.name = counterStyleName;
-						currentScope = parentRule = counterStyleRule;
+						if (parentRule) {
+							counterStyleRule.__parentRule = parentRule;
+						}
 						counterStyleRule.__parentStyleSheet = styleSheet;
+						styleRule = counterStyleRule;
+					}
+					buffer = "";
+				} else if (state === "propertyBlock") {
+					var propertyName = buffer.trim().replace(/\n/g, "");
+					// Validate: name must start with -- (custom property)
+					var isValidPropertyName = propertyName.indexOf("--") === 0;
+
+					if (isValidPropertyName) {
+						propertyRule.__name = propertyName;
+						if (parentRule) {
+							propertyRule.__parentRule = parentRule;
+						}
+						propertyRule.__parentStyleSheet = styleSheet;
+						styleRule = propertyRule;
 					}
 					buffer = "";
 				} else if (state === "conditionBlock") {
@@ -2111,6 +2157,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 							if (opts && opts.globalObject && opts.globalObject.CSSStyleSheet) {
 								importRule.__styleSheet = new opts.globalObject.CSSStyleSheet();
 							}
+							importRule.styleSheet.__constructed = false;
 							importRule.__parentStyleSheet = importRule.styleSheet.__parentStyleSheet = styleSheet;
 							importRule.parse(buffer + character);
 							topScope.cssRules.push(importRule);
@@ -2192,11 +2239,50 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 				if (state === "counterStyleBlock") {
 					// FIXME : Implement missing properties on CSSCounterStyleRule interface and update parse method
 					// For now it's just assigning entire rule text
-					counterStyleRule.parse("@counter-style " + counterStyleRule.name + " { " + buffer + " }");
+					if (counterStyleRule.name) {
+						// Only process if name was set (valid)
+						counterStyleRule.parse("@counter-style " + counterStyleRule.name + " { " + buffer + " }");
+						counterStyleRule.__ends = i + 1;
+						// Add to parent's cssRules
+						if (counterStyleRule.__parentRule) {
+							counterStyleRule.__parentRule.cssRules.push(counterStyleRule);
+						} else {
+							topScope.cssRules.push(counterStyleRule);
+						}
+					}
+					// Restore currentScope to parent after closing this rule
+					if (counterStyleRule.__parentRule) {
+						currentScope = counterStyleRule.__parentRule;
+					}
+					styleRule = null;
 					buffer = "";
 					state = "before-selector";
+					break;
+				}
+				if (state === "propertyBlock") {
+					// Only process if name was set (valid)
+					if (propertyRule.__name) {
+						var parseSuccess = propertyRule.parse("@property " + propertyRule.__name + " { " + buffer + " }");
+						// Only add the rule if parse was successful (syntax, inherits, and initial-value validation passed)
+						if (parseSuccess) {
+							propertyRule.__ends = i + 1;
+							// Add to parent's cssRules
+							if (propertyRule.__parentRule) {
+								propertyRule.__parentRule.cssRules.push(propertyRule);
+							} else {
+								topScope.cssRules.push(propertyRule);
+							}
+						}
+					}
+					// Restore currentScope to parent after closing this rule
+					if (propertyRule.__parentRule) {
+						currentScope = propertyRule.__parentRule;
+					}
+					styleRule = null;
+					buffer = "";
+					state = "before-selector";
+					break;
 				}
-
 				switch (state) {
 					case "value":
 						styleRule.style.setProperty(name, buffer.trim(), priority, parseError);
@@ -2321,6 +2407,8 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 										currentScope.cssRules.push(prevScope);
 									}
 									nestedSelectorRule = currentScope;
+									// Stop here to preserve context for sibling selectors
+									break;
 								} else {
 									// Top-level CSSStyleRule with nested grouping rule
 									prevScope = currentScope;
@@ -2484,6 +2572,7 @@ CSSOM.CSSNamespaceRule = require("./CSSNamespaceRule").CSSNamespaceRule;
 CSSOM.CSSGroupingRule = require("./CSSGroupingRule").CSSGroupingRule;
 CSSOM.CSSMediaRule = require("./CSSMediaRule").CSSMediaRule;
 CSSOM.CSSCounterStyleRule = require("./CSSCounterStyleRule").CSSCounterStyleRule;
+CSSOM.CSSPropertyRule = require("./CSSPropertyRule").CSSPropertyRule;
 CSSOM.CSSContainerRule = require("./CSSContainerRule").CSSContainerRule;
 CSSOM.CSSConditionRule = require("./CSSConditionRule").CSSConditionRule;
 CSSOM.CSSSupportsRule = require("./CSSSupportsRule").CSSSupportsRule;

package/package.json

@@ -7,7 +7,7 @@
     "parser",
     "styleSheet"
   ],
-  "version": "0.9.29",
+  "version": "0.9.30",
   "author": "Nikita Vasilyev <me@elv1s.ru>",
   "contributors": [
     "Acemir Sousa Mendes <acemirsm@gmail.com>"
@@ -24,7 +24,8 @@
     "release": "npm run build && changeset publish"
   },
   "devDependencies": {
-    "@changesets/changelog-github": "^0.5.1",
-    "@changesets/cli": "^2.27.1"
+    "@changesets/changelog-github": "^0.5.2",
+    "@changesets/cli": "^2.29.8",
+    "@changesets/get-release-plan": "^4.0.14"
   }
 }