Bug 1818014 [wpt PR 38610] - [@scope] Support @scope (:host), a=testonly

Automatic update from web-platform-tests
[@scope] Support @scope (:host)

In CalculateActivations, we'd previously just call
Element.parentElement up the ancestor chain, therefore never
reach the host. Additionally, we did not propagate the original
SelectorCheckerContext.scope which is needed for :host to match.

This CL uses ParentOrShadowHostElement, and adds the concept of
"activation ceiling" to deal with the fact that we need to look at
one element *above* the current activation root when that root is a
ShadowRoot.

Note that :scope is supposed to be able to match "virtual" roots [1]
(like a ShadowRoot), but Blink does not support this in general.
This CL does not address this issue.

[1] w3c/csswg-drafts#7261

Bug: 1280240
Change-Id: I2d0be103f4cd02ec576711b959e075a5118e694a
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4272396
Commit-Queue: Anders Hartvoll Ruud 
Reviewed-by: Rune Lillesveen 
Cr-Commit-Position: refs/heads/main@{#1108363}

--

wpt-commits: 37ffe7edc5b6400a16ba6511ba2fd392ab8be318
wpt-pr: 38610

Author: andruud

testing/web-platform/tests/css/css-cascade/scope-shadow.html

@@ -0,0 +1,60 @@
+>
+<title>@scope - ShadowDOMtitle>
+<link rel="help" href="https://drafts.csswg.org/css-cascade-6/#scope-atrule">
+<script src="/resources/testharness.js">script>
+<script src="/resources/testharnessreport.js">script>
+<script src="/resources/declarative-shadow-dom-polyfill.js">script>
+
+<div id=host_plain>
+  <template shadowroot=open>
+    <style>
+      @scope (:host) {
+        .a {
+          z-index: 1;
+        }
+      }
+    style>
+    <div class=a>
+    div>
+  template>
+div>
+<script>
+  setup(() => {
+    polyfill_declarative_shadow_dom(document);
+  });
+
+  test(() => {
+    let a = host_plain.shadowRoot.querySelector('.a');
+    assert_equals(getComputedStyle(a).zIndex, '1');
+  }, '@scope can match :host');
+script>
+
+<div id=host_functional>
+  <template shadowroot=open>
+    <style>
+      @scope (:host(div)) {
+        .a {
+          z-index: 1;
+        }
+      }
+      /* Should not match: */
+      @scope (:host(span)) {
+        .a {
+          z-index: 42;
+        }
+      }
+    style>
+    <div class=a>
+    div>
+  template>
+div>
+<script>
+  setup(() => {
+    polyfill_declarative_shadow_dom(document);
+  });
+
+  test(() => {
+    let a = host_functional.shadowRoot.querySelector('.a');
+    assert_equals(getComputedStyle(a).zIndex, '1');
+  }, '@scope can match :host(...)');
+script>