third_party/WebKit/LayoutTests/fast/css/invalidation/detach-reattach-shadow.html

   1 <!DOCTYPE html>
   2 <script src="../../../resources/js-test.js"></script>
   3 <style>
   4   body /deep/ .a { width: 100px; height: 100px; background-color: green; }
   5 </style>
   6 <script>
   7     var inner;
   8     onload = function() {
   9         var root = document.getElementById('root');
  10         var shadowContainer = document.createElement('div');
  11         root.appendChild(shadowContainer);
  12
  13         var shadowRoot = shadowContainer.createShadowRoot();
  14         var mid = document.createElement('div');
  15         shadowRoot.appendChild(mid);
  16
  17         inner = document.createElement('div');
  18         mid.appendChild(inner);
  19
  20         inner.offsetTop;
  21         inner.classList.add('a');
  22         shadowContainer.remove();
  23         root.offsetTop;
  24         root.appendChild(shadowContainer);
  25         inner.offsetTop;
  26         inner.classList.remove('a');
  27
  28         shouldBe('getComputedStyle(inner).backgroundColor', '"rgba(0, 0, 0, 0)"');
  29     }
  30 </script>
  31 <div id="root"></div>