#921@patch: Adds support for ignoring unknown rules to the CSS parser.

capricorn86 · May 18, 2023 · 2813bd0 · 2813bd0
1 parent f37f663
commit 2813bd0
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 5 deletions.
diff --git a/packages/happy-dom/src/css/CSSParser.ts b/packages/happy-dom/src/css/CSSParser.ts
@@ -39,7 +39,7 @@ export default class CSSParser {
 				) {
 					const newRule = new CSSKeyframesRule();
 
-					(<string>newRule.name) = selectorText.replace('@keyframes ', '');
+					(<string>newRule.name) = selectorText.replace(/@(-webkit-){0,1}keyframes +/, '');
 					newRule.parentStyleSheet = parentStyleSheet;
 					cssRules.push(newRule);
 					parentRule = newRule;
@@ -58,7 +58,7 @@ export default class CSSParser {
 					selectorText.startsWith('@container') ||
 					selectorText.startsWith('@-webkit-container')
 				) {
-					const conditionText = selectorText.replace(/@container */, '');
+					const conditionText = selectorText.replace(/@(-webkit-){0,1}container +/, '');
 					const newRule = new CSSContainerRule();
 
 					(<string>newRule.conditionText) = conditionText;
@@ -69,7 +69,7 @@ export default class CSSParser {
 					selectorText.startsWith('@supports') ||
 					selectorText.startsWith('@-webkit-supports')
 				) {
-					const conditionText = selectorText.replace(/@supports */, '');
+					const conditionText = selectorText.replace(/@(-webkit-){0,1}supports +/, '');
 					const newRule = new CSSSupportsRule();
 
 					(<string>newRule.conditionText) = conditionText;
@@ -78,7 +78,10 @@ export default class CSSParser {
 					parentRule = newRule;
 				} else if (selectorText.startsWith('@')) {
 					// Unknown rule.
-					// Ignore.
+					// We will create a new rule to let it grab its content, but we will not add it to the cssRules array.
+					const newRule = new CSSRule();
+					newRule.parentStyleSheet = parentStyleSheet;
+					parentRule = newRule;
 				} else if (parentRule && parentRule.type === CSSRule.KEYFRAMES_RULE) {
 					const newRule = new CSSKeyframeRule();
 					(<string>newRule.keyText) = selectorText.trim();

diff --git a/packages/happy-dom/test/css/data/CSSParserInput.ts b/packages/happy-dom/test/css/data/CSSParserInput.ts
@@ -31,7 +31,7 @@ export default `
         }
     }
 
-    @keyframes keyframes2 {
+    @-webkit-keyframes keyframes2 {
         0% {
             transform: rotate(0deg);
         }
@@ -41,6 +41,12 @@ export default `
         }
     }
 
+    @unknown-rule {
+        .unknown-class {
+            text-spacing: 1px;
+        }
+    }
+
     @container (min-width: 36rem) {
         .container {
             color: red;