| <!DOCTYPE html> |
| <script src="../../../resources/testharness.js"></script> |
| <script src="../../../resources/testharnessreport.js"></script> |
| <style> |
| .class + span { color:green } |
| </style> |
| <div id="host1"><div id="host2"></div>Remove me</div> |
| <script> |
| test(() => { |
| // Create shadow for outer host. |
| host1.attachShadow({mode:"open"}); |
| |
| // Add two children for doing sibling invalidation in inner shadow. |
| var root2 = host2.attachShadow({mode:"open"}); |
| root2.innerHTML = "<span></span><span></span>"; |
| var span = root2.firstChild; |
| |
| // Force style and layout update. |
| document.body.offsetTop; |
| |
| // Schedule sibling invalidation. |
| span.setAttribute("class", "class"); |
| // Reschedule sibling invalidation on shadow root. |
| span.remove(); |
| |
| // Trigger re-distribution in outer shadow which triggers |
| // lazy-reattach-if-attached on #host2. |
| host1.lastChild.remove(); |
| }, "DetachLayoutTree on a shadow host should clear style invalidations on " + |
| "its shadow root. This test should not trigger a DCHECK nor crash."); |
| </script> |