1 files changed, 60 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-cascade/scope-shadow.html b/testing/web-platform/tests/css/css-cascade/scope-shadow.html
new file mode 100644
index 0000000000..100438f534
--- /dev/null
+++ b/testing/web-platform/tests/css/css-cascade/scope-shadow.html
@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<title>@scope - ShadowDOM</title>
+<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 shadowrootmode=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 shadowrootmode=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>