script: Create CSSStyleOwner::Null for getComputedStyle (#36272)

This new `CSSStyleOwner` variant is used when the pseudo-element
argument fails to parse properly or is for some unknown or unsupported
pseudo-element.

Testing: There are tests for this change. Various tests start to pass
and some start to
fail. New failures are due to partial or fully missing support for
pseudo-elements such
as:
 - `::selection`
 - `::first-letter` and `::first-line`
 - `::marker`

Co-authored-by: Oriol Brufau <obrufau@igalia.com>
Signed-off-by: Martin Robinson <mrobinson@igalia.com>

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>

components/script/dom/cssstyledeclaration.rs

@@ -45,6 +45,9 @@ pub(crate) struct CSSStyleDeclaration {
 #[derive(JSTraceable, MallocSizeOf)]
 #[cfg_attr(crown, crown::unrooted_must_root_lint::must_root)]
 pub(crate) enum CSSStyleOwner {
+    /// Used when calling `getComputedStyle()` with an invalid pseudo-element selector.
+    /// See <https://drafts.csswg.org/cssom/#dom-window-getcomputedstyle>
+    Null,
     Element(Dom<Element>),
     CSSRule(
         Dom<CSSRule>,
@@ -66,6 +69,9 @@ impl CSSStyleOwner {
         // This is somewhat complex but the complexity is encapsulated.
         let mut changed = true;
         match *self {
+            CSSStyleOwner::Null => unreachable!(
+                "CSSStyleDeclaration should always be read-only when CSSStyleOwner is Null"
+            ),
             CSSStyleOwner::Element(ref el) => {
                 let document = el.owner_document();
                 let shared_lock = document.style_shared_lock();
@@ -135,6 +141,9 @@ impl CSSStyleOwner {
         F: FnOnce(&PropertyDeclarationBlock) -> R,
     {
         match *self {
+            CSSStyleOwner::Null => {
+                unreachable!("Should never call with_block for CSStyleOwner::Null")
+            },
             CSSStyleOwner::Element(ref el) => match *el.style_attribute().borrow() {
                 Some(ref pdb) => {
                     let document = el.owner_document();
@@ -155,6 +164,9 @@ impl CSSStyleOwner {
 
     fn window(&self) -> DomRoot<Window> {
         match *self {
+            CSSStyleOwner::Null => {
+                unreachable!("Should never try to access window of CSStyleOwner::Null")
+            },
             CSSStyleOwner::Element(ref el) => el.owner_window(),
             CSSStyleOwner::CSSRule(ref rule, _) => DomRoot::from_ref(rule.global().as_window()),
         }
@@ -162,6 +174,9 @@ impl CSSStyleOwner {
 
     fn base_url(&self) -> ServoUrl {
         match *self {
+            CSSStyleOwner::Null => {
+                unreachable!("Should never try to access base URL of CSStyleOwner::Null")
+            },
             CSSStyleOwner::Element(ref el) => el.owner_document().base_url(),
             CSSStyleOwner::CSSRule(ref rule, _) => ServoUrl::from(
                 rule.parent_stylesheet()
@@ -221,6 +236,13 @@ impl CSSStyleDeclaration {
         pseudo: Option<PseudoElement>,
         modification_access: CSSModificationAccess,
     ) -> CSSStyleDeclaration {
+        // If creating a CSSStyleDeclaration with CSSSStyleOwner::Null, this should always
+        // be in read-only mode.
+        assert!(
+            !matches!(owner, CSSStyleOwner::Null) ||
+                modification_access == CSSModificationAccess::Readonly
+        );
+
         CSSStyleDeclaration {
             reflector_: Reflector::new(),
             owner,
@@ -262,10 +284,15 @@ impl CSSStyleDeclaration {
                 node.owner_window()
                     .resolved_style_query(addr, self.pseudo, property, can_gc)
             },
+            CSSStyleOwner::Null => DOMString::new(),
         }
     }
 
     fn get_property_value(&self, id: PropertyId, can_gc: CanGc) -> DOMString {
+        if matches!(self.owner, CSSStyleOwner::Null) {
+            return DOMString::new();
+        }
+
         if self.readonly {
             // Readonly style declarations are used for getComputedStyle.
             return self.get_computed_style(id, can_gc);
@@ -388,6 +415,10 @@ pub(crate) static ENABLED_LONGHAND_PROPERTIES: LazyLock<Vec<LonghandId>> = LazyL
 impl CSSStyleDeclarationMethods<crate::DomTypeHolder> for CSSStyleDeclaration {
     // https://dev.w3.org/csswg/cssom/#dom-cssstyledeclaration-length
     fn Length(&self) -> u32 {
+        if matches!(self.owner, CSSStyleOwner::Null) {
+            return 0;
+        }
+
         if self.readonly {
             // Readonly style declarations are used for getComputedStyle.
             // TODO: include custom properties whose computed value is not the guaranteed-invalid value.
@@ -489,6 +520,9 @@ impl CSSStyleDeclarationMethods<crate::DomTypeHolder> for CSSStyleDeclaration {
 
     // https://dev.w3.org/csswg/cssom/#the-cssstyledeclaration-interface
     fn IndexedGetter(&self, index: u32) -> Option<DOMString> {
+        if matches!(self.owner, CSSStyleOwner::Null) {
+            return None;
+        }
         if self.readonly {
             // Readonly style declarations are used for getComputedStyle.
             // TODO: include custom properties whose computed value is not the guaranteed-invalid value.

components/script/dom/window.rs

@@ -1241,7 +1241,13 @@ impl WindowMethods<crate::DomTypeHolder> for Window {
         element: &Element,
         pseudo: Option<DOMString>,
     ) -> DomRoot<CSSStyleDeclaration> {
-        // Steps 1-4.
+        // Step 2: Let obj be elt.
+        // We don't store CSSStyleOwner directly because it stores a `Dom` which must be
+        // rooted. This avoids the rooting the value temporarily.
+        let mut is_null = false;
+
+        // Step 3: If pseudoElt is provided, is not the empty string, and starts with a colon, then:
+        // Step 3.1: Parse pseudoElt as a <pseudo-element-selector>, and let type be the result.
         let pseudo = pseudo.map(|mut s| {
             s.make_ascii_lowercase();
             s
@@ -1253,13 +1259,38 @@ impl WindowMethods<crate::DomTypeHolder> for Window {
             Some(ref pseudo) if pseudo == ":after" || pseudo == "::after" => {
                 Some(PseudoElement::After)
             },
+            Some(ref pseudo) if pseudo == "::selection" => Some(PseudoElement::Selection),
+            Some(ref pseudo) if pseudo.starts_with(':') => {
+                // Step 3.2: If type is failure, or is a ::slotted() or ::part()
+                // pseudo-element, let obj be null.
+                is_null = true;
+                None
+            },
             _ => None,
         };
 
-        // Step 5.
+        // Step 4. Let decls be an empty list of CSS declarations.
+        // Step 5: If obj is not null, and elt is connected, part of the flat tree, and
+        // its shadow-including root has a browsing context which either doesn’t have a
+        // browsing context container, or whose browsing context container is being
+        // rendered, set decls to a list of all longhand properties that are supported CSS
+        // properties, in lexicographical order, with the value being the resolved value
+        // computed for obj using the style rules associated with doc.  Additionally,
+        // append to decls all the custom properties whose computed value for obj is not
+        // the guaranteed-invalid value.
+        //
+        // Note: The specification says to generate the list of declarations beforehand, yet
+        // also says the list should be alive. This is why we do not do step 4 and 5 here.
+        // See: https://github.com/w3c/csswg-drafts/issues/6144
+        //
+        // Step 6:  Return a live CSSStyleProperties object with the following properties:
         CSSStyleDeclaration::new(
             self,
-            CSSStyleOwner::Element(Dom::from_ref(element)),
+            if is_null {
+                CSSStyleOwner::Null
+            } else {
+                CSSStyleOwner::Element(Dom::from_ref(element))
+            },
             pseudo,
             CSSModificationAccess::Readonly,
             CanGc::note(),

tests/wpt/meta/css/css-pseudo/highlight-cascade/highlight-cascade-007.html.ini

@@ -16,3 +16,21 @@
 
   [U span::selection’s own text-decoration-thickness respects U span’s font-size]
     expected: FAIL
+
+  [M::selection’s font-size is the same as in M]
+    expected: FAIL
+
+  [M span::selection’s font-size is the same as in M span]
+    expected: FAIL
+
+  [W::selection’s line-height is the same as in W]
+    expected: FAIL
+
+  [W span::selection’s line-height is the same as in W span]
+    expected: FAIL
+
+  [U::selection’s font-size is the same as in U]
+    expected: FAIL
+
+  [U span::selection’s font-size is the same as in U span]
+    expected: FAIL

tests/wpt/meta/css/css-pseudo/highlight-cascade/highlight-cascade-009.html.ini

@@ -1,6 +0,0 @@
-[highlight-cascade-009.html]
-  [body ::selection does not use its own custom property]
-    expected: FAIL
-
-  [div::selection does not use its own custom property]
-    expected: FAIL

tests/wpt/meta/css/css-pseudo/highlight-cascade/highlight-cascade-011.html.ini

@@ -1,3 +0,0 @@
-[highlight-cascade-011.html]
-  [div::selection does not inherit custom properties from the highlight parent]
-    expected: FAIL

tests/wpt/meta/css/css-pseudo/highlight-cascade/highlight-currentcolor-computed-visited.html.ini

@@ -0,0 +1,36 @@
+[highlight-currentcolor-computed-visited.html]
+  [getComputedStyle() for ::selection at #target1]
+    expected: FAIL
+
+  [getComputedStyle() for ::selection at #target2]
+    expected: FAIL
+
+  [getComputedStyle() for ::target-text at #target1]
+    expected: FAIL
+
+  [getComputedStyle() for ::target-text at #target2]
+    expected: FAIL
+
+  [getComputedStyle() for ::search-text at #target1]
+    expected: FAIL
+
+  [getComputedStyle() for ::search-text at #target2]
+    expected: FAIL
+
+  [getComputedStyle() for ::spelling-error at #target1]
+    expected: FAIL
+
+  [getComputedStyle() for ::spelling-error at #target2]
+    expected: FAIL
+
+  [getComputedStyle() for ::grammar-error at #target1]
+    expected: FAIL
+
+  [getComputedStyle() for ::grammar-error at #target2]
+    expected: FAIL
+
+  [getComputedStyle() for ::highlight(foo) at #target1]
+    expected: FAIL
+
+  [getComputedStyle() for ::highlight(foo) at #target2]
+    expected: FAIL

tests/wpt/meta/css/css-pseudo/highlight-cascade/highlight-currentcolor-computed.html.ini

@@ -1,10 +1,4 @@
 [highlight-currentcolor-computed.html]
-  [getComputedStyle() for ::selection at #target1]
-    expected: FAIL
-
-  [getComputedStyle() for ::selection at #target2]
-    expected: FAIL
-
   [getComputedStyle() for ::target-text at #target1]
     expected: FAIL
 

tests/wpt/meta/css/css-pseudo/highlight-cascade/highlight-pseudos-computed-search-text.tentative.html.ini

@@ -1,24 +1,3 @@
 [highlight-pseudos-computed-search-text.tentative.html]
   [getComputedStyle() for ::search-text]
     expected: FAIL
-
-  [getComputedStyle() for ::search-text: should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::search-text) should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::search-text( should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::search-text(foo) should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::search-text() should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for :::search-text should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::search-text. should return an empty CSSStyleDeclaration]
-    expected: FAIL

tests/wpt/meta/css/css-pseudo/highlight-cascade/highlight-pseudos-computed.html.ini

@@ -1,123 +1,15 @@
 [highlight-pseudos-computed.html]
-  [getComputedStyle() for ::selection]
-    expected: FAIL
-
-  [getComputedStyle() for ::selection: should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::selection) should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::selection( should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::selection(foo) should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::selection() should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for :::selection should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::selection. should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
   [getComputedStyle() for ::target-text]
     expected: FAIL
 
-  [getComputedStyle() for ::target-text: should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::target-text) should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::target-text( should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::target-text(foo) should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::target-text() should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for :::target-text should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::target-text. should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
   [getComputedStyle() for ::spelling-error]
     expected: FAIL
 
-  [getComputedStyle() for ::spelling-error: should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::spelling-error) should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::spelling-error( should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::spelling-error(foo) should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::spelling-error() should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for :::spelling-error should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::spelling-error. should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
   [getComputedStyle() for ::grammar-error]
     expected: FAIL
 
-  [getComputedStyle() for ::grammar-error: should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::grammar-error) should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::grammar-error( should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::grammar-error(foo) should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::grammar-error() should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for :::grammar-error should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::grammar-error. should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
   [getComputedStyle() for ::highlight(foo)]
     expected: FAIL
 
-  [getComputedStyle() for ::highlight(foo): should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::highlight(foo)) should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::highlight(foo)( should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::highlight(foo)(foo) should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::highlight(foo)() should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for :::highlight(foo) should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
-  [getComputedStyle() for ::highlight(foo). should return an empty CSSStyleDeclaration]
-    expected: FAIL
-
   [Different getComputedStyle() for ::highlight(bar) and same element]
     expected: FAIL

tests/wpt/meta/css/css-pseudo/highlight-cascade/highlight-pseudos-visited-computed-001.html.ini

@@ -1,10 +1,4 @@
 [highlight-pseudos-visited-computed-001.html]
-  [getComputedStyle() for ::selection at #target1]
-    expected: FAIL
-
-  [getComputedStyle() for ::selection at #target2]
-    expected: FAIL
-
   [getComputedStyle() for ::target-text at #target1]
     expected: FAIL
 

tests/wpt/meta/css/css-pseudo/marker-computed-content.html.ini

@@ -16,3 +16,15 @@
 
   [Computed 'content' for non-list-item ::marker, variant none]
     expected: FAIL
+
+  [Computed 'content' for list-item ::marker, variant default]
+    expected: FAIL
+
+  [Computed 'content' for list-item ::marker, variant normal]
+    expected: FAIL
+
+  [Computed 'content' for non-list-item ::marker, variant default]
+    expected: FAIL
+
+  [Computed 'content' for non-list-item ::marker, variant normal]
+    expected: FAIL

tests/wpt/meta/css/css-pseudo/marker-default-styles.html.ini

@@ -70,3 +70,27 @@
 
   [Computed value of 'text-indent' for inside marker]
     expected: FAIL
+
+  [Computed value of 'unicode-bidi' for outside symbol]
+    expected: FAIL
+
+  [Computed value of 'unicode-bidi' for outside decimal]
+    expected: FAIL
+
+  [Computed value of 'unicode-bidi' for outside string]
+    expected: FAIL
+
+  [Computed value of 'unicode-bidi' for outside marker]
+    expected: FAIL
+
+  [Computed value of 'unicode-bidi' for inside symbol]
+    expected: FAIL
+
+  [Computed value of 'unicode-bidi' for inside decimal]
+    expected: FAIL
+
+  [Computed value of 'unicode-bidi' for inside string]
+    expected: FAIL
+
+  [Computed value of 'unicode-bidi' for inside marker]
+    expected: FAIL

tests/wpt/meta/css/css-pseudo/selection-universal-shadow-dom.html.ini

@@ -1,3 +0,0 @@
-[selection-universal-shadow-dom.html]
-  [getComputedStyle() for #target ::selection]
-    expected: FAIL

tests/wpt/meta/css/css-variables/variable-first-letter.html.ini

@@ -11,3 +11,8 @@
   [nested color]
     expected: FAIL
 
+  [position]
+    expected: FAIL
+
+  [abspos]
+    expected: FAIL

tests/wpt/meta/css/css-variables/variable-first-line.html.ini

@@ -11,3 +11,8 @@
   [nested color]
     expected: FAIL
 
+  [position]
+    expected: FAIL
+
+  [abspos]
+    expected: FAIL

tests/wpt/meta/css/cssom/getComputedStyle-pseudo-checkmark.html.ini

@@ -1,6 +1,3 @@
 [getComputedStyle-pseudo-checkmark.html]
-  [Resolution of width is correct when pseudo-element argument is ignored (due to single-colon)]
-    expected: FAIL
-
   [Resolution of width is correct for pseudo-element (due to double-colon)]
     expected: FAIL

tests/wpt/meta/css/cssom/getComputedStyle-pseudo-picker-icon.html.ini

@@ -2,8 +2,5 @@
   [Resolution of width is correct when pseudo-element argument is ignored (due to no colon)]
     expected: FAIL
 
-  [Resolution of width is correct when pseudo-element argument is ignored (due to single-colon)]
-    expected: FAIL
-
   [Resolution of width is correct for pseudo-element (due to double-colon)]
     expected: FAIL

tests/wpt/meta/css/cssom/getComputedStyle-pseudo-with-argument.html.ini

@@ -13,54 +13,3 @@
 
   [This pseudo-element should parse: ::highlight( n\\61me )]
     expected: FAIL
-
-  [This pseudo-element should not parse: ::before(test)]
-    expected: FAIL
-
-  [This pseudo-element should not parse: ::highlight]
-    expected: FAIL
-
-  [This pseudo-element should not parse: ::highlight(]
-    expected: FAIL
-
-  [This pseudo-element should not parse: ::highlight()]
-    expected: FAIL
-
-  [This pseudo-element should not parse: ::highlight(1)]
-    expected: FAIL
-
-  [This pseudo-element should not parse: ::highlight($)]
-    expected: FAIL
-
-  [This pseudo-element should not parse: ::highlight (name)]
-    expected: FAIL
-
-  [This pseudo-element should not parse: ::highlight(name)a]
-    expected: FAIL
-
-  [This pseudo-element should not parse: ::view-transition-group(*)]
-    expected: FAIL
-
-  [This pseudo-element should not parse: :highlight(name)]
-    expected: FAIL
-
-  [This pseudo-element should not parse: ::view-transition-image-pair(*)]
-    expected: FAIL
-
-  [This pseudo-element should not parse: ::view-transition-old(*)]
-    expected: FAIL
-
-  [This pseudo-element should not parse: ::view-transition-new(*)]
-    expected: FAIL
-
-  [This pseudo-element should not parse: :view-transition-group(name)]
-    expected: FAIL
-
-  [This pseudo-element should not parse: :view-transition-image-pair(name)]
-    expected: FAIL
-
-  [This pseudo-element should not parse: :view-transition-old(name)]
-    expected: FAIL
-
-  [This pseudo-element should not parse: :view-transition-new(name)]
-    expected: FAIL

tests/wpt/meta/css/cssom/getComputedStyle-pseudo.html.ini

@@ -8,9 +8,6 @@
   [Unknown pseudo-elements throw]
     expected: FAIL
 
-  [Unknown pseudo-elements]
-    expected: FAIL
-
   [Unknown pseudo-element with a known string (ex: marker)]
     expected: FAIL
 
@@ -52,6 +49,3 @@
 
   [Unknown pseudo-element with a known identifier: view-transition-new(name)]
     expected: PRECONDITION_FAILED
-
-  [Resolution of width is correct when pseudo-element argument is invalid (due to a trailing token)]
-    expected: FAIL

tests/wpt/meta/html/rendering/non-replaced-elements/form-controls/placeholder-opacity-default.tentative.html.ini

@@ -0,0 +1,3 @@
+[placeholder-opacity-default.tentative.html]
+  [Default opacity value is '1']
+    expected: FAIL