popover-anchor-display-none.tentative.html (886B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>Tests that a popover can be anchored to an unrendered element.</title> 4 <link rel=author href="mailto:xiaochengh@chromium.org"> 5 <link rel=help href="https://open-ui.org/components/popover.research.explainer"> 6 <link rel=help href="https://html.spec.whatwg.org/multipage/popover.html"> 7 <script src="/resources/testharness.js"></script> 8 <script src="/resources/testharnessreport.js"></script> 9 10 <div id=popover popover anchor=anchor></div> 11 <div id=anchor></div> 12 13 <style> 14 #anchor { 15 display: none; 16 } 17 [popover] { 18 inset: auto; 19 background: lime; 20 padding: 0; 21 border: 0; 22 width: 100px; 23 height: 100px; 24 top: anchor(top, 100px); 25 left: anchor(left, 100px); 26 } 27 </style> 28 29 <script> 30 test(() => { 31 popover.showPopover(); 32 assert_equals(popover.offsetLeft, 100); 33 assert_equals(popover.offsetTop, 100); 34 }); 35 </script>