@acemir/cssom 0.9.19 → 0.9.21

package/build/CSSOM.js

@@ -326,6 +326,12 @@ Object.defineProperties(CSSOM.CSSRule.prototype, {
 
   constructor: { value: CSSOM.CSSRule },
 
+  cssRule: {
+    value: "",
+    configurable: true,
+    enumerable: true
+  },
+
   parentRule: {
     get: function() {
       return this.__parentRule
@@ -364,6 +370,28 @@ Object.defineProperties(CSSOM.CSSRule.prototype, {
 
 
 
+/**
+ * @constructor
+ * @see https://drafts.csswg.org/cssom/#the-cssrulelist-interface
+ */
+CSSOM.CSSRuleList = function CSSRuleList(){
+  const arr = new Array();
+  Object.setPrototypeOf(arr, CSSOM.CSSRuleList.prototype);
+  return arr;
+};
+
+CSSOM.CSSRuleList.prototype = Object.create(Array.prototype);
+CSSOM.CSSRuleList.prototype.constructor = CSSOM.CSSRuleList;
+
+CSSOM.CSSRuleList.prototype.item = function(index) {
+    return this[index] || null;
+};
+
+
+
+
+
+
 /**
  * @constructor
  * @see https://drafts.csswg.org/css-nesting-1/
@@ -408,7 +436,7 @@ Object.defineProperty(CSSOM.CSSNestedDeclarations.prototype, "cssText", {
  */
 CSSOM.CSSGroupingRule = function CSSGroupingRule() {
 	CSSOM.CSSRule.call(this);
-	this.cssRules = [];
+	this.cssRules = new CSSOM.CSSRuleList();
 };
 
 CSSOM.CSSGroupingRule.prototype = new CSSOM.CSSRule();
@@ -525,13 +553,17 @@ CSSOM.CSSCounterStyleRule.prototype.type = 11;
  */
 CSSOM.CSSConditionRule = function CSSConditionRule() {
   CSSOM.CSSGroupingRule.call(this);
-  this.cssRules = [];
+  this.__conditionText = '';
 };
 
 CSSOM.CSSConditionRule.prototype = new CSSOM.CSSGroupingRule();
 CSSOM.CSSConditionRule.prototype.constructor = CSSOM.CSSConditionRule;
-CSSOM.CSSConditionRule.prototype.conditionText = ''
-CSSOM.CSSConditionRule.prototype.cssText = ''
+
+Object.defineProperty(CSSOM.CSSConditionRule.prototype, "conditionText", {
+  get: function () {
+    return this.__conditionText;
+  }
+});
 
 
 
@@ -562,7 +594,20 @@ Object.defineProperty(CSSOM.CSSStyleRule.prototype, "selectorText", {
 		return this.__selectorText;	
 	},
 	set: function(value) {
-		this.__selectorText = value;
+		if (typeof value === "string") {
+			var trimmedValue = value.trim();
+
+			if (trimmedValue === '') {
+				return;
+			}
+
+			// TODO: Setting invalid selectorText should be ignored
+			// There are some validations already on lib/parse.js
+			// but the same validations should be applied here.
+			// Check if we can move these validation logic to a shared function.
+
+			this.__selectorText = trimmedValue;
+		}
 	}
 });
 
@@ -599,9 +644,11 @@ Object.defineProperty(CSSOM.CSSStyleRule.prototype, "cssText", {
 		return text;
 	},
 	set: function(cssText) {
-		var rule = CSSOM.CSSStyleRule.parse(cssText);
-		this.__style = rule.style;
-		this.__selectorText = rule.selectorText;
+		if (typeof cssText === "string") {
+			var rule = CSSOM.CSSStyleRule.parse(cssText);
+			this.__style = rule.style;
+			this.selectorText = rule.selectorText;
+		}
 	}
 });
 
@@ -819,7 +866,7 @@ CSSOM.MediaList.prototype = {
  */
 CSSOM.CSSMediaRule = function CSSMediaRule() {
 	CSSOM.CSSConditionRule.call(this);
-	this.media = new CSSOM.MediaList();
+	this.__media = new CSSOM.MediaList();
 };
 
 CSSOM.CSSMediaRule.prototype = new CSSOM.CSSConditionRule();
@@ -828,16 +875,24 @@ CSSOM.CSSMediaRule.prototype.type = 4;
 
 // https://opensource.apple.com/source/WebCore/WebCore-7611.1.21.161.3/css/CSSMediaRule.cpp
 Object.defineProperties(CSSOM.CSSMediaRule.prototype, {
-  "conditionText": {
+  "media": {
     get: function() {
-      return this.media.mediaText;
+      return this.__media;
     },
     set: function(value) {
-      this.media.mediaText = value;
+      if (typeof value === "string") {
+        this.__media.mediaText = value;
+      } else {
+        this.__media = value;
+      }
     },
-    configurable: true,
     enumerable: true
   },
+  "conditionText": {
+    get: function() {
+      return this.media.mediaText;
+    }
+  },
   "cssText": {
     get: function() {
       var cssTexts = [];
@@ -870,27 +925,35 @@ CSSOM.CSSContainerRule.prototype.constructor = CSSOM.CSSContainerRule;
 CSSOM.CSSContainerRule.prototype.type = 17;
 
 Object.defineProperties(CSSOM.CSSContainerRule.prototype, {
-  "conditionText": {
-    get: function() {
-      return this.containerText;
-    },
-    set: function(value) {
-      this.containerText = value;
-    },
-    configurable: true,
-    enumerable: true
-  },
   "cssText": {
     get: function() {
       var cssTexts = [];
       for (var i=0, length=this.cssRules.length; i < length; i++) {
         cssTexts.push(this.cssRules[i].cssText);
       }
-      return "@container " + this.containerText + " {" + (cssTexts.length ? "\n  " + cssTexts.join("\n  ") : "") + "\n}";
+      return "@container " + this.conditionText + " {" + (cssTexts.length ? "\n  " + cssTexts.join("\n  ") : "") + "\n}";
     },
     configurable: true,
     enumerable: true
-  }
+  },
+  "containerName": {
+      get: function() {
+        var parts = this.conditionText.trim().split(/\s+/);
+        if (parts.length > 1 && parts[0] !== '(' && !parts[0].startsWith('(')) {
+          return parts[0];
+        }
+        return "";
+      }
+    },
+  "containerQuery": {
+      get: function() {
+        var parts = this.conditionText.trim().split(/\s+/);
+        if (parts.length > 1 && parts[0] !== '(' && !parts[0].startsWith('(')) {
+          return parts.slice(1).join(' ');
+        }
+        return this.conditionText;
+      }
+    },
 });
 
 
@@ -933,21 +996,25 @@ Object.defineProperty(CSSOM.CSSSupportsRule.prototype, "cssText", {
  */
 CSSOM.CSSImportRule = function CSSImportRule() {
 	CSSOM.CSSRule.call(this);
-	this.href = "";
-	this.media = new CSSOM.MediaList();
-  this.layerName = null;
-  this.supportsText = null;
-	this.styleSheet = new CSSOM.CSSStyleSheet();
+	this.__href = "";
+	this.__media = new CSSOM.MediaList();
+  this.__layerName = null;
+  this.__supportsText = null;
+	this.__styleSheet = new CSSOM.CSSStyleSheet();
 };
 
 CSSOM.CSSImportRule.prototype = new CSSOM.CSSRule();
 CSSOM.CSSImportRule.prototype.constructor = CSSOM.CSSImportRule;
-CSSOM.CSSImportRule.prototype.type = 3;
+
+Object.defineProperty(CSSOM.CSSImportRule.prototype, "type", {
+	value: 3,
+	writable: false
+});
 
 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.replace(/\\/g, '\\\\').replace(/"/g, '\\"') + "\")" + (this.layerName !== null ? " layer" + (this.layerName && "(" + this.layerName + ")") : "" ) + (this.supportsText ? " supports(" + this.supportsText + ")" : "" ) + (mediaText ? " " + mediaText : "") + ";";
   },
   set: function(cssText) {
     var i = 0;
@@ -966,8 +1033,40 @@ Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
 
     var layerRegExp = /layer\(([^)]*)\)/;
     var layerRuleNameRegExp = /^(-?[_a-zA-Z]+(\.[_a-zA-Z]+)*[_a-zA-Z0-9-]*)$/;
-    var supportsRegExp = /supports\(([^)]+)\)/;
     var doubleOrMoreSpacesRegExp = /\s{2,}/g;
+    
+    /**
+     * Extracts the content inside supports() handling nested parentheses.
+     * @param {string} text - The text to parse
+     * @returns {object|null} - {content: string, endIndex: number} or null if not found
+     */
+    function extractSupportsContent(text) {
+      var supportsIndex = text.indexOf('supports(');
+      if (supportsIndex !== 0) {
+        return null;
+      }
+      
+      var depth = 0;
+      var start = supportsIndex + 'supports('.length;
+      var i = start;
+      
+      for (; i < text.length; i++) {
+        if (text[i] === '(') {
+          depth++;
+        } else if (text[i] === ')') {
+          if (depth === 0) {
+            // Found the closing parenthesis for supports()
+            return {
+              content: text.slice(start, i),
+              endIndex: i
+            };
+          }
+          depth--;
+        }
+      }
+      
+      return null; // Unbalanced parentheses
+    }
 
     for (var character; (character = cssText.charAt(i)); i++) {
 
@@ -1008,7 +1107,7 @@ Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
                 url = url.slice(1, -1);
               }
             }
-            this.href = url;
+            this.__href = url;
             i = index;
             state = 'media';
           }
@@ -1020,7 +1119,7 @@ Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
             if (!index) {
               throw i + ": '\"' not found";
             }
-            this.href = cssText.slice(i + 1, index);
+            this.__href = cssText.slice(i + 1, index);
             i = index;
             state = 'media';
           }
@@ -1032,7 +1131,7 @@ Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
             if (!index) {
               throw i + ': "\'" not found';
             }
-            this.href = cssText.slice(i + 1, index);
+            this.__href = cssText.slice(i + 1, index);
             i = index;
             state = 'media';
           }
@@ -1050,7 +1149,7 @@ Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
                   var layerName = layerMatch[1].trim();
 
                   if (layerName.match(layerRuleNameRegExp) !== null) {
-                    this.layerName = layerMatch[1].trim();
+                    this.__layerName = layerMatch[1].trim();
                     bufferTrimmed = bufferTrimmed.replace(layerRegExp, '')
                       .replace(doubleOrMoreSpacesRegExp, ' ') // Replace double or more spaces with single space
                       .trim();
@@ -1063,19 +1162,19 @@ Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
                     }
                   }
                 } else {
-                  this.layerName = "";
+                  this.__layerName = "";
                   bufferTrimmed = bufferTrimmed.substring('layer'.length).trim()
                 }
               }
 
-              var supportsMatch =  bufferTrimmed.match(supportsRegExp);
+              var supportsResult = extractSupportsContent(bufferTrimmed);
 
-              if (supportsMatch && supportsMatch.index === 0) {
+              if (supportsResult) {
                 // REVIEW: In the browser, an empty supports() invalidates and ignores the entire @import rule
-                this.supportsText = supportsMatch[1].trim();
-                bufferTrimmed = bufferTrimmed.replace(supportsRegExp, '')
-                .replace(doubleOrMoreSpacesRegExp, ' ') // Replace double or more spaces with single space
-                .trim();
+                this.__supportsText = supportsResult.content.trim();
+                // Remove the entire supports(...) from the buffer
+                bufferTrimmed = bufferTrimmed.slice(0, 0) + bufferTrimmed.slice(supportsResult.endIndex + 1);
+                bufferTrimmed = bufferTrimmed.replace(doubleOrMoreSpacesRegExp, ' ').trim();
               }
 
               // REVIEW: In the browser, any invalid media is replaced with 'not all'
@@ -1096,6 +1195,43 @@ Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
   }
 });
 
+Object.defineProperty(CSSOM.CSSImportRule.prototype, "href", {
+  get: function() {
+    return this.__href;
+  }
+});
+
+Object.defineProperty(CSSOM.CSSImportRule.prototype, "media", {
+  get: function() {
+    return this.__media;
+  },
+	set: function(value) {
+		if (typeof value === "string") {
+			this.__media.mediaText = value;
+		} else {
+			this.__media = value;
+		}
+	}
+});
+
+Object.defineProperty(CSSOM.CSSImportRule.prototype, "layerName", {
+  get: function() {
+    return this.__layerName;
+  }
+});
+
+Object.defineProperty(CSSOM.CSSImportRule.prototype, "supportsText", {
+  get: function() {
+    return this.__supportsText;
+  }
+});
+
+Object.defineProperty(CSSOM.CSSImportRule.prototype, "styleSheet", {
+  get: function() {
+    return this.__styleSheet;
+  }
+});
+
 
 
 
@@ -1107,23 +1243,25 @@ Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
  */
 CSSOM.CSSNamespaceRule = function CSSNamespaceRule() {
 	CSSOM.CSSRule.call(this);
-	this.prefix = "";
-	this.namespaceURI = "";
-	this.styleSheet = new CSSOM.CSSStyleSheet();
+	this.__prefix = "";
+	this.__namespaceURI = "";
 };
 
 CSSOM.CSSNamespaceRule.prototype = new CSSOM.CSSRule();
 CSSOM.CSSNamespaceRule.prototype.constructor = CSSOM.CSSNamespaceRule;
-CSSOM.CSSNamespaceRule.prototype.type = 10;
+
+Object.defineProperty(CSSOM.CSSNamespaceRule.prototype, "type", {
+  value: 10,
+	writable: false
+});
 
 Object.defineProperty(CSSOM.CSSNamespaceRule.prototype, "cssText", {
   get: function() {
     return "@namespace" + (this.prefix && " " + this.prefix) + " url(\"" + this.namespaceURI + "\");";
   },
   set: function(cssText) {
-    // Reset prefix and namespaceURI
-    this.prefix = "";
-    this.namespaceURI = "";
+    var newPrefix = "";
+    var newNamespaceURI = "";
 
     // Remove @namespace and trim
     var text = cssText.trim();
@@ -1146,26 +1284,40 @@ Object.defineProperty(CSSOM.CSSNamespaceRule.prototype, "cssText", {
     if (match) {
       // If prefix is present
       if (match[1]) {
-        this.prefix = match[1];
+        newPrefix = match[1];
       }
       // If url(...) form with quotes
       if (typeof match[3] !== "undefined") {
-        this.namespaceURI = match[3];
+        newNamespaceURI = match[3];
       }
       // If url(...) form without quotes
       else if (typeof match[4] !== "undefined") {
-        this.namespaceURI = match[4].trim();
+        newNamespaceURI = match[4].trim();
       }
       // If quoted string form
       else if (typeof match[6] !== "undefined") {
-        this.namespaceURI = match[6];
+        newNamespaceURI = match[6];
       }
+
+      this.__prefix = newPrefix;
+      this.__namespaceURI = newNamespaceURI;
     } else {
       throw new DOMException("Invalid @namespace rule", "InvalidStateError");
     }
   }
 });
 
+Object.defineProperty(CSSOM.CSSNamespaceRule.prototype, "prefix", {
+  get: function() {
+    return this.__prefix;
+  }
+});
+
+Object.defineProperty(CSSOM.CSSNamespaceRule.prototype, "namespaceURI", {
+  get: function() {
+    return this.__namespaceURI;
+  }
+});
 
 
 
@@ -1219,7 +1371,7 @@ Object.defineProperty(CSSOM.CSSFontFaceRule.prototype, "cssText", {
  */
 CSSOM.CSSHostRule = function CSSHostRule() {
 	CSSOM.CSSRule.call(this);
-	this.cssRules = [];
+	this.cssRules = new CSSOM.CSSRuleList();
 };
 
 CSSOM.CSSHostRule.prototype = new CSSOM.CSSRule();
@@ -1249,11 +1401,10 @@ Object.defineProperty(CSSOM.CSSHostRule.prototype, "cssText", {
  * @see http://www.w3.org/TR/shadow-dom/#host-at-rule
  */
 CSSOM.CSSStartingStyleRule = function CSSStartingStyleRule() {
-	CSSOM.CSSRule.call(this);
-	this.cssRules = [];
+	CSSOM.CSSGroupingRule.call(this);
 };
 
-CSSOM.CSSStartingStyleRule.prototype = new CSSOM.CSSRule();
+CSSOM.CSSStartingStyleRule.prototype = new CSSOM.CSSGroupingRule();
 CSSOM.CSSStartingStyleRule.prototype.constructor = CSSOM.CSSStartingStyleRule;
 CSSOM.CSSStartingStyleRule.prototype.type = 1002;
 //FIXME
@@ -1280,10 +1431,23 @@ Object.defineProperty(CSSOM.CSSStartingStyleRule.prototype, "cssText", {
  * @see http://dev.w3.org/csswg/cssom/#the-stylesheet-interface
  */
 CSSOM.StyleSheet = function StyleSheet() {
+	this.__media = new CSSOM.MediaList();
 	this.__parentStyleSheet = null;
 };
 
 Object.defineProperties(CSSOM.StyleSheet.prototype, {
+	media: {
+		get: function() {
+			return this.__media;
+		},
+		set: function(value) {
+			if (typeof value === "string") {
+				this.__media.mediaText = value;
+			} else {
+				this.__media = value;
+			}
+		}
+	},
 	parentStyleSheet: {
 		get: function() {
 			return this.__parentStyleSheet;
@@ -1301,13 +1465,18 @@ Object.defineProperties(CSSOM.StyleSheet.prototype, {
  */
 CSSOM.CSSStyleSheet = function CSSStyleSheet() {
 	CSSOM.StyleSheet.call(this);
-	this.cssRules = [];
+	this.cssRules = new CSSOM.CSSRuleList();
 };
 
 
 CSSOM.CSSStyleSheet.prototype = new CSSOM.StyleSheet();
 CSSOM.CSSStyleSheet.prototype.constructor = CSSOM.CSSStyleSheet;
 
+Object.defineProperty(CSSOM.CSSStyleSheet.prototype, "rules", {
+	get: function() {
+		return this.cssRules;
+	}
+});
 
 /**
  * Used to insert a new rule into the style sheet. The new rule now becomes part of the cascade.
@@ -1341,7 +1510,10 @@ CSSOM.CSSStyleSheet.prototype.insertRule = function(rule, index) {
 	}
 	
 	var ruleToParse = String(rule);
-	var parsedSheet = CSSOM.parse(ruleToParse);
+	var parseErrors = [];
+	var parsedSheet = CSSOM.parse(ruleToParse, undefined, function(err) {
+		parseErrors.push(err);
+	} );
 	if (parsedSheet.cssRules.length !== 1) {
 		errorUtils.throwParseError(this, 'insertRule', this.constructor.name, ruleToParse, 'SyntaxError');
 	}
@@ -1409,12 +1581,21 @@ CSSOM.CSSStyleSheet.prototype.insertRule = function(rule, index) {
 				'HierarchyRequestError');
 		}
 		
+		// Cannot insert if there are already non-special rules
+		if (firstNonImportNamespaceIndex < this.cssRules.length) {
+			errorUtils.throwError(this, 'DOMException',
+				"Failed to execute 'insertRule' on '" + this.constructor.name + "': Failed to insert the rule.",
+				'InvalidStateError');
+		}
+		
 		// 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
@@ -1431,6 +1612,10 @@ CSSOM.CSSStyleSheet.prototype.insertRule = function(rule, index) {
 				"Failed to execute 'insertRule' on '" + this.constructor.name + "': Failed to insert the rule.",
 				'HierarchyRequestError');
 		}
+
+		if (parseErrors.length !== 0) {
+			errorUtils.throwParseError(this, 'insertRule', this.constructor.name, ruleToParse, 'SyntaxError');
+		}
 	}
 	
 	cssRule.__parentStyleSheet = this;
@@ -1438,6 +1623,13 @@ CSSOM.CSSStyleSheet.prototype.insertRule = function(rule, index) {
 	return index;
 };
 
+CSSOM.CSSStyleSheet.prototype.addRule = function(selector, styleBlock, index) {
+	if (index === void 0) {
+		index = this.cssRules.length;
+	}
+	this.insertRule(selector + "{" + styleBlock + "}", index);
+	return -1;
+};
 
 /**
  * Used to delete a rule from the style sheet.
@@ -1463,17 +1655,27 @@ CSSOM.CSSStyleSheet.prototype.deleteRule = function(index) {
 	if (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 '" + this.constructor.name + "': Failed to delete rule.", "InvalidStateError");
+	if (this.cssRules[index]) {		
+		if (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 '" + this.constructor.name + "': Failed to delete rule.", "InvalidStateError");
+			}
 		}
+		if (this.cssRules[index].constructor.name == "CSSImportRule") {
+			this.cssRules[index].styleSheet.__parentStyleSheet = null;
+		}
+
+		this.cssRules[index].__parentStyleSheet = null;
 	}
 	this.cssRules.splice(index, 1);
 };
 
+CSSOM.CSSStyleSheet.prototype.removeRule = function(index) {
+	this.deleteRule(index);
+};
 
 /**
  * NON-STANDARD
@@ -1500,7 +1702,7 @@ CSSOM.CSSStyleSheet.prototype.toString = function() {
 CSSOM.CSSKeyframesRule = function CSSKeyframesRule() {
 	CSSOM.CSSRule.call(this);
 	this.name = '';
-	this.cssRules = [];
+	this.cssRules = new CSSOM.CSSRuleList();
 	
 	// Set up initial indexed access
 	this._setupIndexedAccess();
@@ -1826,7 +2028,7 @@ CSSOM.MatcherList.prototype = {
 CSSOM.CSSDocumentRule = function CSSDocumentRule() {
     CSSOM.CSSRule.call(this);
     this.matcher = new CSSOM.MatcherList();
-    this.cssRules = [];
+    this.cssRules = new CSSOM.CSSRuleList();
 };
 
 CSSOM.CSSDocumentRule.prototype = new CSSOM.CSSRule();
@@ -2227,6 +2429,51 @@ CSSOM.CSSValueExpression.prototype._findMatchedIdx = function(token, idx, sep) {
 
 
 
+/**
+ * @constructor
+ * @see https://drafts.csswg.org/css-cascade-6/#cssscoperule
+ */
+CSSOM.CSSScopeRule = function CSSScopeRule() {
+  CSSOM.CSSGroupingRule.call(this);
+  this.__start = null;
+  this.__end = null;
+};
+
+CSSOM.CSSScopeRule.prototype = new CSSOM.CSSGroupingRule();
+CSSOM.CSSScopeRule.prototype.constructor = CSSOM.CSSScopeRule;
+
+
+Object.defineProperties(CSSOM.CSSScopeRule.prototype, {
+  type: {
+    value: 0,
+    writable: false,
+  },
+  cssText: {
+    get: function () {
+      var cssTexts = [];
+      for (var i = 0, length = this.cssRules.length; i < length; i++) {
+        cssTexts.push(this.cssRules[i].cssText);
+      }
+      return "@scope " + (this.start ? "(" + this.start + ") " : "") + (this.end ? "to (" + this.end + ") " : "") + "{" + (cssTexts.length ? "\n  " + cssTexts.join("\n  ") : "") + "\n}";
+    },
+    configurable: true,
+    enumerable: true,
+  },
+  start: {
+    get: function () {
+      return this.__start;
+    }
+  },
+  end: {
+    get: function () {
+      return this.__end;
+    }
+  }
+});
+
+
+
+
 /**
  * @constructor
  * @see https://drafts.csswg.org/css-cascade-5/#csslayerblockrule
@@ -2234,7 +2481,6 @@ CSSOM.CSSValueExpression.prototype._findMatchedIdx = function(token, idx, sep) {
 CSSOM.CSSLayerBlockRule = function CSSLayerBlockRule() {
   CSSOM.CSSGroupingRule.call(this);
   this.name = "";
-  this.cssRules = [];
 };
 
 CSSOM.CSSLayerBlockRule.prototype = new CSSOM.CSSGroupingRule();
@@ -2286,63 +2532,325 @@ Object.defineProperties(CSSOM.CSSLayerStatementRule.prototype, {
 
 
 /**
- * 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.
+ * @constructor
+ * @see https://drafts.csswg.org/cssom/#the-csspagerule-interface
  */
-CSSOM.parse = function parse(token, opts, errorHandler) {
-	errorHandler = errorHandler === true ? (console && console.error) : errorHandler;
+CSSOM.CSSPageRule = function CSSPageRule() {
+	CSSOM.CSSGroupingRule.call(this);
+	this.__style = new CSSOM.CSSStyleDeclaration();
+	this.__style.parentRule = this;
+};
 
-	var i = 0;
+CSSOM.CSSPageRule.prototype = new CSSOM.CSSGroupingRule();
+CSSOM.CSSPageRule.prototype.constructor = CSSOM.CSSPageRule;
 
-	/**
-		"before-selector" or
-		"selector" or
-		"atRule" or
-		"atBlock" or
-		"conditionBlock" or
-		"before-name" or
-		"name" or
-		"before-value" or
-		"value"
-	*/
-	var state = "before-selector";
+Object.defineProperty(CSSOM.CSSPageRule.prototype, "type", {
+	value: 6,
+	writable: false
+});
+
+Object.defineProperty(CSSOM.CSSPageRule.prototype, "selectorText", {
+    get: function() {
+        return this.__selectorText;	
+    },
+    set: function(value) {
+        if (typeof value === "string") {
+            var trimmedValue = value.trim();
+            
+            // Empty selector is valid for @page
+            if (trimmedValue === '') {
+                this.__selectorText = '';
+                return;
+            }
+            
+            // Parse @page selectorText for page name and pseudo-pages
+            // Valid formats:
+            // - (empty - no name, no pseudo-page)
+            // - :left, :right, :first, :blank (pseudo-page only)
+            // - named (named page only)
+            // - named:first (named page with single pseudo-page)
+            // - named:first:left (named page with multiple pseudo-pages)
+			var atPageRuleSelectorRegExp = /^([^\s:]+)?((?::\w+)*)$/;
+            var match = trimmedValue.match(atPageRuleSelectorRegExp);
+            if (match) {
+				var pageName = match[1] || '';
+                var pseudoPages = match[2] || '';
+
+				// Validate page name if present
+				if (pageName) {
+					var cssCustomIdentifierRegExp = /^(-?[_a-zA-Z]+(\.[_a-zA-Z]+)*[_a-zA-Z0-9-]*)$/; // Validates a css custom identifier
+					// Page name can be an identifier or a string
+					if (!cssCustomIdentifierRegExp.test(pageName)) {
+						return;
+					}
+				}
+                
+                // Validate pseudo-pages if present
+                if (pseudoPages) {
+                    var pseudos = pseudoPages.split(':').filter(function(p) { return p; });
+                    var validPseudos = ['left', 'right', 'first', 'blank'];
+                    var allValid = true;
+                    for (var j = 0; j < pseudos.length; j++) {
+                        if (validPseudos.indexOf(pseudos[j].toLowerCase()) === -1) {
+                            allValid = false;
+                            break;
+                        }
+                    }
+                    
+                    if (!allValid) {
+                        return; // Invalid pseudo-page, do nothing
+                    }
+                }
+                
+				this.__selectorText = pageName + pseudoPages.toLowerCase();
+            }
+        }
+    }
+});
+
+Object.defineProperty(CSSOM.CSSPageRule.prototype, "style", {
+	get: function() {
+		return this.__style;	
+	},
+	set: function(value) {
+		if (typeof value === "string") {
+			this.__style.cssText = value;
+		} else {
+			this.__style = value;
+		}
+	}
+});
+
+Object.defineProperty(CSSOM.CSSPageRule.prototype, "cssText", {
+	get: function() {
+        var values = ""
+        if (this.cssRules.length) {
+            var valuesArr = [" {"];
+            this.style.cssText && valuesArr.push(this.style.cssText);
+            valuesArr.push(this.cssRules.map(function(rule){ return rule.cssText }).join("\n  "));
+            values = valuesArr.join("\n  ") + "\n}"
+        } else {
+            values = " {" + (this.style.cssText ? " " + this.style.cssText : "") + " }";
+        }
+		return "@page" + (this.selectorText ? " " + this.selectorText : "") + values;
+	},
+	set: function(cssText) {
+		if (typeof value === "string") {
+			var rule = CSSOM.CSSPageRule.parse(cssText);
+			this.__style = rule.style;
+			this.selectorText = rule.selectorText;
+		}
+	}
+});
 
+/**
+ * NON-STANDARD
+ * lightweight version of parse.js.
+ * @param {string} ruleText
+ * @return CSSPageRule
+ */
+CSSOM.CSSPageRule.parse = function(ruleText) {
+	var i = 0;
+	var state = "selector";
 	var index;
+	var j = i;
 	var buffer = "";
-	var valueParenthesisDepth = 0;
 
 	var SIGNIFICANT_WHITESPACE = {
-		"name": true,
-		"before-name": true,
 		"selector": true,
-		"value": true,
-		"value-parenthesis": true,
-		"atRule": true,
-		"importRule-begin": true,
-		"importRule": true,
-		"namespaceRule-begin": true,
-		"namespaceRule": true,
-		"atBlock": true,
-		"containerBlock": true,
-		"conditionBlock": true,
-		"counterStyleBlock": true,
-		'documentRule-begin': true,
-		"layerBlock": true
+		"value": true
 	};
 
-	var styleSheet = new CSSOM.CSSStyleSheet();
+	var pageRule = new CSSOM.CSSPageRule();
+	var name, priority="";
 
-	if (opts && opts.globalObject) {
-		styleSheet.__globalObject = opts.globalObject;
-	}
+	for (var character; (character = ruleText.charAt(i)); i++) {
 
-	// @type CSSStyleSheet|CSSMediaRule|CSSContainerRule|CSSSupportsRule|CSSFontFaceRule|CSSKeyframesRule|CSSDocumentRule
-	var currentScope = styleSheet;
+		switch (character) {
+
+		case " ":
+		case "\t":
+		case "\r":
+		case "\n":
+		case "\f":
+			if (SIGNIFICANT_WHITESPACE[state]) {
+				// Squash 2 or more white-spaces in the row into 1
+				switch (ruleText.charAt(i - 1)) {
+					case " ":
+					case "\t":
+					case "\r":
+					case "\n":
+					case "\f":
+						break;
+					default:
+						buffer += " ";
+						break;
+				}
+			}
+			break;
+
+		// String
+		case '"':
+			j = i + 1;
+			index = ruleText.indexOf('"', j) + 1;
+			if (!index) {
+				throw '" is missing';
+			}
+			buffer += ruleText.slice(i, index);
+			i = index - 1;
+			break;
+
+		case "'":
+			j = i + 1;
+			index = ruleText.indexOf("'", j) + 1;
+			if (!index) {
+				throw "' is missing";
+			}
+			buffer += ruleText.slice(i, index);
+			i = index - 1;
+			break;
+
+		// Comment
+		case "/":
+			if (ruleText.charAt(i + 1) === "*") {
+				i += 2;
+				index = ruleText.indexOf("*/", i);
+				if (index === -1) {
+					throw new SyntaxError("Missing */");
+				} else {
+					i = index + 1;
+				}
+			} else {
+				buffer += character;
+			}
+			break;
+
+		case "{":
+			if (state === "selector") {
+				pageRule.selectorText = buffer.trim();
+				buffer = "";
+				state = "name";
+			}
+			break;
+
+		case ":":
+			if (state === "name") {
+				name = buffer.trim();
+				buffer = "";
+				state = "value";
+			} else {
+				buffer += character;
+			}
+			break;
+
+		case "!":
+			if (state === "value" && ruleText.indexOf("!important", i) === i) {
+				priority = "important";
+				i += "important".length;
+			} else {
+				buffer += character;
+			}
+			break;
+
+		case ";":
+			if (state === "value") {
+				pageRule.style.setProperty(name, buffer.trim(), priority);
+				priority = "";
+				buffer = "";
+				state = "name";
+			} else {
+				buffer += character;
+			}
+			break;
+
+		case "}":
+			if (state === "value") {
+				pageRule.style.setProperty(name, buffer.trim(), priority);
+				priority = "";
+				buffer = "";
+			} else if (state === "name") {
+				break;
+			} else {
+				buffer += character;
+			}
+			state = "selector";
+			break;
+
+		default:
+			buffer += character;
+			break;
+
+		}
+	}
+
+	return pageRule;
+
+};
+
+
+
+
+
+/**
+ * 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, opts, errorHandler) {
+	errorHandler = errorHandler === true ? (console && console.error) : errorHandler;
+
+	var i = 0;
+
+	/**
+		"before-selector" or
+		"selector" or
+		"atRule" or
+		"atBlock" or
+		"conditionBlock" or
+		"before-name" or
+		"name" or
+		"before-value" or
+		"value"
+	*/
+	var state = "before-selector";
+
+	var index;
+	var buffer = "";
+	var valueParenthesisDepth = 0;
+
+	var SIGNIFICANT_WHITESPACE = {
+		"name": true,
+		"before-name": true,
+		"selector": true,
+		"value": true,
+		"value-parenthesis": true,
+		"atRule": true,
+		"importRule-begin": true,
+		"importRule": true,
+		"namespaceRule-begin": true,
+		"namespaceRule": true,
+		"atBlock": true,
+		"containerBlock": true,
+		"conditionBlock": true,
+		"counterStyleBlock": true,
+		'documentRule-begin': true,
+		"scopeBlock": true,
+		"layerBlock": true,
+		"pageBlock": true
+	};
+
+	var styleSheet = new CSSOM.CSSStyleSheet();
+
+	if (opts && opts.globalObject) {
+		styleSheet.__globalObject = opts.globalObject;
+	}
+
+	// @type CSSStyleSheet|CSSMediaRule|CSSContainerRule|CSSSupportsRule|CSSFontFaceRule|CSSKeyframesRule|CSSDocumentRule
+	var currentScope = styleSheet;
 
 	// @type CSSMediaRule|CSSContainerRule|CSSSupportsRule|CSSKeyframesRule|CSSDocumentRule
 	var parentRule;
@@ -2350,7 +2858,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, layerBlockRule, layerStatementRule, nestedSelectorRule, namespaceRule;
+	var name, priority="", styleRule, mediaRule, containerRule, counterStyleRule, supportsRule, importRule, fontFaceRule, keyframesRule, documentRule, hostRule, startingStyleRule, scopeRule, pageRule, layerBlockRule, layerStatementRule, nestedSelectorRule, namespaceRule;
 
 	// Track defined namespace prefixes for validation
 	var definedNamespacePrefixes = {};
@@ -2360,11 +2868,13 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 	// var atRulesStatemenRegExp = /(?<!{.*)[;}]\s*/; // Match a statement by verifying it finds a semicolon or closing brace not followed by another semicolon or closing brace
 	var beforeRulePortionRegExp = /{(?!.*{)|}(?!.*})|;(?!.*;)|\*\/(?!.*\*\/)/g; // Match the closest allowed character (a opening or closing brace, a semicolon or a comment ending) before the rule
 	var beforeRuleValidationRegExp = /^[\s{};]*(\*\/\s*)?$/; // Match that the portion before the rule is empty or contains only whitespace, semicolons, opening/closing braces, and optionally a comment ending (*/) followed by whitespace
-	var forwardRuleValidationRegExp = /(?:\(|\s|\/\*)/; // Match that the rule is followed by any whitespace, a opening comment or a condition opening parenthesis
+	var forwardRuleValidationRegExp = /(?:\s|\/\*|\{|\()/; // Match that the rule is followed by any whitespace, a opening comment, a condition opening parenthesis or a opening brace
 	var forwardImportRuleValidationRegExp = /(?:\s|\/\*|'|")/; // Match that the rule is followed by any whitespace, an opening comment, a single quote or double quote
 	var forwardRuleClosingBraceRegExp = /{[^{}]*}|}/; // Finds the next closing brace of a rule block
 	var forwardRuleSemicolonAndOpeningBraceRegExp = /^.*?({|;)/; // Finds the next semicolon or opening brace after the at-rule	
-	var layerRuleNameRegExp = /^(-?[_a-zA-Z]+(\.[_a-zA-Z]+)*[_a-zA-Z0-9-]*)$/; // Validates a single @layer name
+	var cssCustomIdentifierRegExp = /^(-?[_a-zA-Z]+(\.[_a-zA-Z]+)*[_a-zA-Z0-9-]*)$/; // Validates a css custom identifier
+	var startsWithCombinatorRegExp = /^\s*[>+~]/; // Checks if a selector starts with a CSS combinator (>, +, ~)
+	var atPageRuleSelectorRegExp = /^([^\s:]+)?((?::\w+)*)$/;
 
 	/**
 	 * Searches for the first occurrence of a CSS at-rule statement terminator (`;` or `}`) 
@@ -2456,24 +2966,214 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 		return i;	
 	}
 
-	var parseError = function(message) {
-		var lines = token.substring(0, i).split('\n');
-		var lineCount = lines.length;
-		var charCount = lines.pop().length + 1;
-		var error = new Error(message + ' (line ' + lineCount + ', char ' + charCount + ')');
-		error.line = lineCount;
-		/* jshint sub : true */
-		error['char'] = charCount;
-		error.styleSheet = styleSheet;
-		// Print the error but continue parsing the sheet
-		try {
-			throw error;
-		} catch(e) {
-			errorHandler && errorHandler(e);
+	/**
+	 * Parses the scope prelude and extracts start and end selectors.
+	 * @param {string} preludeContent - The scope prelude content (without @scope keyword)
+	 * @returns {object} Object with startSelector and endSelector properties
+	 */
+	function parseScopePrelude(preludeContent) {
+		var parts = preludeContent.split(/\s*\)\s*to\s+\(/);
+		
+		// Restore the parentheses that were consumed by the split
+		if (parts.length === 2) {
+			parts[0] = parts[0] + ')';
+			parts[1] = '(' + parts[1];
 		}
+		
+		var hasStart = parts[0] &&
+			parts[0].charAt(0) === '(' &&
+			parts[0].charAt(parts[0].length - 1) === ')';
+		var hasEnd = parts[1] &&
+			parts[1].charAt(0) === '(' &&
+			parts[1].charAt(parts[1].length - 1) === ')';
+		
+		// Handle case: @scope to (<end>)
+		var hasOnlyEnd = !hasStart &&
+			!hasEnd &&
+			parts[0].indexOf('to (') === 0 &&
+			parts[0].charAt(parts[0].length - 1) === ')';
+		
+		var startSelector = '';
+		var endSelector = '';
+		
+		if (hasStart) {
+			startSelector = parts[0].slice(1, -1).trim();
+		}
+		if (hasEnd) {
+			endSelector = parts[1].slice(1, -1).trim();
+		}
+		if (hasOnlyEnd) {
+			endSelector = parts[0].slice(4, -1).trim();
+		}
+		
+		return {
+			startSelector: startSelector,
+			endSelector: endSelector,
+			hasStart: hasStart,
+			hasEnd: hasEnd,
+			hasOnlyEnd: hasOnlyEnd
+		};
 	};
 
-	var validateAtRule = function(atRuleKey, validCallback, cannotBeNested) {
+	/**
+	 * Checks if a selector contains pseudo-elements.
+	 * @param {string} selector - The CSS selector to check
+	 * @returns {boolean} True if the selector contains pseudo-elements
+	 */
+	function hasPseudoElement(selector) {
+		// Match only double-colon (::) pseudo-elements
+		// Also match legacy single-colon pseudo-elements: :before, :after, :first-line, :first-letter
+		// These must NOT be followed by alphanumeric characters (to avoid matching :before-x or similar)
+		var pseudoElementRegex = /::[a-zA-Z][\w-]*|:(before|after|first-line|first-letter)(?![a-zA-Z0-9_-])/;
+		return pseudoElementRegex.test(selector);
+	};
+
+	/**
+	 * Validates balanced parentheses, brackets, and quotes in a selector.
+	 * 
+	 * @param {string} selector - The CSS selector to validate
+	 * @param {boolean} trackAttributes - Whether to track attribute selector context
+	 * @param {boolean} useStack - Whether to use a stack for parentheses (needed for nested validation)
+	 * @returns {boolean} True if the syntax is valid (all brackets, parentheses, and quotes are balanced)
+	 */
+	function validateBalancedSyntax(selector, trackAttributes, useStack) {
+		var parenDepth = 0;
+		var bracketDepth = 0;
+		var inSingleQuote = false;
+		var inDoubleQuote = false;
+		var inAttr = false;
+		var stack = useStack ? [] : null;
+		
+		for (var i = 0; i < selector.length; i++) {
+			var char = selector[i];
+			var prevChar = i > 0 ? selector[i - 1] : '';
+			
+			if (inSingleQuote) {
+				if (char === "'" && prevChar !== "\\") {
+					inSingleQuote = false;
+				}
+			} else if (inDoubleQuote) {
+				if (char === '"' && prevChar !== "\\") {
+					inDoubleQuote = false;
+				}
+			} else if (trackAttributes && inAttr) {
+				if (char === "]") {
+					inAttr = false;
+				} else if (char === "'") {
+					inSingleQuote = true;
+				} else if (char === '"') {
+					inDoubleQuote = true;
+				}
+			} else {
+				if (trackAttributes && char === "[") {
+					inAttr = true;
+				} else if (char === "'") {
+					inSingleQuote = true;
+				} else if (char === '"') {
+					inDoubleQuote = true;
+				} else if (char === '(') {
+					if (useStack) {
+						stack.push("(");
+					} else {
+						parenDepth++;
+					}
+				} else if (char === ')') {
+					if (useStack) {
+						if (!stack.length || stack.pop() !== "(") {
+							return false;
+						}
+					} else {
+						parenDepth--;
+						if (parenDepth < 0) {
+							return false;
+						}
+					}
+				} else if (char === '[') {
+					bracketDepth++;
+				} else if (char === ']') {
+					bracketDepth--;
+					if (bracketDepth < 0) {
+						return false;
+					}
+				}
+			}
+		}
+		
+		// Check if everything is balanced
+		if (useStack) {
+			return stack.length === 0 && bracketDepth === 0 && !inSingleQuote && !inDoubleQuote && !inAttr;
+		} else {
+			return parenDepth === 0 && bracketDepth === 0 && !inSingleQuote && !inDoubleQuote;
+		}
+	};
+
+	/**
+	 * Checks for basic syntax errors in selectors (mismatched parentheses, brackets, quotes).
+	 * @param {string} selector - The CSS selector to check
+	 * @returns {boolean} True if there are syntax errors
+	 */
+	function hasBasicSyntaxError(selector) {
+		return !validateBalancedSyntax(selector, false, false);
+	};
+
+	/**
+	 * Checks for invalid combinator patterns in selectors.
+	 * @param {string} selector - The CSS selector to check
+	 * @returns {boolean} True if the selector contains invalid combinators
+	 */
+	function hasInvalidCombinators(selector) {
+		// Check for invalid combinator patterns:
+		// - <> (not a valid combinator)
+		// - >> (deep descendant combinator, deprecated and invalid)
+		// - Multiple consecutive combinators like >>, >~, etc.
+		if (/<>/.test(selector)) return true;
+		if (/>>/.test(selector)) return true;
+		// Check for other invalid consecutive combinator patterns
+		if (/[>+~]\s*[>+~]/.test(selector)) return true;
+		return false;
+	};
+
+	/**
+	 * Checks for invalid pseudo-like syntax (function calls without proper pseudo prefix).
+	 * @param {string} selector - The CSS selector to check
+	 * @returns {boolean} True if the selector contains invalid pseudo-like syntax
+	 */
+	function hasInvalidPseudoSyntax(selector) {
+		// Check for specific known pseudo-elements used without : or :: prefix
+		// Examples: slotted(div), part(name), cue(selector)
+		// These are ONLY valid as ::slotted(), ::part(), ::cue()
+		var invalidPatterns = [
+			/(?:^|[\s>+~,\[])slotted\s*\(/i,
+			/(?:^|[\s>+~,\[])part\s*\(/i,
+			/(?:^|[\s>+~,\[])cue\s*\(/i,
+			/(?:^|[\s>+~,\[])cue-region\s*\(/i
+		];
+		
+		for (var i = 0; i < invalidPatterns.length; i++) {
+			if (invalidPatterns[i].test(selector)) {
+				return true;
+			}
+		}
+		return false;
+	};
+
+	/**
+	 * Checks for invalid nesting selector (&) usage.
+	 * The & selector cannot be directly followed by a type selector without a delimiter.
+	 * Valid: &.class, &#id, &[attr], &:hover, &::before, & div, &>div
+	 * Invalid: &div, &span
+	 * @param {string} selector - The CSS selector to check
+	 * @returns {boolean} True if the selector contains invalid & usage
+	 */
+	function hasInvalidNestingSelector(selector) {
+		// Check for & followed directly by a letter (type selector) without any delimiter
+		// This regex matches & followed by a letter (start of type selector) that's not preceded by an escape
+		// We need to exclude valid cases like &.class, &#id, &[attr], &:pseudo, &::pseudo, & (with space), &>
+		var invalidNestingPattern = /&(?![.\#\[:>\+~\s])[a-zA-Z]/;
+		return invalidNestingPattern.test(selector);
+	};
+
+	function validateAtRule(atRuleKey, validCallback, cannotBeNested) {
 		var isValid = false;
 		var sourceRuleRegExp = atRuleKey === "@import" ? forwardImportRuleValidationRegExp : forwardRuleValidationRegExp;
 		var ruleRegExp = new RegExp(atRuleKey + sourceRuleRegExp.source, sourceRuleRegExp.flags);
@@ -2494,6 +3194,114 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 				isValid = true;
 			}
 		}
+		
+		// Additional validation for @scope rule
+		if (isValid && atRuleKey === "@scope") {
+			var openBraceIndex = ruleSlice.indexOf('{');
+			if (openBraceIndex !== -1) {
+				// Extract the rule prelude (everything between the at-rule and {)
+				var rulePrelude = ruleSlice.slice(0, openBraceIndex).trim();
+
+				// Skip past at-rule keyword and whitespace
+				var preludeContent = rulePrelude.slice("@scope".length).trim();
+
+				if (preludeContent.length > 0) {
+					// Parse the scope prelude
+					var parsedScopePrelude = parseScopePrelude(preludeContent);
+					var startSelector = parsedScopePrelude.startSelector;
+					var endSelector = parsedScopePrelude.endSelector;
+					var hasStart = parsedScopePrelude.hasStart;
+					var hasEnd = parsedScopePrelude.hasEnd;
+					var hasOnlyEnd = parsedScopePrelude.hasOnlyEnd;
+					
+					// Validation rules for @scope:
+					// 1. Empty selectors in parentheses are invalid: @scope () {} or @scope (.a) to () {}
+					if ((hasStart && startSelector === '') || (hasEnd && endSelector === '') || (hasOnlyEnd && endSelector === '')) {
+						isValid = false;
+					}
+					// 2. Pseudo-elements are invalid in scope selectors
+					else if ((startSelector && hasPseudoElement(startSelector)) || (endSelector && hasPseudoElement(endSelector))) {
+						isValid = false;
+					}
+					// 3. Basic syntax errors (mismatched parens, brackets, quotes)
+					else if ((startSelector && hasBasicSyntaxError(startSelector)) || (endSelector && hasBasicSyntaxError(endSelector))) {
+						isValid = false;
+					}
+					// 4. Invalid combinator patterns
+					else if ((startSelector && hasInvalidCombinators(startSelector)) || (endSelector && hasInvalidCombinators(endSelector))) {
+						isValid = false;
+					}
+					// 5. Invalid pseudo-like syntax (function without : or :: prefix)
+					else if ((startSelector && hasInvalidPseudoSyntax(startSelector)) || (endSelector && hasInvalidPseudoSyntax(endSelector))) {
+						isValid = false;
+					}
+					// 6. Invalid structure (no proper parentheses found when prelude is not empty)
+					else if (!hasStart && !hasOnlyEnd) {
+						isValid = false;
+					}
+				}
+				// Empty prelude (@scope {}) is valid
+			}
+		}
+
+		if (isValid && atRuleKey === "@page") {
+			var openBraceIndex = ruleSlice.indexOf('{');
+			if (openBraceIndex !== -1) {
+				// Extract the rule prelude (everything between the at-rule and {)
+				var rulePrelude = ruleSlice.slice(0, openBraceIndex).trim();
+				
+				// Skip past at-rule keyword and whitespace
+				var preludeContent = rulePrelude.slice("@page".length).trim();
+
+				if (preludeContent.length > 0) {
+					var trimmedValue = preludeContent.trim();
+            
+					// Empty selector is valid for @page
+					if (trimmedValue !== '') {
+						// Parse @page selectorText for page name and pseudo-pages
+						// Valid formats:
+						// - (empty - no name, no pseudo-page)
+						// - :left, :right, :first, :blank (pseudo-page only)
+						// - named (named page only)
+						// - named:first (named page with single pseudo-page)
+						// - named:first:left (named page with multiple pseudo-pages)
+						var match = trimmedValue.match(atPageRuleSelectorRegExp);
+						if (match) {
+							var pageName = match[1] || '';
+							var pseudoPages = match[2] || '';
+
+							// Validate page name if present
+							if (pageName) {
+								if (!cssCustomIdentifierRegExp.test(pageName)) {
+									isValid = false;
+								}
+							}
+
+							// Validate pseudo-pages if present
+							if (pseudoPages) {
+								var pseudos = pseudoPages.split(':').filter(function(p) { return p; });
+								var validPseudos = ['left', 'right', 'first', 'blank'];
+								var allValid = true;
+								for (var j = 0; j < pseudos.length; j++) {
+									if (validPseudos.indexOf(pseudos[j].toLowerCase()) === -1) {
+										allValid = false;
+										break;
+									}
+								}
+								
+								if (!allValid) {
+									isValid = false;
+								}
+							}
+						} else {
+							isValid = false;
+						}
+					}
+					
+				}
+			}
+		}
+		
 		if (!isValid) {
 			// If it's invalid the browser will simply ignore the entire invalid block
 			// Use regex to find the closing brace of the invalid rule
@@ -2552,55 +3360,47 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 	 * @returns {boolean}
 	 */
 	function basicSelectorValidator(selector) {
-		var length = selector.length;
-		var i = 0;
-		var stack = [];
-		var inAttr = false;
-		var inSingleQuote = false;
-		var inDoubleQuote = false;
+		// Validate balanced syntax with attribute tracking and stack-based parentheses matching
+		if (!validateBalancedSyntax(selector, true, true)) {
+			return false;
+		}
 
-		while (i < length) {
-			var char = selector[i];
+		// Check for invalid combinator patterns
+		if (hasInvalidCombinators(selector)) {
+			return false;
+		}
 
-			if (inSingleQuote) {
-				if (char === "'" && selector[i - 1] !== "\\") {
-					inSingleQuote = false;
-				}
-			} else if (inDoubleQuote) {
-				if (char === '"' && selector[i - 1] !== "\\") {
-					inDoubleQuote = false;
-				}
-			} else if (inAttr) {
-				if (char === "]") {
-					inAttr = false;
-				} else if (char === "'") {
-					inSingleQuote = true;
-				} else if (char === '"') {
-					inDoubleQuote = true;
-				}
-			} else {
-				if (char === "[") {
-					inAttr = true;
-				} else if (char === "'") {
-					inSingleQuote = true;
-				} else if (char === '"') {
-					inDoubleQuote = true;
-				} else if (char === "(") {
-					stack.push("(");
-				} else if (char === ")") {
-					if (!stack.length || stack.pop() !== "(") {
-						return false;
-					}
-				}
-			}
-			i++;
+		// Check for invalid pseudo-like syntax
+		if (hasInvalidPseudoSyntax(selector)) {
+			return false;
 		}
 
-		// If any stack or quote/attr context remains, it's invalid
-		if (stack.length || inAttr || inSingleQuote || inDoubleQuote) {
+		// Check for invalid nesting selector (&) usage
+		if (hasInvalidNestingSelector(selector)) {
 			return false;
 		}
 
+		// Check for invalid pseudo-class usage with quoted strings
+		// Pseudo-classes like :lang(), :dir(), :nth-*() should not accept quoted strings
+		var pseudoPattern = /::?([a-zA-Z][\w-]*)\(([^)]+)\)/g;
+		var pseudoMatch;
+		while ((pseudoMatch = pseudoPattern.exec(selector)) !== null) {
+			var pseudoName = pseudoMatch[1];
+			var pseudoContent = pseudoMatch[2];
+			
+			// List of pseudo-classes that should not accept quoted strings
+			// :lang() - accepts language codes: en, fr-CA
+			// :dir() - accepts direction: ltr, rtl
+			// :nth-*() - accepts An+B notation: 2n+1, odd, even
+			var noQuotesPseudos = ['lang', 'dir', 'nth-child', 'nth-last-child', 'nth-of-type', 'nth-last-of-type'];
+			
+			for (var i = 0; i < noQuotesPseudos.length; i++) {
+				if (pseudoName === noQuotesPseudos[i] && /['"]/.test(pseudoContent)) {
+					return false;
+				}
+			}
+		}
+
 		// Fallback to a loose regexp for the overall selector structure (without deep paren matching)
 		// This is similar to the original, but without nested paren limitations
 		// Modified to support namespace selectors: *|element, prefix|element, |element
@@ -2608,7 +3408,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 		var looseSelectorRegExp = /^((?:(?:\*|[a-zA-Z_\u00A0-\uFFFF\\][a-zA-Z0-9_\u00A0-\uFFFF\-\\]*|)\|)?[a-zA-Z_\u00A0-\uFFFF\\][a-zA-Z0-9_\u00A0-\uFFFF\-\\]*|(?:(?:\*|[a-zA-Z_\u00A0-\uFFFF\\][a-zA-Z0-9_\u00A0-\uFFFF\-\\]*|)\|)?\*|#[a-zA-Z0-9_\u00A0-\uFFFF\-\\]+|\.[a-zA-Z0-9_\u00A0-\uFFFF\-\\]+|\[(?:[^\[\]'"]|'(?:[^'\\]|\\.)*'|"(?:[^"\\]|\\.)*")*(?:\s+[iI])?\]|::?[a-zA-Z0-9_\u00A0-\uFFFF\-\\]+(?:\((.*)\))?|&|\s*[>+~]\s*|\s+)+$/;
 		return looseSelectorRegExp.test(selector);
 	}
-
+	
 	/**
 	 * Regular expression to match CSS pseudo-classes with arguments.
 	 *
@@ -2639,48 +3439,56 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 	 * @returns {string[]} An array of selector parts, split by top-level commas, with whitespace trimmed.
 	 */
 	function parseAndSplitNestedSelectors(selector) {
-		var depth = 0;
-		var buffer = "";
-		var parts = [];
-		var inSingleQuote = false;
-		var inDoubleQuote = false;
+		var depth = 0;           // Track parenthesis nesting depth
+		var buffer = "";         // Accumulate characters for current selector part
+		var parts = [];          // Array of split selector parts
+		var inSingleQuote = false; // Track if we're inside single quotes
+		var inDoubleQuote = false; // Track if we're inside double quotes
 		var i, char;
 
 		for (i = 0; i < selector.length; i++) {
 			char = selector.charAt(i);
 
+			// Handle single quote strings
 			if (char === "'" && !inDoubleQuote) {
 				inSingleQuote = !inSingleQuote;
 				buffer += char;
-			} else if (char === '"' && !inSingleQuote) {
+			}
+			// Handle double quote strings
+			else if (char === '"' && !inSingleQuote) {
 				inDoubleQuote = !inDoubleQuote;
 				buffer += char;
-			} else if (!inSingleQuote && !inDoubleQuote) {
+			}
+			// Process characters outside of quoted strings
+			else if (!inSingleQuote && !inDoubleQuote) {
 				if (char === '(') {
+					// Entering a nested level (e.g., :is(...))
 					depth++;
 					buffer += char;
 				} else if (char === ')') {
+					// Exiting a nested level
 					depth--;
 					buffer += char;
-					if (depth === 0) {
-						parts.push(buffer.replace(/^\s+|\s+$/g, ""));
-						buffer = "";
-					}
 				} else if (char === ',' && depth === 0) {
-					if (buffer.replace(/^\s+|\s+$/g, "")) {
-						parts.push(buffer.replace(/^\s+|\s+$/g, ""));
+					// Found a top-level comma separator - split here
+					if (buffer.trim()) {
+						parts.push(buffer.trim());
 					}
 					buffer = "";
 				} else {
+					// Regular character - add to buffer
 					buffer += char;
 				}
-			} else {
+			}
+			// Characters inside quoted strings - add to buffer
+			else {
 				buffer += char;
 			}
 		}
 
-		if (buffer.replace(/^\s+|\s+$/g, "")) {
-			parts.push(buffer.replace(/^\s+|\s+$/g, ""));
+		// Add any remaining content in buffer as the last part
+		if (buffer.trim()) {
+			parts.push(buffer.trim());
 		}
 
 		return parts;
@@ -2697,8 +3505,8 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 	 * @returns {boolean} Returns `true` if the selector is valid, otherwise `false`.
 	 */
 
-	// Cache to store validated selectors
-	var validatedSelectorsCache = new Map();
+	// Cache to store validated selectors (previously a ES6 Map, now an ES5-compliant object)
+	var validatedSelectorsCache = {};
 
 	// Only pseudo-classes that accept selector lists should recurse
 	var selectorListPseudoClasses = {
@@ -2709,8 +3517,8 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 	};
 
 	function validateSelector(selector) {
-		if (validatedSelectorsCache.has(selector)) {
-			return validatedSelectorsCache.get(selector);
+		if (validatedSelectorsCache.hasOwnProperty(selector)) {
+			return validatedSelectorsCache[selector];
 		}
 
 		// Use a non-global regex to find all pseudo-classes with arguments
@@ -2727,15 +3535,15 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 				var nestedSelectors = parseAndSplitNestedSelectors(pseudoClassMatches[j][2]);
 				for (var i = 0; i < nestedSelectors.length; i++) {
 					var nestedSelector = nestedSelectors[i];
-					if (!validatedSelectorsCache.has(nestedSelector)) {
+					if (!validatedSelectorsCache.hasOwnProperty(nestedSelector)) {
 						var nestedSelectorValidation = validateSelector(nestedSelector);
-						validatedSelectorsCache.set(nestedSelector, nestedSelectorValidation);
+						validatedSelectorsCache[nestedSelector] = nestedSelectorValidation;
 						if (!nestedSelectorValidation) {
-							validatedSelectorsCache.set(selector, false);
+							validatedSelectorsCache[selector] = false;
 							return false;
 						}
-					} else if (!validatedSelectorsCache.get(nestedSelector)) {
-						validatedSelectorsCache.set(selector, false);
+					} else if (!validatedSelectorsCache[nestedSelector]) {
+						validatedSelectorsCache[selector] = false;
 						return false;
 					}
 				}
@@ -2743,7 +3551,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 		}
 
 		var basicSelectorValidation = basicSelectorValidator(selector);
-		validatedSelectorsCache.set(selector, basicSelectorValidation);
+		validatedSelectorsCache[selector] = basicSelectorValidation;
 
 		return basicSelectorValidation;
 	}
@@ -2807,6 +3615,28 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 		return definedNamespacePrefixes.hasOwnProperty(namespacePrefix);
 	}
 
+	/**
+	 * Processes a CSS selector text 
+	 * 
+	 * @param {string} selectorText - The CSS selector text to process
+	 * @returns {string} The processed selector text with normalized whitespace
+	 */
+	function processSelectorText(selectorText) {
+		// TODO: Remove invalid selectors that appears inside pseudo classes
+		// TODO: The same processing here needs to be reused in CSSStyleRule.selectorText setter
+		// TODO: Move these validation logic to a shared function to be reused in CSSStyleRule.selectorText setter
+
+		/**
+		 * Normalizes whitespace and preserving quoted strings.
+		 * Replaces all newline characters (CRLF, CR, or LF) with spaces while keeping quoted
+		 * strings (single or double quotes) intact, including any escaped characters within them.
+		 */
+		return selectorText.replace(/(['"])(?:\\.|[^\\])*?\1|(\r\n|\r|\n)/g, function(match, _, newline) {
+			if (newline) return " ";
+			return match;
+		});
+	}
+
 	/**
 	 * Checks if a given CSS selector text is valid by splitting it by commas
 	 * and validating each individual selector using the `validateSelector` function.
@@ -2815,6 +3645,9 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 	 * @returns {boolean} Returns true if all selectors are valid, otherwise false.
 	 */
 	function isValidSelectorText(selectorText) {
+		// TODO: The same validations here needs to be reused in CSSStyleRule.selectorText setter
+		// TODO: Move these validation logic to a shared function to be reused in CSSStyleRule.selectorText setter
+
 		// Check for newlines inside single or double quotes using regex
 		// This matches any quoted string (single or double) containing a newline
 		var quotedNewlineRegExp = /(['"])(?:\\.|[^\\])*?\1/g;
@@ -2835,6 +3668,23 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 		return true;
 	}
 
+	function parseError(message) {
+		var lines = token.substring(0, i).split('\n');
+		var lineCount = lines.length;
+		var charCount = lines.pop().length + 1;
+		var error = new Error(message + ' (line ' + lineCount + ', char ' + charCount + ')');
+		error.line = lineCount;
+		/* jshint sub : true */
+		error['char'] = charCount;
+		error.styleSheet = styleSheet;
+		// Print the error but continue parsing the sheet
+		try {
+			throw error;
+		} catch(e) {
+			errorHandler && errorHandler(e);
+		}
+	};
+
 	var endingIndex = token.length - 1;
 
 	for (var character; (character = token.charAt(i)); i++) {
@@ -2924,7 +3774,8 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 				i += 2;
 				index = token.indexOf("*/", i);
 				if (index === -1) {
-					parseError("Missing */");
+					i = token.length - 1;
+					buffer = "";
 				} else {
 					i = index + 1;
 				}
@@ -2979,6 +3830,15 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 				}, true);
 				buffer = "";
 				break;
+			} else if (token.indexOf("@scope", i) === i) {
+				validateAtRule("@scope", function(){
+					state = "scopeBlock";
+					scopeRule = new CSSOM.CSSScopeRule();
+					scopeRule.__starts = i;
+					i += "scope".length;
+				});
+				buffer = "";
+				break;
 			} else if (token.indexOf("@layer", i) === i) {
 				validateAtRule("@layer", function(){
 					state = "layerBlock"
@@ -2988,6 +3848,15 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 				});
 				buffer = "";
 				break;
+			} else if (token.indexOf("@page", i) === i) {
+				validateAtRule("@page", function(){
+					state = "pageBlock"
+					pageRule = new CSSOM.CSSPageRule();
+					pageRule.__starts = i;
+					i += "page".length;
+				});
+				buffer = "";
+				break;
 			} else if (token.indexOf("@supports", i) === i) {
 				validateAtRule("@supports", function(){
 					state = "conditionBlock";
@@ -3085,10 +3954,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 				}
 
 				currentScope = parentRule = styleRule;
-				styleRule.selectorText = buffer.trim().replace(/(['"])(?:\\.|[^\\])*?\1|(\r\n|\r|\n)/g, function(match, _, newline) {
-					if (newline) return " ";
-					return match;
-				});
+				styleRule.selectorText = processSelectorText(buffer.trim());
 				styleRule.style.__starts = i;
 				styleRule.__parentStyleSheet = styleSheet;
 				buffer = "";
@@ -3106,7 +3972,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 				buffer = "";
 				state = "before-selector";
 			} else if (state === "containerBlock") {
-				containerRule.containerText = buffer.trim();
+				containerRule.__conditionText = buffer.trim();
 
 				if (parentRule) {
 					containerRule.__parentRule = parentRule;
@@ -3123,7 +3989,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 				counterStyleRule.__parentStyleSheet = styleSheet;
 				buffer = "";
 			} else if (state === "conditionBlock") {
-				supportsRule.conditionText = buffer.trim();
+				supportsRule.__conditionText = buffer.trim();
 
 				if (parentRule) {
 					supportsRule.__parentRule = parentRule;
@@ -3134,10 +4000,31 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 				supportsRule.__parentStyleSheet = styleSheet;
 				buffer = "";
 				state = "before-selector";
+			} else if (state === "scopeBlock") {
+				var parsedScopePrelude = parseScopePrelude(buffer.trim());
+				
+				if (parsedScopePrelude.hasStart) {
+					scopeRule.__start = parsedScopePrelude.startSelector;
+				}
+				if (parsedScopePrelude.hasEnd) {
+					scopeRule.__end = parsedScopePrelude.endSelector;
+				}
+				if (parsedScopePrelude.hasOnlyEnd) {
+					scopeRule.__end = parsedScopePrelude.endSelector;
+				}
+
+				if (parentRule) {
+					scopeRule.__parentRule = parentRule;
+					ancestorRules.push(parentRule);
+				}
+				currentScope = parentRule = scopeRule;
+				scopeRule.__parentStyleSheet = styleSheet;
+				buffer = "";
+				state = "before-selector";
 			} else if (state === "layerBlock") {
 				layerBlockRule.name = buffer.trim();
 
-				var isValidName = layerBlockRule.name.length === 0 || layerBlockRule.name.match(layerRuleNameRegExp) !== null;
+				var isValidName = layerBlockRule.name.length === 0 || layerBlockRule.name.match(cssCustomIdentifierRegExp) !== null;
 
 				if (isValidName) {
 					if (parentRule) {
@@ -3150,6 +4037,19 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 				}
 				buffer = "";
 				state = "before-selector";
+			} else if (state === "pageBlock") {
+				pageRule.selectorText = buffer.trim();
+
+				if (parentRule) {
+					pageRule.__parentRule = parentRule;
+					ancestorRules.push(parentRule);
+				}
+
+				currentScope = parentRule = pageRule;
+				pageRule.__parentStyleSheet = styleSheet;
+				styleRule = pageRule;
+				buffer = "";
+				state = "before-name";
 			} else if (state === "hostRule-begin") {
 				if (parentRule) {
 					ancestorRules.push(parentRule);
@@ -3223,17 +4123,15 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 				}
 				
 				styleRule = new CSSOM.CSSStyleRule();
-				var processedSelectorText = buffer.trim().replace(/(['"])(?:\\.|[^\\])*?\1|(\r\n|\r|\n)/g, function(match, _, newline) {
-					if (newline) return " ";
-					return match;
-				});
+				var processedSelectorText = processSelectorText(buffer.trim());
 				// In a nested selector, ensure each selector contains '&' at the beginning, except for selectors that already have '&' somewhere
 				if (parentRule.constructor.name !== "CSSStyleRule" && parentRule.parentRule === null) {
 					styleRule.selectorText = processedSelectorText;
 				} else {
 					styleRule.selectorText = parseAndSplitNestedSelectors(processedSelectorText).map(function(sel) {
-							return sel.indexOf('&') === -1 ? '& ' + sel : sel;
-						}).join(', ');
+						// Add & at the beginning if there's no & in the selector, or if it starts with a combinator
+						return (sel.indexOf('&') === -1 || startsWithCombinatorRegExp.test(sel)) ? '& ' + sel : sel;
+					}).join(', ');
 				}
 				styleRule.style.__starts = i - buffer.length;
 				styleRule.__parentRule = parentRule;
@@ -3349,7 +4247,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 							testNamespaceRule.cssText = buffer + character;
 							
 							namespaceRule = testNamespaceRule;
-							namespaceRule.__parentStyleSheet = namespaceRule.styleSheet.__parentStyleSheet = styleSheet;
+							namespaceRule.__parentStyleSheet = styleSheet;
 							styleSheet.cssRules.push(namespaceRule);
 							
 							// Track the namespace prefix for validation
@@ -3368,7 +4266,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 						return name.trim();
 					});
 					var isInvalid = parentRule !== undefined || nameListStr.some(function (name) {
-						return name.trim().match(layerRuleNameRegExp) === null;
+						return name.trim().match(cssCustomIdentifierRegExp) === null;
 					});
 
 					if (!isInvalid) {
@@ -3469,6 +4367,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 							|| parentRule.constructor.name === "CSSMediaRule"
 							|| parentRule.constructor.name === "CSSSupportsRule"
 							|| parentRule.constructor.name === "CSSContainerRule"
+							|| parentRule.constructor.name === "CSSScopeRule"
 							|| parentRule.constructor.name === "CSSLayerBlockRule"
 							|| parentRule.constructor.name === "CSSStartingStyleRule"
 						) {
@@ -3538,6 +4437,7 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 							|| parentRule.constructor.name === "CSSMediaRule"
 							|| parentRule.constructor.name === "CSSSupportsRule"
 							|| parentRule.constructor.name === "CSSContainerRule"
+							|| parentRule.constructor.name === "CSSScopeRule"
 							|| parentRule.constructor.name === "CSSLayerBlockRule"
 							|| parentRule.constructor.name === "CSSStartingStyleRule"
 						) {
@@ -3593,6 +4493,10 @@ CSSOM.parse = function parse(token, opts, errorHandler) {
 		}
 	}
 
+	if (buffer.trim() !== "") {
+		parseError("Unexpected end of input");
+	}
+
 	return styleSheet;
 };