Node-appendChild-script-and-default-style-meta-from-fragment.tentative.html

Enable keyboard shortcuts

This test has a WPT meta file that expects 1 subtest issues.
This WPT test may be referenced by the following Test IDs:
- /dom/nodes/insertion-removing-steps/Node-appendChild-script-and-default-style-meta-from-fragment.tentative.html - WPT Dashboard Interop Dashboard

<!doctype html>

<meta charset=utf-8>

<title>Node.appendChild: inserting script and default-style meta from a fragment</title>

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

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

<link rel="alternate stylesheet" title="alternative" href="data:text/css,%23div{display:none}">

<div id="div">hello</div>

<script>

let scriptRan = false;

let computedStyleInPreScript = null;

let computedStyleInPostScript = null;

test(() => {

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

  // 1. Gets inserted *before* the `<meta>` tag. Cannot observe the meta tag's

  // effect, because this script runs before the meta tag's post-insertion steps

  // run, and the meta tag's post-insertion steps is where the default style

  // sheet actually changes.

  const preScript = document.createElement("script");

  preScript.textContent =  `

    computedStyleInPreScript = getComputedStyle(div).display;

    scriptRan = true;

`;

  // 2. The `<meta>` tag itself.

  const meta = document.createElement("meta");

  meta.httpEquiv = "default-style";

  meta.content = "alternative";

  // 3. Gets inserted *after* the `<meta>` tag. Observes the meta tag's effect,

  // because this script runs after the meta tag's post-insertion steps, which

  // has the script-observable change to the default style sheet.

  const postScript = document.createElement("script");

  postScript.textContent = `

    computedStyleInPostScript = getComputedStyle(div).display;

    scriptRan = true;

`;

  const df = document.createDocumentFragment();

  df.append(preScript, meta, postScript);

  assert_equals(getComputedStyle(div).display, "block",

      "div still has block display before meta insertion");

  assert_false(scriptRan, "script has not run before insertion");

  document.head.appendChild(df);

  assert_true(scriptRan, "script has run after insertion");

  assert_equals(computedStyleInPreScript, "block",

      "display: none; style was NOT applied during DOM insertion steps, " +

      "before earlier-inserted script post-insertion steps run");

  assert_equals(computedStyleInPostScript, "none",

      "display: none; style WAS applied during DOM post-insertion steps, " +

      "before later-inserted script runs");

  assert_equals(getComputedStyle(div).display, "none",

      "style remains display: none; after insertion");

}, "Inserting <meta> that uses alternate stylesheets, applies the style " +

   "during DOM post-insertion steps");

</script>