@acemir/cssom 0.9.17 → 0.9.19

package/build/CSSOM.js

@@ -5,27 +5,27 @@ var CSSOM = {};
 
 /**
  * Gets the appropriate error constructor from the global object context.
- * Tries to find the error constructor from parentStyleSheet._globalObject,
- * then from _globalObject, then falls back to the native constructor.
+ * Tries to find the error constructor from parentStyleSheet.__globalObject,
+ * then from __globalObject, then falls back to the native constructor.
  * 
  * @param {Object} context - The CSSOM object (rule, stylesheet, etc.)
  * @param {string} errorType - The error type ('TypeError', 'RangeError', 'DOMException', etc.)
  * @return {Function} The error constructor
  */
 function getErrorConstructor(context, errorType) {
-	// Try parentStyleSheet._globalObject first
-	if (context.parentStyleSheet && context.parentStyleSheet._globalObject && context.parentStyleSheet._globalObject[errorType]) {
-		return context.parentStyleSheet._globalObject[errorType];
+	// Try parentStyleSheet.__globalObject first
+	if (context.parentStyleSheet && context.parentStyleSheet.__globalObject && context.parentStyleSheet.__globalObject[errorType]) {
+		return context.parentStyleSheet.__globalObject[errorType];
 	}
 	
 	// Try __parentStyleSheet (alternative naming)
-	if (context.__parentStyleSheet && context.__parentStyleSheet._globalObject && context.__parentStyleSheet._globalObject[errorType]) {
-		return context.__parentStyleSheet._globalObject[errorType];
+	if (context.__parentStyleSheet && context.__parentStyleSheet.__globalObject && context.__parentStyleSheet.__globalObject[errorType]) {
+		return context.__parentStyleSheet.__globalObject[errorType];
 	}
 	
-	// Try _globalObject on the context itself
-	if (context._globalObject && context._globalObject[errorType]) {
-		return context._globalObject[errorType];
+	// Try __globalObject on the context itself
+	if (context.__globalObject && context.__globalObject[errorType]) {
+		return context.__globalObject[errorType];
 	}
 	
 	// Fall back to native constructor
@@ -66,16 +66,6 @@ function throwMissingArguments(context, methodName, objectName, required, provid
 	throwError(context, 'TypeError', message);
 }
 
-/**
- * Throws a RangeError for index out of bounds.
- * 
- * @param {Object} context - The CSSOM object
- * @param {string} [message] - Optional custom message, defaults to 'INDEX_SIZE_ERR'
- */
-function throwIndexSizeError(context, message) {
-	throwError(context, 'RangeError', message || 'INDEX_SIZE_ERR');
-}
-
 /**
  * Throws a DOMException for parse errors.
  * 
@@ -111,7 +101,6 @@ var errorUtils = {
 	getErrorConstructor: getErrorConstructor,
 	throwError: throwError,
 	throwMissingArguments: throwMissingArguments,
-	throwIndexSizeError: throwIndexSizeError,
 	throwParseError: throwParseError,
 	throwIndexError: throwIndexError
 };
@@ -312,6 +301,27 @@ CSSOM.CSSRule = function CSSRule() {
   this.__parentStyleSheet = null;
 };
 
+CSSOM.CSSRule.UNKNOWN_RULE = 0; // obsolete
+CSSOM.CSSRule.STYLE_RULE = 1;
+CSSOM.CSSRule.CHARSET_RULE = 2; // obsolete
+CSSOM.CSSRule.IMPORT_RULE = 3;
+CSSOM.CSSRule.MEDIA_RULE = 4;
+CSSOM.CSSRule.FONT_FACE_RULE = 5;
+CSSOM.CSSRule.PAGE_RULE = 6;
+CSSOM.CSSRule.KEYFRAMES_RULE = 7;
+CSSOM.CSSRule.KEYFRAME_RULE = 8;
+CSSOM.CSSRule.MARGIN_RULE = 9;
+CSSOM.CSSRule.NAMESPACE_RULE = 10;
+CSSOM.CSSRule.COUNTER_STYLE_RULE = 11;
+CSSOM.CSSRule.SUPPORTS_RULE = 12;
+CSSOM.CSSRule.DOCUMENT_RULE = 13;
+CSSOM.CSSRule.FONT_FEATURE_VALUES_RULE = 14;
+CSSOM.CSSRule.VIEWPORT_RULE = 15;
+CSSOM.CSSRule.REGION_STYLE_RULE = 16;
+CSSOM.CSSRule.CONTAINER_RULE = 17;
+CSSOM.CSSRule.LAYER_BLOCK_RULE = 18;
+CSSOM.CSSRule.STARTING_STYLE_RULE = 1002;
+
 Object.defineProperties(CSSOM.CSSRule.prototype, {
 
   constructor: { value: CSSOM.CSSRule },
@@ -348,7 +358,7 @@ Object.defineProperties(CSSOM.CSSRule.prototype, {
   CONTAINER_RULE: { value: 17, enumerable: true },
   LAYER_BLOCK_RULE: { value: 18, enumerable: true },
   STARTING_STYLE_RULE: { value: 1002, enumerable: true },
-})
+});
 
 
 
@@ -422,10 +432,41 @@ CSSOM.CSSGroupingRule.prototype.constructor = CSSOM.CSSGroupingRule;
  * @return {number} The index within the grouping rule's collection of the newly inserted rule.
  */
  CSSOM.CSSGroupingRule.prototype.insertRule = function insertRule(rule, index) {
-	if (index < 0 || index > this.cssRules.length) {
-		errorUtils.throwIndexSizeError(this);
+	if (rule === undefined && index === undefined) {
+		errorUtils.throwMissingArguments(this, 'insertRule', this.constructor.name);
 	}
-	var cssRule = CSSOM.parse(rule).cssRules[0];
+	if (index === void 0) {
+		index = 0;
+	}
+	index = Number(index);
+	if (index < 0) {
+		index = 4294967296 + index;
+	}
+	if (index > this.cssRules.length) {
+		errorUtils.throwIndexError(this, 'insertRule', this.constructor.name, index, this.cssRules.length);
+	}
+	
+	var ruleToParse = String(rule);
+	var parsedSheet = CSSOM.parse(ruleToParse);
+	if (parsedSheet.cssRules.length !== 1) {
+		errorUtils.throwParseError(this, 'insertRule', this.constructor.name, ruleToParse, 'SyntaxError');
+	}
+	var cssRule = parsedSheet.cssRules[0];
+	
+	// Check for rules that cannot be inserted inside a CSSGroupingRule
+	if (cssRule.constructor.name === 'CSSImportRule' || cssRule.constructor.name === 'CSSNamespaceRule') {
+		var ruleKeyword = cssRule.constructor.name === 'CSSImportRule' ? '@import' : '@namespace';
+		errorUtils.throwError(this, 'DOMException', 
+			"Failed to execute 'insertRule' on '" + this.constructor.name + "': " +
+			"'" + ruleKeyword + "' rules cannot be inserted inside a group rule.",
+			'HierarchyRequestError');
+	}
+	
+	// Check for CSSLayerStatementRule (@layer statement rules)
+	if (cssRule.constructor.name === 'CSSLayerStatementRule') {
+		errorUtils.throwParseError(this, 'insertRule', this.constructor.name, ruleToParse, 'SyntaxError');
+	}
+	
 	cssRule.__parentRule = this;
 	this.cssRules.splice(index, 0, cssRule);
 	return index;
@@ -444,8 +485,15 @@ CSSOM.CSSGroupingRule.prototype.constructor = CSSOM.CSSGroupingRule;
  * @see https://www.w3.org/TR/cssom-1/#dom-cssgroupingrule-deleterule
  */
  CSSOM.CSSGroupingRule.prototype.deleteRule = function deleteRule(index) {
-	if (index < 0 || index >= this.cssRules.length) {
-		errorUtils.throwIndexSizeError(this);
+	if (index === undefined) {
+		errorUtils.throwMissingArguments(this, 'deleteRule', this.constructor.name);
+	}
+	index = Number(index);
+	if (index < 0) {
+		index = 4294967296 + index;
+	}
+	if (index >= this.cssRules.length) {
+		errorUtils.throwIndexError(this, 'deleteRule', this.constructor.name, index, this.cssRules.length);
 	}
 	this.cssRules.splice(index, 1)[0].__parentRule = null;
 };
@@ -542,7 +590,7 @@ Object.defineProperty(CSSOM.CSSStyleRule.prototype, "cssText", {
 				valuesArr.push(this.cssRules.map(function(rule){ return rule.cssText }).join("\n  "));
 				values = valuesArr.join("\n  ") + "\n}"
 			} else {
-				values = " { " + this.style.cssText + " }";
+				values = " {" + (this.style.cssText ? " " + this.style.cssText : "") + " }";
 			}
 			text = this.selectorText + values;
 		} else {
@@ -899,7 +947,7 @@ CSSOM.CSSImportRule.prototype.type = 3;
 Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
   get: function() {
     var mediaText = this.media.mediaText;
-    return "@import url(" + this.href + ")" + (this.layerName !== null ? " layer" + (this.layerName && "(" + this.layerName + ")") : "" ) + (this.supportsText ? " supports(" + this.supportsText + ")" : "" ) + (mediaText ? " " + mediaText : "") + ";";
+    return "@import url(\"" + this.href + "\")" + (this.layerName !== null ? " layer" + (this.layerName && "(" + this.layerName + ")") : "" ) + (this.supportsText ? " supports(" + this.supportsText + ")" : "" ) + (mediaText ? " " + mediaText : "") + ";";
   },
   set: function(cssText) {
     var i = 0;
@@ -917,7 +965,7 @@ Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
     var index;
 
     var layerRegExp = /layer\(([^)]*)\)/;
-    var layerRuleNameRegExp = /^(-?[_a-zA-Z]+[_a-zA-Z0-9-]*)$/;
+    var layerRuleNameRegExp = /^(-?[_a-zA-Z]+(\.[_a-zA-Z]+)*[_a-zA-Z0-9-]*)$/;
     var supportsRegExp = /supports\(([^)]+)\)/;
     var doubleOrMoreSpacesRegExp = /\s{2,}/g;
 
@@ -1000,12 +1048,12 @@ Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
 
                 if (layerMatch) {
                   var layerName = layerMatch[1].trim();
-                  bufferTrimmed = bufferTrimmed.replace(layerRegExp, '')
-                    .replace(doubleOrMoreSpacesRegExp, ' ') // Replace double or more spaces with single space
-                    .trim();
 
                   if (layerName.match(layerRuleNameRegExp) !== null) {
                     this.layerName = layerMatch[1].trim();
+                    bufferTrimmed = bufferTrimmed.replace(layerRegExp, '')
+                      .replace(doubleOrMoreSpacesRegExp, ' ') // Replace double or more spaces with single space
+                      .trim();
                   } else {
                     // REVIEW: In the browser, an empty layer() is not processed as a unamed layer
                     // and treats the rest of the string as mediaText, ignoring the parse of supports()
@@ -1156,7 +1204,7 @@ Object.defineProperty(CSSOM.CSSFontFaceRule.prototype, "style", {
 // http://www.opensource.apple.com/source/WebCore/WebCore-955.66.1/css/WebKitCSSFontFaceRule.cpp
 Object.defineProperty(CSSOM.CSSFontFaceRule.prototype, "cssText", {
   get: function() {
-    return "@font-face { " + this.style.cssText + " }";
+    return "@font-face {" + (this.style.cssText ? " " + this.style.cssText : "") + " }";
   }
 });
 
@@ -1279,24 +1327,112 @@ CSSOM.CSSStyleSheet.prototype.constructor = CSSOM.CSSStyleSheet;
  */
 CSSOM.CSSStyleSheet.prototype.insertRule = function(rule, index) {
 	if (rule === undefined && index === undefined) {
-		errorUtils.throwMissingArguments(this, 'insertRule', 'CSSStyleSheet');
+		errorUtils.throwMissingArguments(this, 'insertRule', this.constructor.name);
 	}
 	if (index === void 0) {
 		index = 0;
 	}
-	if (index < 0 || index > this.cssRules.length) {
-		errorUtils.throwIndexSizeError(this);
+	index = Number(index);
+	if (index < 0) {
+		index = 4294967296 + index;
 	}
+	if (index > this.cssRules.length) {
+		errorUtils.throwIndexError(this, 'insertRule', this.constructor.name, index, this.cssRules.length);
+	}
+	
 	var ruleToParse = String(rule);
 	var parsedSheet = CSSOM.parse(ruleToParse);
 	if (parsedSheet.cssRules.length !== 1) {
-		var domExceptionName = "SyntaxError";
-		if (ruleToParse.trimStart().startsWith('@namespace')) {
-			domExceptionName = "InvalidStateError";
-		}
-		errorUtils.throwParseError(this, 'insertRule', 'CSSStyleSheet', ruleToParse, domExceptionName);
+		errorUtils.throwParseError(this, 'insertRule', this.constructor.name, ruleToParse, 'SyntaxError');
 	}
 	var cssRule = parsedSheet.cssRules[0];
+	
+	// Helper function to find the last index of a specific rule constructor
+	function findLastIndexOfConstructor(rules, constructorName) {
+		for (var i = rules.length - 1; i >= 0; i--) {
+			if (rules[i].constructor.name === constructorName) {
+				return i;
+			}
+		}
+		return -1;
+	}
+	
+	// Helper function to find the first index of a rule that's NOT of specified constructors
+	function findFirstNonConstructorIndex(rules, constructorNames) {
+		for (var i = 0; i < rules.length; i++) {
+			if (constructorNames.indexOf(rules[i].constructor.name) === -1) {
+				return i;
+			}
+		}
+		return rules.length;
+	}
+	
+	// Validate rule ordering based on CSS specification
+	if (cssRule.constructor.name === 'CSSImportRule') {
+		// @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']);
+		if (firstLayerIndex < this.cssRules.length && this.cssRules[firstLayerIndex].constructor.name === 'CSSLayerStatementRule' && index > firstLayerIndex) {
+			errorUtils.throwError(this, 'DOMException',
+				"Failed to execute 'insertRule' on '" + this.constructor.name + "': Failed to insert the rule.",
+				'HierarchyRequestError');
+		}
+		
+		// Also cannot insert after @namespace or other rules
+		var firstNonImportIndex = findFirstNonConstructorIndex(this.cssRules, ['CSSImportRule']);
+		if (index > firstNonImportIndex && firstNonImportIndex < this.cssRules.length && 
+		    this.cssRules[firstNonImportIndex].constructor.name !== 'CSSLayerStatementRule') {
+			errorUtils.throwError(this, 'DOMException',
+				"Failed to execute 'insertRule' on '" + this.constructor.name + "': Failed to insert the rule.",
+				'HierarchyRequestError');
+		}
+	} else if (cssRule.constructor.name === 'CSSNamespaceRule') {
+		// @namespace rules can come after @layer and @import, but before any other rules
+		// They cannot come before @import rules
+		var firstImportIndex = -1;
+		for (var i = 0; i < this.cssRules.length; i++) {
+			if (this.cssRules[i].constructor.name === 'CSSImportRule') {
+				firstImportIndex = i;
+				break;
+			}
+		}
+		var firstNonImportNamespaceIndex = findFirstNonConstructorIndex(this.cssRules, [
+			'CSSLayerStatementRule', 
+			'CSSImportRule', 
+			'CSSNamespaceRule'
+		]);
+		
+		// Cannot insert before @import rules
+		if (firstImportIndex !== -1 && index <= firstImportIndex) {
+			errorUtils.throwError(this, 'DOMException',
+				"Failed to execute 'insertRule' on '" + this.constructor.name + "': Failed to insert the rule.",
+				'HierarchyRequestError');
+		}
+		
+		// Cannot insert after other types of rules
+		if (index > firstNonImportNamespaceIndex) {
+			errorUtils.throwError(this, 'DOMException',
+				"Failed to execute 'insertRule' on '" + this.constructor.name + "': Failed to insert the rule.",
+				'HierarchyRequestError');
+		}
+	} else if (cssRule.constructor.name === 'CSSLayerStatementRule') {
+		// @layer statement rules can be inserted anywhere before @import and @namespace
+		// No additional restrictions beyond what's already handled
+	} else {
+		// Any other rule cannot be inserted before @import and @namespace
+		var firstNonSpecialRuleIndex = findFirstNonConstructorIndex(this.cssRules, [
+			'CSSLayerStatementRule',
+			'CSSImportRule',
+			'CSSNamespaceRule'
+		]);
+		
+		if (index < firstNonSpecialRuleIndex) {
+			errorUtils.throwError(this, 'DOMException',
+				"Failed to execute 'insertRule' on '" + this.constructor.name + "': Failed to insert the rule.",
+				'HierarchyRequestError');
+		}
+	}
+	
 	cssRule.__parentStyleSheet = this;
 	this.cssRules.splice(index, 0, cssRule);
 	return index;
@@ -1318,21 +1454,21 @@ CSSOM.CSSStyleSheet.prototype.insertRule = function(rule, index) {
  */
 CSSOM.CSSStyleSheet.prototype.deleteRule = function(index) {
 	if (index === undefined) {
-		errorUtils.throwMissingArguments(this, 'deleteRule', 'CSSStyleSheet');
+		errorUtils.throwMissingArguments(this, 'deleteRule', this.constructor.name);
 	}
 	index = Number(index);
 	if (index < 0) {
 		index = 4294967296 + index;
 	}
 	if (index >= this.cssRules.length) {
-		errorUtils.throwIndexError(this, 'deleteRule', 'CSSStyleSheet', index, this.cssRules.length);
+		errorUtils.throwIndexError(this, 'deleteRule', this.constructor.name, index, this.cssRules.length);
 	}
 	if (this.cssRules[index] && this.cssRules[index].constructor.name == "CSSNamespaceRule") {
 		var shouldContinue = this.cssRules.every(function (rule) {
 			return ['CSSImportRule','CSSLayerStatementRule','CSSNamespaceRule'].indexOf(rule.constructor.name) !== -1
 		});
 		if (!shouldContinue) {
-			errorUtils.throwError(this, 'DOMException', "Failed to execute 'deleteRule' on 'CSSStyleSheet': Deleting a CSSNamespaceRule is not allowed when there is rules other than @import, @layer statement, or @namespace.", "InvalidStateError");
+			errorUtils.throwError(this, 'DOMException', "Failed to execute 'deleteRule' on '" + this.constructor.name + "': Failed to delete rule.", "InvalidStateError");
 		}
 	}
 	this.cssRules.splice(index, 1);
@@ -1616,7 +1752,7 @@ Object.defineProperty(CSSOM.CSSKeyframeRule.prototype, "style", {
 // http://www.opensource.apple.com/source/WebCore/WebCore-955.66.1/css/WebKitCSSKeyframeRule.cpp
 Object.defineProperty(CSSOM.CSSKeyframeRule.prototype, "cssText", {
   get: function() {
-    return this.keyText + " { " + this.style.cssText + " }";
+    return this.keyText + " {" + (this.style.cssText ? " " + this.style.cssText : "") + " }";
   }
 });
 
@@ -2150,10 +2286,16 @@ Object.defineProperties(CSSOM.CSSLayerStatementRule.prototype, {
 
 
 /**
- * @param {string} token
+ * Parses a CSS string and returns a CSSOM.CSSStyleSheet object representing the parsed stylesheet.
+ *
+ * @param {string} token - The CSS string to parse.
+ * @param {object} [opts] - Optional parsing options.
+ * @param {object} [opts.globalObject] - An optional global object to attach to the stylesheet. Useful on jsdom webplatform tests.
+ * @param {function|boolean} [errorHandler] - Optional error handler function or `true` to use `console.error`.
+ * @returns {CSSOM.CSSStyleSheet} The parsed CSSStyleSheet object.
  */
-CSSOM.parse = function parse(token, errorHandler) {
-	errorHandler = errorHandler === undefined ? (console && console.error) : errorHandler;
+CSSOM.parse = function parse(token, opts, errorHandler) {
+	errorHandler = errorHandler === true ? (console && console.error) : errorHandler;
 
 	var i = 0;
 
@@ -2195,6 +2337,10 @@ CSSOM.parse = function parse(token, errorHandler) {
 
 	var styleSheet = new CSSOM.CSSStyleSheet();
 
+	if (opts && opts.globalObject) {
+		styleSheet.__globalObject = opts.globalObject;
+	}
+
 	// @type CSSStyleSheet|CSSMediaRule|CSSContainerRule|CSSSupportsRule|CSSFontFaceRule|CSSKeyframesRule|CSSDocumentRule
 	var currentScope = styleSheet;
 
@@ -2892,7 +3038,7 @@ CSSOM.parse = function parse(token, errorHandler) {
 					i += "font-face".length;
 					fontFaceRule = new CSSOM.CSSFontFaceRule();
 					fontFaceRule.__starts = i;
-				}, parentRule && parentRule.constructor.name === "CSSStyleRule" );
+				}, true);
 				break;
 			} else {
 				atKeyframesRegExp.lastIndex = i;

package/lib/CSSFontFaceRule.js

@@ -45,7 +45,7 @@ Object.defineProperty(CSSOM.CSSFontFaceRule.prototype, "style", {
 // http://www.opensource.apple.com/source/WebCore/WebCore-955.66.1/css/WebKitCSSFontFaceRule.cpp
 Object.defineProperty(CSSOM.CSSFontFaceRule.prototype, "cssText", {
   get: function() {
-    return "@font-face { " + this.style.cssText + " }";
+    return "@font-face {" + (this.style.cssText ? " " + this.style.cssText : "") + " }";
   }
 });
 

package/lib/CSSGroupingRule.js

@@ -37,10 +37,41 @@ CSSOM.CSSGroupingRule.prototype.constructor = CSSOM.CSSGroupingRule;
  * @return {number} The index within the grouping rule's collection of the newly inserted rule.
  */
  CSSOM.CSSGroupingRule.prototype.insertRule = function insertRule(rule, index) {
-	if (index < 0 || index > this.cssRules.length) {
-		errorUtils.throwIndexSizeError(this);
+	if (rule === undefined && index === undefined) {
+		errorUtils.throwMissingArguments(this, 'insertRule', this.constructor.name);
 	}
-	var cssRule = CSSOM.parse(rule).cssRules[0];
+	if (index === void 0) {
+		index = 0;
+	}
+	index = Number(index);
+	if (index < 0) {
+		index = 4294967296 + index;
+	}
+	if (index > this.cssRules.length) {
+		errorUtils.throwIndexError(this, 'insertRule', this.constructor.name, index, this.cssRules.length);
+	}
+	
+	var ruleToParse = String(rule);
+	var parsedSheet = CSSOM.parse(ruleToParse);
+	if (parsedSheet.cssRules.length !== 1) {
+		errorUtils.throwParseError(this, 'insertRule', this.constructor.name, ruleToParse, 'SyntaxError');
+	}
+	var cssRule = parsedSheet.cssRules[0];
+	
+	// Check for rules that cannot be inserted inside a CSSGroupingRule
+	if (cssRule.constructor.name === 'CSSImportRule' || cssRule.constructor.name === 'CSSNamespaceRule') {
+		var ruleKeyword = cssRule.constructor.name === 'CSSImportRule' ? '@import' : '@namespace';
+		errorUtils.throwError(this, 'DOMException', 
+			"Failed to execute 'insertRule' on '" + this.constructor.name + "': " +
+			"'" + ruleKeyword + "' rules cannot be inserted inside a group rule.",
+			'HierarchyRequestError');
+	}
+	
+	// Check for CSSLayerStatementRule (@layer statement rules)
+	if (cssRule.constructor.name === 'CSSLayerStatementRule') {
+		errorUtils.throwParseError(this, 'insertRule', this.constructor.name, ruleToParse, 'SyntaxError');
+	}
+	
 	cssRule.__parentRule = this;
 	this.cssRules.splice(index, 0, cssRule);
 	return index;
@@ -59,8 +90,15 @@ CSSOM.CSSGroupingRule.prototype.constructor = CSSOM.CSSGroupingRule;
  * @see https://www.w3.org/TR/cssom-1/#dom-cssgroupingrule-deleterule
  */
  CSSOM.CSSGroupingRule.prototype.deleteRule = function deleteRule(index) {
-	if (index < 0 || index >= this.cssRules.length) {
-		errorUtils.throwIndexSizeError(this);
+	if (index === undefined) {
+		errorUtils.throwMissingArguments(this, 'deleteRule', this.constructor.name);
+	}
+	index = Number(index);
+	if (index < 0) {
+		index = 4294967296 + index;
+	}
+	if (index >= this.cssRules.length) {
+		errorUtils.throwIndexError(this, 'deleteRule', this.constructor.name, index, this.cssRules.length);
 	}
 	this.cssRules.splice(index, 1)[0].__parentRule = null;
 };

package/lib/CSSImportRule.js

@@ -28,7 +28,7 @@ CSSOM.CSSImportRule.prototype.type = 3;
 Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
   get: function() {
     var mediaText = this.media.mediaText;
-    return "@import url(" + this.href + ")" + (this.layerName !== null ? " layer" + (this.layerName && "(" + this.layerName + ")") : "" ) + (this.supportsText ? " supports(" + this.supportsText + ")" : "" ) + (mediaText ? " " + mediaText : "") + ";";
+    return "@import url(\"" + this.href + "\")" + (this.layerName !== null ? " layer" + (this.layerName && "(" + this.layerName + ")") : "" ) + (this.supportsText ? " supports(" + this.supportsText + ")" : "" ) + (mediaText ? " " + mediaText : "") + ";";
   },
   set: function(cssText) {
     var i = 0;
@@ -46,7 +46,7 @@ Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
     var index;
 
     var layerRegExp = /layer\(([^)]*)\)/;
-    var layerRuleNameRegExp = /^(-?[_a-zA-Z]+[_a-zA-Z0-9-]*)$/;
+    var layerRuleNameRegExp = /^(-?[_a-zA-Z]+(\.[_a-zA-Z]+)*[_a-zA-Z0-9-]*)$/;
     var supportsRegExp = /supports\(([^)]+)\)/;
     var doubleOrMoreSpacesRegExp = /\s{2,}/g;
 
@@ -129,12 +129,12 @@ Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
 
                 if (layerMatch) {
                   var layerName = layerMatch[1].trim();
-                  bufferTrimmed = bufferTrimmed.replace(layerRegExp, '')
-                    .replace(doubleOrMoreSpacesRegExp, ' ') // Replace double or more spaces with single space
-                    .trim();
 
                   if (layerName.match(layerRuleNameRegExp) !== null) {
                     this.layerName = layerMatch[1].trim();
+                    bufferTrimmed = bufferTrimmed.replace(layerRegExp, '')
+                      .replace(doubleOrMoreSpacesRegExp, ' ') // Replace double or more spaces with single space
+                      .trim();
                   } else {
                     // REVIEW: In the browser, an empty layer() is not processed as a unamed layer
                     // and treats the rest of the string as mediaText, ignoring the parse of supports()

package/lib/CSSKeyframeRule.js

@@ -46,7 +46,7 @@ Object.defineProperty(CSSOM.CSSKeyframeRule.prototype, "style", {
 // http://www.opensource.apple.com/source/WebCore/WebCore-955.66.1/css/WebKitCSSKeyframeRule.cpp
 Object.defineProperty(CSSOM.CSSKeyframeRule.prototype, "cssText", {
   get: function() {
-    return this.keyText + " { " + this.style.cssText + " }";
+    return this.keyText + " {" + (this.style.cssText ? " " + this.style.cssText : "") + " }";
   }
 });
 

package/lib/CSSRule.js

@@ -12,6 +12,27 @@ CSSOM.CSSRule = function CSSRule() {
   this.__parentStyleSheet = null;
 };
 
+CSSOM.CSSRule.UNKNOWN_RULE = 0; // obsolete
+CSSOM.CSSRule.STYLE_RULE = 1;
+CSSOM.CSSRule.CHARSET_RULE = 2; // obsolete
+CSSOM.CSSRule.IMPORT_RULE = 3;
+CSSOM.CSSRule.MEDIA_RULE = 4;
+CSSOM.CSSRule.FONT_FACE_RULE = 5;
+CSSOM.CSSRule.PAGE_RULE = 6;
+CSSOM.CSSRule.KEYFRAMES_RULE = 7;
+CSSOM.CSSRule.KEYFRAME_RULE = 8;
+CSSOM.CSSRule.MARGIN_RULE = 9;
+CSSOM.CSSRule.NAMESPACE_RULE = 10;
+CSSOM.CSSRule.COUNTER_STYLE_RULE = 11;
+CSSOM.CSSRule.SUPPORTS_RULE = 12;
+CSSOM.CSSRule.DOCUMENT_RULE = 13;
+CSSOM.CSSRule.FONT_FEATURE_VALUES_RULE = 14;
+CSSOM.CSSRule.VIEWPORT_RULE = 15;
+CSSOM.CSSRule.REGION_STYLE_RULE = 16;
+CSSOM.CSSRule.CONTAINER_RULE = 17;
+CSSOM.CSSRule.LAYER_BLOCK_RULE = 18;
+CSSOM.CSSRule.STARTING_STYLE_RULE = 1002;
+
 Object.defineProperties(CSSOM.CSSRule.prototype, {
 
   constructor: { value: CSSOM.CSSRule },
@@ -48,7 +69,7 @@ Object.defineProperties(CSSOM.CSSRule.prototype, {
   CONTAINER_RULE: { value: 17, enumerable: true },
   LAYER_BLOCK_RULE: { value: 18, enumerable: true },
   STARTING_STYLE_RULE: { value: 1002, enumerable: true },
-})
+});
 
 //.CommonJS
 exports.CSSRule = CSSOM.CSSRule;

package/lib/CSSStyleRule.js

@@ -66,7 +66,7 @@ Object.defineProperty(CSSOM.CSSStyleRule.prototype, "cssText", {
 				valuesArr.push(this.cssRules.map(function(rule){ return rule.cssText }).join("\n  "));
 				values = valuesArr.join("\n  ") + "\n}"
 			} else {
-				values = " { " + this.style.cssText + " }";
+				values = " {" + (this.style.cssText ? " " + this.style.cssText : "") + " }";
 			}
 			text = this.selectorText + values;
 		} else {

package/lib/CSSStyleSheet.js

@@ -39,24 +39,112 @@ CSSOM.CSSStyleSheet.prototype.constructor = CSSOM.CSSStyleSheet;
  */
 CSSOM.CSSStyleSheet.prototype.insertRule = function(rule, index) {
 	if (rule === undefined && index === undefined) {
-		errorUtils.throwMissingArguments(this, 'insertRule', 'CSSStyleSheet');
+		errorUtils.throwMissingArguments(this, 'insertRule', this.constructor.name);
 	}
 	if (index === void 0) {
 		index = 0;
 	}
-	if (index < 0 || index > this.cssRules.length) {
-		errorUtils.throwIndexSizeError(this);
+	index = Number(index);
+	if (index < 0) {
+		index = 4294967296 + index;
+	}
+	if (index > this.cssRules.length) {
+		errorUtils.throwIndexError(this, 'insertRule', this.constructor.name, index, this.cssRules.length);
 	}
+	
 	var ruleToParse = String(rule);
 	var parsedSheet = CSSOM.parse(ruleToParse);
 	if (parsedSheet.cssRules.length !== 1) {
-		var domExceptionName = "SyntaxError";
-		if (ruleToParse.trimStart().startsWith('@namespace')) {
-			domExceptionName = "InvalidStateError";
-		}
-		errorUtils.throwParseError(this, 'insertRule', 'CSSStyleSheet', ruleToParse, domExceptionName);
+		errorUtils.throwParseError(this, 'insertRule', this.constructor.name, ruleToParse, 'SyntaxError');
 	}
 	var cssRule = parsedSheet.cssRules[0];
+	
+	// Helper function to find the last index of a specific rule constructor
+	function findLastIndexOfConstructor(rules, constructorName) {
+		for (var i = rules.length - 1; i >= 0; i--) {
+			if (rules[i].constructor.name === constructorName) {
+				return i;
+			}
+		}
+		return -1;
+	}
+	
+	// Helper function to find the first index of a rule that's NOT of specified constructors
+	function findFirstNonConstructorIndex(rules, constructorNames) {
+		for (var i = 0; i < rules.length; i++) {
+			if (constructorNames.indexOf(rules[i].constructor.name) === -1) {
+				return i;
+			}
+		}
+		return rules.length;
+	}
+	
+	// Validate rule ordering based on CSS specification
+	if (cssRule.constructor.name === 'CSSImportRule') {
+		// @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']);
+		if (firstLayerIndex < this.cssRules.length && this.cssRules[firstLayerIndex].constructor.name === 'CSSLayerStatementRule' && index > firstLayerIndex) {
+			errorUtils.throwError(this, 'DOMException',
+				"Failed to execute 'insertRule' on '" + this.constructor.name + "': Failed to insert the rule.",
+				'HierarchyRequestError');
+		}
+		
+		// Also cannot insert after @namespace or other rules
+		var firstNonImportIndex = findFirstNonConstructorIndex(this.cssRules, ['CSSImportRule']);
+		if (index > firstNonImportIndex && firstNonImportIndex < this.cssRules.length && 
+		    this.cssRules[firstNonImportIndex].constructor.name !== 'CSSLayerStatementRule') {
+			errorUtils.throwError(this, 'DOMException',
+				"Failed to execute 'insertRule' on '" + this.constructor.name + "': Failed to insert the rule.",
+				'HierarchyRequestError');
+		}
+	} else if (cssRule.constructor.name === 'CSSNamespaceRule') {
+		// @namespace rules can come after @layer and @import, but before any other rules
+		// They cannot come before @import rules
+		var firstImportIndex = -1;
+		for (var i = 0; i < this.cssRules.length; i++) {
+			if (this.cssRules[i].constructor.name === 'CSSImportRule') {
+				firstImportIndex = i;
+				break;
+			}
+		}
+		var firstNonImportNamespaceIndex = findFirstNonConstructorIndex(this.cssRules, [
+			'CSSLayerStatementRule', 
+			'CSSImportRule', 
+			'CSSNamespaceRule'
+		]);
+		
+		// Cannot insert before @import rules
+		if (firstImportIndex !== -1 && index <= firstImportIndex) {
+			errorUtils.throwError(this, 'DOMException',
+				"Failed to execute 'insertRule' on '" + this.constructor.name + "': Failed to insert the rule.",
+				'HierarchyRequestError');
+		}
+		
+		// Cannot insert after other types of rules
+		if (index > firstNonImportNamespaceIndex) {
+			errorUtils.throwError(this, 'DOMException',
+				"Failed to execute 'insertRule' on '" + this.constructor.name + "': Failed to insert the rule.",
+				'HierarchyRequestError');
+		}
+	} else if (cssRule.constructor.name === 'CSSLayerStatementRule') {
+		// @layer statement rules can be inserted anywhere before @import and @namespace
+		// No additional restrictions beyond what's already handled
+	} else {
+		// Any other rule cannot be inserted before @import and @namespace
+		var firstNonSpecialRuleIndex = findFirstNonConstructorIndex(this.cssRules, [
+			'CSSLayerStatementRule',
+			'CSSImportRule',
+			'CSSNamespaceRule'
+		]);
+		
+		if (index < firstNonSpecialRuleIndex) {
+			errorUtils.throwError(this, 'DOMException',
+				"Failed to execute 'insertRule' on '" + this.constructor.name + "': Failed to insert the rule.",
+				'HierarchyRequestError');
+		}
+	}
+	
 	cssRule.__parentStyleSheet = this;
 	this.cssRules.splice(index, 0, cssRule);
 	return index;
@@ -78,21 +166,21 @@ CSSOM.CSSStyleSheet.prototype.insertRule = function(rule, index) {
  */
 CSSOM.CSSStyleSheet.prototype.deleteRule = function(index) {
 	if (index === undefined) {
-		errorUtils.throwMissingArguments(this, 'deleteRule', 'CSSStyleSheet');
+		errorUtils.throwMissingArguments(this, 'deleteRule', this.constructor.name);
 	}
 	index = Number(index);
 	if (index < 0) {
 		index = 4294967296 + index;
 	}
 	if (index >= this.cssRules.length) {
-		errorUtils.throwIndexError(this, 'deleteRule', 'CSSStyleSheet', index, this.cssRules.length);
+		errorUtils.throwIndexError(this, 'deleteRule', this.constructor.name, index, this.cssRules.length);
 	}
 	if (this.cssRules[index] && this.cssRules[index].constructor.name == "CSSNamespaceRule") {
 		var shouldContinue = this.cssRules.every(function (rule) {
 			return ['CSSImportRule','CSSLayerStatementRule','CSSNamespaceRule'].indexOf(rule.constructor.name) !== -1
 		});
 		if (!shouldContinue) {
-			errorUtils.throwError(this, 'DOMException', "Failed to execute 'deleteRule' on 'CSSStyleSheet': Deleting a CSSNamespaceRule is not allowed when there is rules other than @import, @layer statement, or @namespace.", "InvalidStateError");
+			errorUtils.throwError(this, 'DOMException', "Failed to execute 'deleteRule' on '" + this.constructor.name + "': Failed to delete rule.", "InvalidStateError");
 		}
 	}
 	this.cssRules.splice(index, 1);

package/lib/errorUtils.js

@@ -2,27 +2,27 @@
 
 /**
  * Gets the appropriate error constructor from the global object context.
- * Tries to find the error constructor from parentStyleSheet._globalObject,
- * then from _globalObject, then falls back to the native constructor.
+ * Tries to find the error constructor from parentStyleSheet.__globalObject,
+ * then from __globalObject, then falls back to the native constructor.
  * 
  * @param {Object} context - The CSSOM object (rule, stylesheet, etc.)
  * @param {string} errorType - The error type ('TypeError', 'RangeError', 'DOMException', etc.)
  * @return {Function} The error constructor
  */
 function getErrorConstructor(context, errorType) {
-	// Try parentStyleSheet._globalObject first
-	if (context.parentStyleSheet && context.parentStyleSheet._globalObject && context.parentStyleSheet._globalObject[errorType]) {
-		return context.parentStyleSheet._globalObject[errorType];
+	// Try parentStyleSheet.__globalObject first
+	if (context.parentStyleSheet && context.parentStyleSheet.__globalObject && context.parentStyleSheet.__globalObject[errorType]) {
+		return context.parentStyleSheet.__globalObject[errorType];
 	}
 	
 	// Try __parentStyleSheet (alternative naming)
-	if (context.__parentStyleSheet && context.__parentStyleSheet._globalObject && context.__parentStyleSheet._globalObject[errorType]) {
-		return context.__parentStyleSheet._globalObject[errorType];
+	if (context.__parentStyleSheet && context.__parentStyleSheet.__globalObject && context.__parentStyleSheet.__globalObject[errorType]) {
+		return context.__parentStyleSheet.__globalObject[errorType];
 	}
 	
-	// Try _globalObject on the context itself
-	if (context._globalObject && context._globalObject[errorType]) {
-		return context._globalObject[errorType];
+	// Try __globalObject on the context itself
+	if (context.__globalObject && context.__globalObject[errorType]) {
+		return context.__globalObject[errorType];
 	}
 	
 	// Fall back to native constructor
@@ -63,16 +63,6 @@ function throwMissingArguments(context, methodName, objectName, required, provid
 	throwError(context, 'TypeError', message);
 }
 
-/**
- * Throws a RangeError for index out of bounds.
- * 
- * @param {Object} context - The CSSOM object
- * @param {string} [message] - Optional custom message, defaults to 'INDEX_SIZE_ERR'
- */
-function throwIndexSizeError(context, message) {
-	throwError(context, 'RangeError', message || 'INDEX_SIZE_ERR');
-}
-
 /**
  * Throws a DOMException for parse errors.
  * 
@@ -108,7 +98,6 @@ var errorUtils = {
 	getErrorConstructor: getErrorConstructor,
 	throwError: throwError,
 	throwMissingArguments: throwMissingArguments,
-	throwIndexSizeError: throwIndexSizeError,
 	throwParseError: throwParseError,
 	throwIndexError: throwIndexError
 };

package/lib/parse.js

@@ -4,10 +4,16 @@ var CSSOM = {};
 
 
 /**
- * @param {string} token
+ * Parses a CSS string and returns a CSSOM.CSSStyleSheet object representing the parsed stylesheet.
+ *
+ * @param {string} token - The CSS string to parse.
+ * @param {object} [opts] - Optional parsing options.
+ * @param {object} [opts.globalObject] - An optional global object to attach to the stylesheet. Useful on jsdom webplatform tests.
+ * @param {function|boolean} [errorHandler] - Optional error handler function or `true` to use `console.error`.
+ * @returns {CSSOM.CSSStyleSheet} The parsed CSSStyleSheet object.
  */
-CSSOM.parse = function parse(token, errorHandler) {
-	errorHandler = errorHandler === undefined ? (console && console.error) : errorHandler;
+CSSOM.parse = function parse(token, opts, errorHandler) {
+	errorHandler = errorHandler === true ? (console && console.error) : errorHandler;
 
 	var i = 0;
 
@@ -49,6 +55,10 @@ CSSOM.parse = function parse(token, errorHandler) {
 
 	var styleSheet = new CSSOM.CSSStyleSheet();
 
+	if (opts && opts.globalObject) {
+		styleSheet.__globalObject = opts.globalObject;
+	}
+
 	// @type CSSStyleSheet|CSSMediaRule|CSSContainerRule|CSSSupportsRule|CSSFontFaceRule|CSSKeyframesRule|CSSDocumentRule
 	var currentScope = styleSheet;
 
@@ -746,7 +756,7 @@ CSSOM.parse = function parse(token, errorHandler) {
 					i += "font-face".length;
 					fontFaceRule = new CSSOM.CSSFontFaceRule();
 					fontFaceRule.__starts = i;
-				}, parentRule && parentRule.constructor.name === "CSSStyleRule" );
+				}, true);
 				break;
 			} else {
 				atKeyframesRegExp.lastIndex = i;

package/package.json

@@ -7,7 +7,7 @@
     "parser",
     "styleSheet"
   ],
-  "version": "0.9.17",
+  "version": "0.9.19",
   "author": "Nikita Vasilyev <me@elv1s.ru>",
   "contributors": [
     "Acemir Sousa Mendes <acemirsm@gmail.com>"