scroll-timeline-root-dirty.html (1086B)
1 <!DOCTYPE html> 2 <title>Unrelated style mutation does not affect anonymous timeline (root)</title> 3 <link rel="help" href="https://drafts.csswg.org/scroll-animations-1/#scroll-notation"> 4 <script src="/resources/testharness.js"></script> 5 <script src="/resources/testharnessreport.js"></script> 6 <script src="/scroll-animations/scroll-timelines/testcommon.js"></script> 7 <script src="/css/css-animations/support/testcommon.js"></script> 8 <script src="support/testcommon.js"></script> 9 <style> 10 @keyframes anim { 11 from { z-index: 100; } 12 to { z-index: 100; } 13 } 14 #element { 15 animation: anim forwards; 16 animation-timeline: scroll(root); 17 } 18 #spacer { 19 height: 200vh; 20 } 21 </style> 22 <div id=element></div> 23 <div id=spacer></div> 24 25 <script> 26 setup(assert_implements_animation_timeline); 27 28 promise_test(async () => { 29 await waitForCSSScrollTimelineStyle(); 30 assert_equals(getComputedStyle(element).zIndex, '100'); 31 // Unrelated style mutation does not change the effect value: 32 element.style.color = 'green'; 33 assert_equals(getComputedStyle(element).zIndex, '100'); 34 }); 35 </script>