Backed out changeset 085c31f150d3 (bug 1846251) for causing CSSStyleR…

…ule related wpt failures.
dothq · Jul 31, 2023 · b0b02ef · b0b02ef
1 parent a73ecfd
commit b0b02ef
Show file tree

Hide file tree

Showing 19 changed files with 47 additions and 8 deletions.
diff --git a/devtools/client/inspector/changes/test/browser_changes_nested_rules.js b/devtools/client/inspector/changes/test/browser_changes_nested_rules.js
@@ -110,6 +110,8 @@ const EXPECTED_AFTER_SPAN_PROP_CHANGES = EXPECTED_AFTER_DIV_PROP_CHANGE.map(
 ]);
 
 add_task(async function () {
+  await pushPref("layout.css.nesting.enabled", true);
+
   await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
   const { inspector, view: ruleView } = await openRuleView();
   const changesView = selectChangesView(inspector);

diff --git a/devtools/client/inspector/rules/test/browser_rules_content_01.js b/devtools/client/inspector/rules/test/browser_rules_content_01.js
@@ -35,6 +35,7 @@ const TEST_URI = `
 `;
 
 add_task(async function () {
+  await pushPref("layout.css.nesting.enabled", true);
   await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
   const { inspector, view } = await openRuleView();
 

diff --git a/devtools/client/inspector/rules/test/browser_rules_edit-property-nested-rules.js b/devtools/client/inspector/rules/test/browser_rules_edit-property-nested-rules.js
@@ -46,6 +46,7 @@ add_task(async function test_constructed_sheet() {
 });
 
 async function runTest(uri) {
+  await pushPref("layout.css.nesting.enabled", true);
   await addTab(`data:text/html,<meta charset=utf8>${encodeURIComponent(uri)}`);
   const { inspector, view } = await openRuleView();
 

diff --git a/devtools/client/inspector/rules/test/browser_rules_edit-selector-nested-rules.js b/devtools/client/inspector/rules/test/browser_rules_edit-selector-nested-rules.js
@@ -39,6 +39,7 @@ add_task(async function test_constructed_sheet() {
 });
 
 async function runTest(uri) {
+  await pushPref("layout.css.nesting.enabled", true);
   await addTab(`data:text/html,<meta charset=utf8>${encodeURIComponent(uri)}`);
   const { inspector, view } = await openRuleView();
 

diff --git a/devtools/client/inspector/rules/test/browser_rules_nested_rules.js b/devtools/client/inspector/rules/test/browser_rules_nested_rules.js
@@ -47,6 +47,8 @@ const TEST_URI = `
 `;
 
 add_task(async function () {
+  await pushPref("layout.css.nesting.enabled", true);
+
   await addTab(
     "https://example.com/document-builder.sjs?html=" +
       encodeURIComponent(TEST_URI)

diff --git a/devtools/client/inspector/rules/test/browser_rules_selector-highlighter-nested-rules.js b/devtools/client/inspector/rules/test/browser_rules_selector-highlighter-nested-rules.js
@@ -38,6 +38,7 @@ const TEST_URI = `
   </main>`;
 
 add_task(async function () {
+  await pushPref("layout.css.nesting.enabled", true);
   await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
   const { inspector, view } = await openRuleView();
 

diff --git a/devtools/client/styleeditor/test/browser_styleeditor_at_rules_sidebar.js b/devtools/client/styleeditor/test/browser_styleeditor_at_rules_sidebar.js
@@ -39,6 +39,7 @@ waitForExplicitFinish();
 
 add_task(async function () {
   await pushPref("layout.css.container-queries.enabled", true);
+  await pushPref("layout.css.nesting.enabled", true);
 
   const { ui } = await openStyleEditorForURL(TESTCASE_URI);
 

diff --git a/devtools/client/styleeditor/test/browser_styleeditor_media_sidebar_links.js b/devtools/client/styleeditor/test/browser_styleeditor_media_sidebar_links.js
@@ -16,6 +16,7 @@ const TESTCASE_URI = TEST_BASE_HTTPS + "media-rules.html";
 const responsiveModeToggleClass = ".media-responsive-mode-toggle";
 
 add_task(async function () {
+  await pushPref("layout.css.nesting.enabled", true);
   const { ui } = await openStyleEditorForURL(TESTCASE_URI);
 
   const editor = ui.editors[1];

diff --git a/devtools/client/styleeditor/test/browser_styleeditor_sidebars.js b/devtools/client/styleeditor/test/browser_styleeditor_sidebars.js
@@ -18,6 +18,7 @@ const MEDIA_WIDTH = 250;
 
 // Test that sidebar in the styleeditor can be resized.
 add_task(async function () {
+  await pushPref("layout.css.nesting.enabled", true);
   await pushPref(PREF_SHOW_AT_RULES_SIDEBAR, true);
   await pushPref(PREF_NAV_WIDTH, NAV_WIDTH);
   await pushPref(PREF_SIDEBAR_WIDTH, MEDIA_WIDTH);

diff --git a/devtools/client/webconsole/test/browser/browser_webconsole_css_error_impacted_elements.js b/devtools/client/webconsole/test/browser/browser_webconsole_css_error_impacted_elements.js
@@ -43,6 +43,7 @@ const TEST_URI = `data:text/html,<!DOCTYPE html><meta charset=utf8>
 add_task(async function () {
   // Enable CSS Warnings
   await pushPref("devtools.webconsole.filter.css", true);
+  await pushPref("layout.css.nesting.enabled", true);
 
   const hud = await openNewTabAndConsole(TEST_URI);
   const toolbox = hud.toolbox;

diff --git a/devtools/shared/commands/resource/tests/browser_resources_css_messages.js b/devtools/shared/commands/resource/tests/browser_resources_css_messages.js
@@ -25,6 +25,7 @@ httpServer.registerPathHandler(`/test_css_messages.html`, (req, res) => {
 const TEST_URI = `http://localhost:${httpServer.identity.primaryPort}/test_css_messages.html`;
 
 add_task(async function () {
+  await pushPref("layout.css.nesting.enabled", true);
   await testWatchingCssMessages();
   await testWatchingCachedCssMessages();
 });

diff --git a/dom/webidl/CSSStyleRule.webidl b/dom/webidl/CSSStyleRule.webidl
@@ -9,10 +9,17 @@
 
 // https://drafts.csswg.org/cssom/#the-cssstylerule-interface
 [Exposed=Window]
-interface CSSStyleRule : CSSGroupingRule {
+interface CSSStyleRule : CSSRule {
   attribute UTF8String selectorText;
   [SameObject, PutForwards=cssText] readonly attribute CSSStyleDeclaration style;
 
+  // https://drafts.csswg.org/css-nesting/#cssom-style
+  // FIXME: Ideally CSSStyleRule should inherit from CSSGroupingRule instead,
+  // see https://github.com/w3c/csswg-drafts/issues/8940
+  [Pref="layout.css.nesting.enabled", SameObject] readonly attribute CSSRuleList cssRules;
+  [Pref="layout.css.nesting.enabled", Throws] unsigned long insertRule(UTF8String rule, optional unsigned long index = 0);
+  [Pref="layout.css.nesting.enabled", Throws] undefined deleteRule(unsigned long index);
+
   [ChromeOnly] readonly attribute unsigned long selectorCount;
   [ChromeOnly] UTF8String selectorTextAt(unsigned long index, optional boolean desugared = false);
   [ChromeOnly] unsigned long long selectorSpecificityAt(unsigned long index, optional boolean desugared = false);

diff --git a/layout/inspector/tests/mochitest.ini b/layout/inspector/tests/mochitest.ini
@@ -1,5 +1,6 @@
 [DEFAULT]
 prefs =
+  layout.css.nesting.enabled=true
   layout.css.basic-shape-rect.enabled=true
   layout.css.basic-shape-xywh.enabled=true
 support-files =

diff --git a/modules/libpref/init/StaticPrefList.yaml b/modules/libpref/init/StaticPrefList.yaml
@@ -8176,6 +8176,13 @@
   mirror: always
   rust: true
 
+# Whether CSS nesting is enabled.
+- name: layout.css.nesting.enabled
+  type: RelaxedAtomicBool
+  value: true
+  mirror: always
+  rust: true
+
 # Should we look for counter ancestor scopes first?
 - name: layout.css.counter-ancestor-scope.enabled
   type: bool

diff --git a/servo/components/style/gecko/selector_parser.rs b/servo/components/style/gecko/selector_parser.rs
@@ -307,9 +307,8 @@ impl<'a, 'i> ::selectors::Parser<'i> for SelectorParser<'a> {
     type Impl = SelectorImpl;
     type Error = StyleParseErrorKind<'i>;
 
-    #[inline]
     fn parse_parent_selector(&self) -> bool {
-        true
+        static_prefs::pref!("layout.css.nesting.enabled")
     }
 
     #[inline]

diff --git a/servo/components/style/stylesheets/rule_parser.rs b/servo/components/style/stylesheets/rule_parser.rs
@@ -501,6 +501,15 @@ impl NestedParseResult {
 }
 
 impl<'a, 'i> NestedRuleParser<'a, 'i> {
+    /// When nesting is disabled, we prevent parsing at rules and qualified rules inside style
+    /// rules.
+    fn allow_at_and_qualified_rules(&self) -> bool {
+        if !self.in_style_rule() {
+            return true;
+        }
+        static_prefs::pref!("layout.css.nesting.enabled")
+    }
+
     #[inline]
     fn in_style_rule(&self) -> bool {
         self.context.rule_types.contains(CssRuleType::Style)
@@ -613,6 +622,9 @@ impl<'a, 'i> AtRuleParser<'i> for NestedRuleParser<'a, 'i> {
         name: CowRcStr<'i>,
         input: &mut Parser<'i, 't>,
     ) -> Result<Self::Prelude, ParseError<'i>> {
+        if self.in_style_rule() && !static_prefs::pref!("layout.css.nesting.enabled") {
+            return Err(input.new_error(BasicParseErrorKind::AtRuleInvalid(name)));
+        }
         Ok(match_ignore_ascii_case! { &*name,
             "media" => {
                 let media_queries = MediaList::parse(&self.context, input);
@@ -922,7 +934,9 @@ impl<'a, 'i> DeclarationParser<'i> for NestedRuleParser<'a, 'i> {
 }
 
 impl<'a, 'i> RuleBodyItemParser<'i, (), StyleParseErrorKind<'i>> for NestedRuleParser<'a, 'i> {
-    fn parse_qualified(&self) -> bool { true }
+    fn parse_qualified(&self) -> bool {
+        self.allow_at_and_qualified_rules()
+    }
 
     /// If nesting is disabled, we can't get there for a non-style-rule. If it's enabled, we parse
     /// raw declarations there.

diff --git a/testing/web-platform/meta/css/CSS2/syntax/malformed-decl-block-001.xht.ini b/testing/web-platform/meta/css/CSS2/syntax/malformed-decl-block-001.xht.ini
@@ -0,0 +1 @@
+prefs: [layout.css.nesting.enabled:true]
diff --git a/testing/web-platform/meta/css/css-nesting/__dir__.ini b/testing/web-platform/meta/css/css-nesting/__dir__.ini
@@ -0,0 +1 @@
+prefs: [layout.css.nesting.enabled:true]
diff --git a/testing/web-platform/tests/css/css-nesting/cssom.html b/testing/web-platform/tests/css/css-nesting/cssom.html
@@ -8,10 +8,6 @@
 <style id="ss"></style>
 
 <script>
-  test(() => {
-    assert_equals(CSSStyleRule.__proto__, CSSGroupingRule);
-  }, "CSSStyleRule is a CSSGroupingRule");
-
   test(() => {
     let [ss] = document.styleSheets;
     assert_equals(ss.cssRules.length, 0);