From 80ea865b1977e137e4c5c80b56afacef7bc25a72 Mon Sep 17 00:00:00 2001
From: Callum Law <callumlaw1709@outlook.com>
Date: Sat, 21 Jun 2025 21:57:57 +1200
Subject: [PATCH] LibWeb: Use correct error for invalid rule in nested
 insertRule

When we try to insert a disallowed (non-nested) statement into a
CSSGroupingRule we should throw a `HierarchyRequestError` as it being
disallowed is a "constraint specified by CSS". Previously we would rely
on `Parser::is_valid_in_the_current_context` and throw a Syntax error.

There are more constraints to be implemented.
---
 Libraries/LibWeb/CSS/CSSRuleList.cpp          |  10 +-
 .../js/conditional-CSSGroupingRule.txt        |   8 +-
 .../css/cssom/CSSGroupingRule-insertRule.txt  |  12 ++
 .../css/cssom/CSSGroupingRule-insertRule.html | 118 ++++++++++++++++++
 4 files changed, 139 insertions(+), 9 deletions(-)
 create mode 100644 Tests/LibWeb/Text/expected/wpt-import/css/cssom/CSSGroupingRule-insertRule.txt
 create mode 100644 Tests/LibWeb/Text/input/wpt-import/css/cssom/CSSGroupingRule-insertRule.html

diff --git a/Libraries/LibWeb/CSS/CSSRuleList.cpp b/Libraries/LibWeb/CSS/CSSRuleList.cpp
index 76b9971f45e..025032f7aa3 100644
--- a/Libraries/LibWeb/CSS/CSSRuleList.cpp
+++ b/Libraries/LibWeb/CSS/CSSRuleList.cpp
@@ -63,18 +63,17 @@ WebIDL::ExceptionOr<unsigned> CSSRuleList::insert_a_css_rule(Variant<StringView,
     // NOTE: The insert-a-css-rule spec expects `rule` to be a string, but the CSSStyleSheet.insertRule()
     //       spec calls this algorithm with an already-parsed CSSRule. So, we use a Variant and skip step 3
     //       if that variant holds a CSSRule already.
-    Parser::ParsingParams parsing_params { realm() };
-    parsing_params.rule_context = rule_context();
-
     CSSRule* new_rule = nullptr;
     if (rule.has<StringView>()) {
-        new_rule = parse_css_rule(parsing_params, rule.get<StringView>());
+        new_rule = parse_css_rule(Parser::ParsingParams { realm() }, rule.get<StringView>());
     } else {
         new_rule = rule.get<CSSRule*>();
     }
 
     // 4. If new rule is a syntax error, and nested is set, perform the following substeps:
     if (!new_rule && nested == Nested::Yes) {
+        Parser::ParsingParams parsing_params { realm() };
+        parsing_params.rule_context = rule_context();
         // - Set declarations to the results of performing parse a CSS declaration block, on argument rule.
         auto declarations = parse_css_property_declaration_block(parsing_params, rule.get<StringView>());
 
@@ -130,7 +129,8 @@ WebIDL::ExceptionOr<unsigned> CSSRuleList::insert_a_css_rule(Variant<StringView,
         break;
     }
 
-    if (rule_is_disallowed)
+    // FIXME: There are more constraints that we should check here - Parser::is_valid_in_the_current_context is probably a good reference for that.
+    if (rule_is_disallowed || (nested == Nested::Yes && first_is_one_of(new_rule->type(), CSSRule::Type::Import, CSSRule::Type::Namespace)))
         return WebIDL::HierarchyRequestError::create(realm(), "Cannot insert rule at specified index."_string);
 
     // 7. If new rule is an @namespace at-rule, and list contains anything other than @import at-rules, and @namespace at-rules, throw an InvalidStateError exception.
diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/css-conditional/js/conditional-CSSGroupingRule.txt b/Tests/LibWeb/Text/expected/wpt-import/css/css-conditional/js/conditional-CSSGroupingRule.txt
index e45e3813268..482273bec5c 100644
--- a/Tests/LibWeb/Text/expected/wpt-import/css/css-conditional/js/conditional-CSSGroupingRule.txt
+++ b/Tests/LibWeb/Text/expected/wpt-import/css/css-conditional/js/conditional-CSSGroupingRule.txt
@@ -2,12 +2,12 @@ Harness status: OK
 
 Found 34 tests
 
-30 Pass
-4 Fail
+32 Pass
+2 Fail
 Pass	@media is CSSGroupingRule
 Pass	@media rule type
 Pass	Empty @media rule length
-Fail	insertRule of @import into @media
+Pass	insertRule of @import into @media
 Pass	insertRule into empty @media at bad index
 Pass	insertRule into @media updates length
 Pass	insertRule of valid @media into @media
@@ -24,7 +24,7 @@ Pass	Return value of insertRule into @media
 Pass	@supports is CSSGroupingRule
 Pass	@supports rule type
 Pass	Empty @supports rule length
-Fail	insertRule of @import into @supports
+Pass	insertRule of @import into @supports
 Pass	insertRule into empty @supports at bad index
 Pass	insertRule into @supports updates length
 Pass	insertRule of valid @media into @supports
diff --git a/Tests/LibWeb/Text/expected/wpt-import/css/cssom/CSSGroupingRule-insertRule.txt b/Tests/LibWeb/Text/expected/wpt-import/css/cssom/CSSGroupingRule-insertRule.txt
new file mode 100644
index 00000000000..22851e7102b
--- /dev/null
+++ b/Tests/LibWeb/Text/expected/wpt-import/css/cssom/CSSGroupingRule-insertRule.txt
@@ -0,0 +1,12 @@
+Harness status: OK
+
+Found 7 tests
+
+7 Pass
+Pass	index before first
+Pass	index after final
+Pass	index not specified
+Pass	index exceeds length
+Pass	CSS parsing error
+Pass	constraint violation
+Pass	disallowed namespace rule
\ No newline at end of file
diff --git a/Tests/LibWeb/Text/input/wpt-import/css/cssom/CSSGroupingRule-insertRule.html b/Tests/LibWeb/Text/input/wpt-import/css/cssom/CSSGroupingRule-insertRule.html
new file mode 100644
index 00000000000..f592e14e978
--- /dev/null
+++ b/Tests/LibWeb/Text/input/wpt-import/css/cssom/CSSGroupingRule-insertRule.html
@@ -0,0 +1,118 @@
+<!doctype html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <title>CSSOM - CSSGroupingRule - insertRule</title>
+    <link rel="help" href="https://drafts.csswg.org/cssom/#the-cssgroupingrule-interface">
+    <script src="../../resources/testharness.js"></script>
+    <script src="../../resources/testharnessreport.js"></script>
+    <script>
+    function create(t) {
+        var style = document.createElement('style');
+        style.appendChild(document.createTextNode('@media all { * {} }'));
+        document.head.appendChild(style);
+        t.add_cleanup(function() {
+            document.head.removeChild(style);
+        });
+
+        assert_true(!!style.sheet, 'setup - sheet defined');
+        assert_equals(
+            style.sheet.cssRules.length, 1, 'setup - grouping rule created'
+        );
+        assert_equals(
+            style.sheet.cssRules[0].cssRules.length, 1, 'setup - rule created'
+        );
+        return style.sheet.cssRules[0];
+    }
+
+    test(function (t) {
+        var groupingRule = create(t);
+        var first = groupingRule.cssRules[0].cssText;
+        var result;
+
+        result = groupingRule.insertRule('.foo {}', 0);
+
+        assert_equals(groupingRule.cssRules.length, 2);
+        assert_not_equals(groupingRule.cssRules[0].cssText, first);
+        assert_equals(groupingRule.cssRules[1].cssText, first);
+        assert_equals(result, 0, 'result');
+    }, 'index before first');
+
+    test(function (t) {
+        var groupingRule = create(t);
+        var first = groupingRule.cssRules[0].cssText;
+        var result;
+
+        result = groupingRule.insertRule('.foo {}', 1);
+
+        assert_equals(groupingRule.cssRules.length, 2);
+        assert_equals(groupingRule.cssRules[0].cssText, first);
+        assert_not_equals(groupingRule.cssRules[1].cssText, first);
+        assert_equals(result, 1);
+    }, 'index after final');
+
+    test(function (t) {
+        var groupingRule = create(t);
+        var first = groupingRule.cssRules[0].cssText;
+        var result;
+
+        result = groupingRule.insertRule('.foo {}');
+
+        assert_equals(groupingRule.cssRules.length, 2);
+        assert_not_equals(groupingRule.cssRules[0].cssText, first);
+        assert_equals(groupingRule.cssRules[1].cssText, first);
+        assert_equals(result, 0);
+    }, 'index not specified');
+
+    test(function (t) {
+        var groupingRule = create(t);
+        var first = groupingRule.cssRules[0].cssText;
+
+        assert_throws_dom('IndexSizeError', function() {
+            // The syntax error is intentional; it verifies that the insertion
+            // index is validated prior to the CSS text.
+            groupingRule.insertRule('???', 2);
+        });
+
+        assert_equals(groupingRule.cssRules.length, 1);
+        assert_equals(groupingRule.cssRules[0].cssText, first);
+    }, 'index exceeds length');
+
+    test(function (t) {
+        var groupingRule = create(t);
+        var first = groupingRule.cssRules[0].cssText;
+
+        assert_throws_dom('SyntaxError', function() {
+            groupingRule.insertRule('???', 0);
+        });
+
+        assert_equals(groupingRule.cssRules.length, 1);
+        assert_equals(groupingRule.cssRules[0].cssText, first);
+    }, 'CSS parsing error');
+
+    test(function (t) {
+        var groupingRule = create(t);
+        var first = groupingRule.cssRules[0].cssText;
+
+        assert_throws_dom('HierarchyRequestError', function() {
+            groupingRule.insertRule('@import url("foo.css");', 0);
+        });
+
+        assert_equals(groupingRule.cssRules.length, 1);
+        assert_equals(groupingRule.cssRules[0].cssText, first);
+    }, 'constraint violation');
+
+    test(function (t) {
+        var groupingRule = create(t);
+        var first = groupingRule.cssRules[0].cssText;
+
+        assert_throws_dom('HierarchyRequestError', function() {
+            groupingRule.insertRule('@namespace url(http://www.w3.org/1999/xhtml);', 0);
+        });
+
+        assert_equals(groupingRule.cssRules.length, 1);
+        assert_equals(groupingRule.cssRules[0].cssText, first);
+    }, 'disallowed namespace rule');
+    </script>
+</head>
+</html>