shadowrootadoptedstylesheets-with-declarative-module.html

Enable keyboard shortcuts

This test has a WPT meta file that expects 2 subtest issues.
This WPT test may be referenced by the following Test IDs:
- /shadow-dom/declarative/tentative/shadowrootadoptedstylesheets/shadowrootadoptedstylesheets-with-declarative-module.html - WPT Dashboard Interop Dashboard

<!DOCTYPE html>

<title>shadowrootadoptedstylesheets with Declarative CSS Module</title>

<meta name="author" title="Kurt Catti-Schmidt" href="mailto:kschmi@microsoft.com" />

<link rel='help' href='https://github.com/whatwg/html/pull/11687'>

<script src='/resources/testharness.js'></script>

<script src='/resources/testharnessreport.js'></script>

<style type="module" specifier="foo">

span {color:blue}

</style>

<div id="host">

  <template shadowrootmode="open" shadowrootadoptedstylesheets="foo">

    <span id="test_element">Test content</span>

  </template>

</div>

<script>

  const host = document.getElementById("host");

  test(function (t) {

    assert_equals(

      host.shadowRoot.adoptedStyleSheets.length,

1,

      "The shadowrootadoptedstylesheets will declaratively import named specifiers into the adoptedStyleSheets array.",

);

   }, "adoptedStyleSheets is populated from a <template> element's shadowrootadoptedstylesheets attribute.");

  const test_element = host.shadowRoot.getElementById("test_element");

  test(function (t) {

    assert_equals(getComputedStyle(test_element)

              .color, "rgb(0, 0, 255)",

              "Declarative styles were applied.");

  }, "Styles from the adoptedStyleSheets are applied to elements.");

</script>