independent-inheritance-fast-path-slots.html

<!DOCTYPE html>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<div id="host">
  <div id="c1">
    <!-- To ensure the fast path is working, add children and check their styles don't recalc. -->
    <div></div><div></div><div></div><div></div><div></div><div></div>
  </div>
  <div id="c2"></div>
  <div id="c3"></div>
</div>
<script>
// The aim of this test is to check that independent inheritance work down the
// flat tree through slot elements.
test(function(t)
{
    var shadow_root = host.attachShadow({mode: 'closed'});
    var span = document.createElement("span");
    span.appendChild(document.createElement("slot"));
    shadow_root.appendChild(span);

    assert_equals(getComputedStyle(c1).pointerEvents, "auto");
    assert_equals(getComputedStyle(c2).pointerEvents, "auto");

    host.scrollTop; // Force recalc.
    span.style.pointerEvents = "none";
    // Only one element should do a recalc. Independent inheritance down to the
    // 3 child divs.
    assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 1);

    assert_equals(getComputedStyle(c1).pointerEvents, "none");
    assert_equals(getComputedStyle(c2).pointerEvents, "none");

}, "Changing pointerEvents, an independent inherited property, propagates correctly through slotted elements.");
</script>
chromium/third_party/blink/web_tests/fast/css/invalidation/independent-inheritance-fast-path-slots.html
