remove-hovered-element.html (1190B)
1 <!doctype html> 2 <html class="reftest-wait"> 3 <title>Selectors: :hover style cleared on ancestor when hovered element is removed.</title> 4 <link rel="help" href="https://drafts.csswg.org/selectors/#the-hover-pseudo"> 5 <link rel="match" href="remove-hovered-element-ref.html"> 6 <script src="/common/reftest-wait.js"></script> 7 <script src="/resources/testdriver.js"></script> 8 <script src="/resources/testdriver-actions.js"></script> 9 <script src="/resources/testdriver-vendor.js"></script> 10 <style> 11 div { 12 width: 100px; 13 height: 100px; 14 background: green; 15 } 16 #outer:hover { 17 background-color: red; 18 } 19 #relative { 20 position: relative; 21 left: 150px; 22 } 23 </style> 24 <p>Clicking the right square should make the left one go green.</p> 25 <div id="outer"> 26 <div id="relative"><div id="inner">Click me</div></div> 27 </div> 28 <script> 29 inner.addEventListener("click", () => { 30 relative.style.display = "none"; 31 // force layout box removal 32 document.body.offsetTop; 33 relative.remove(); 34 takeScreenshot(); 35 }); 36 37 // Hover #inner and click. 38 var actions = new test_driver.Actions(); 39 actions.pointerMove(0, 0, {origin: inner}).pointerDown().pointerUp().send(); 40 </script>