elementFromPoint-dynamic-anon-box.html (1310B)
1 <!doctype html> 2 <meta charset="utf-8"> 3 <title>CSS Test: Hit testing on element previously hidden by an anonymous scroll box</title> 4 <link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io"> 5 <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1433591"> 6 <script src="/resources/testharness.js"></script> 7 <script src="/resources/testharnessreport.js"></script> 8 <style> 9 html, body { 10 margin: 0; 11 padding: 0; 12 } 13 /* 14 Create a hidden scrollbox that occupies the whole viewport, then give it 15 visibility: hidden dynamically. The link previously under the scrollbox 16 should be clickable. 17 */ 18 .scrollable { 19 position: absolute; 20 top: 0; 21 left: 0; 22 width: 100vw; 23 height: 100vh; 24 overflow: scroll; 25 } 26 27 .scrollable .inner { 28 display: table-cell; 29 width: 100vw; 30 height: 100vh; 31 } 32 </style> 33 <div class="scrollable"> 34 <div class="inner"></div> 35 </div> 36 <a href="#">Should be clickable</a> 37 <script> 38 test(function() { 39 assert_equals(document.elementFromPoint(10, 10).tagName, "DIV", 40 "Should hit the scrollbox contents"); 41 document.querySelector('div').style.visibility = "hidden"; 42 assert_equals(document.elementFromPoint(10, 10), document.querySelector('a')); 43 }, "Link should be clickable after hiding a scrollbox with an anonymous table inside"); 44 </script>