anchor-transition-004.html (948B)
1 <!DOCTYPE html> 2 <title>CSS Anchor Positioning Test: getComputedStyle not affecting anchor transition</title> 3 <link rel="help" href="https://drafts.csswg.org/css-anchor-position-1/"> 4 <script src="/resources/testharness.js"></script> 5 <script src="/resources/testharnessreport.js"></script> 6 <style> 7 body { margin: 0; } 8 #anchor { 9 anchor-name: --a; 10 width: 100px; 11 height: 100px; 12 background: teal; 13 } 14 #anchored { 15 position: absolute; 16 position-anchor: --a; 17 left: anchor(right, 17px); 18 top: anchor(top, 17px); 19 width: 100px; 20 height: 100px; 21 background: orange; 22 transition: left 2s; 23 } 24 </style> 25 <div id="anchor"></div> 26 <div id="anchored"></div> 27 <script> 28 test(() => { 29 // Force a style update 30 getComputedStyle(document.body).color; 31 assert_equals(anchored.offsetLeft, 100); 32 }, "getComputedStyle should not affect whether an anchor positioned element transitions from display:none"); 33 </script>