block-string-assignment-to-ShadowRoot-innerHTML.html

Enable keyboard shortcuts

This WPT test may be referenced by the following Test IDs:
- /trusted-types/block-string-assignment-to-ShadowRoot-innerHTML.html - WPT Dashboard Interop Dashboard

<!DOCTYPE html>

<html>

<head>

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

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

  <script src="support/helper.sub.js"></script>

  <meta http-equiv="Content-Security-Policy" content="require-trusted-types-for 'script';">

</head>

<body>

<div id="container"></div>

<script>

  var container = document.querySelector('#container')

  const cleanupPolicy =

    trustedTypes.createPolicy('cleanup', { createHTML: _ => "" });

  function cleanup() { container.innerHTML = cleanupPolicy.createHTML(""); }

  // TrustedHTML assignments do not throw.

  test(t => {

    t.add_cleanup(cleanup);

    let p = createHTML_policy(window, 1);

    let html = p.createHTML(INPUTS.HTML);

    let d = document.createElement('div');

    let s = d.attachShadow({mode: 'open'});

    document.querySelector('#container').appendChild(d);

    s.innerHTML = html;

    assert_equals(s.innerHTML, RESULTS.HTML);

  }, "shadowRoot.innerHTML = html assigned via policy (successful HTML transformation).");

  // String assignments throw.

  test(t => {

    t.add_cleanup(cleanup);

    let d = document.createElement('div');

    let s = d.attachShadow({mode: 'open'});

    container.appendChild(d);

    assert_throws_js(TypeError, _ => {

      s.innerHTML = "Fail";

});

    assert_equals(s.innerHTML, "");

  }, "`shadowRoot.innerHTML = string` throws.");

  // Null assignment throws.

  test(t => {

    t.add_cleanup(cleanup);

    let d = document.createElement('div');

    let s = d.attachShadow({mode: 'open'});

    container.appendChild(d);

    assert_throws_js(TypeError, _ => {

      s.innerHTML = null;

});

    assert_equals(s.innerHTML, "");

  }, "`shadowRoot.innerHTML = null` throws.");

  // After default policy creation string assignment implicitly calls createHTML.

  test(t => {

    t.add_cleanup(cleanup);

    let p = window.trustedTypes.createPolicy("default", { createHTML: createHTMLJS });

    let d = document.createElement('div');

    let s = d.attachShadow({mode: 'open'});

    document.querySelector('#container').appendChild(d);

    s.innerHTML = INPUTS.HTML;

    assert_equals(s.innerHTML, RESULTS.HTML);

  }, "`shadowRoot.innerHTML = string` assigned via default policy (successful HTML transformation).");

  // After default policy creation null assignment implicitly calls createHTML.

  // null is treated as an empty string.

  test(t => {

    t.add_cleanup(cleanup);

    let d = document.createElement('div');

    let s = d.attachShadow({mode: 'open'});

    container.appendChild(d);

    s.innerHTML = null;

    assert_equals(s.innerHTML, "");

  }, "`shadowRoot.innerHTML = string` assigned via default policy does not throw");

</script>

</body>

</html>