current-time-nan.html (2254B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>ScrollTimeline current time algorithm - NaN cases</title> 4 <link rel="help" href="https://wicg.github.io/scroll-animations/#current-time-algorithm"> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 8 <style> 9 .scroller { 10 height: 100px; 11 width: 100px; 12 overflow: auto; 13 } 14 15 .content { 16 height: 500px; 17 width: 500px; 18 } 19 </style> 20 21 <div id='inlineScroller' class='scroller' style='display: inline;'> 22 <div class='content'></div> 23 </div> 24 <script> 25 'use strict'; 26 27 test(function() { 28 const scroller = document.querySelector('#inlineScroller'); 29 const scrollTimeline = new ScrollTimeline( 30 { source: scroller, orientation: 'block' }); 31 32 assert_equals(scrollTimeline.currentTime, null); 33 }, 'currentTime should be null for a display: inline source'); 34 </script> 35 36 <div id='displayNoneScroller' class='scroller' style='display: none;'> 37 <div class='content'></div> 38 </div> 39 <script> 40 test(function() { 41 const scroller = document.querySelector('#displayNoneScroller'); 42 const scrollTimeline = new ScrollTimeline( 43 { source: scroller, orientation: 'block' }); 44 45 assert_equals(scrollTimeline.currentTime, null); 46 }, 'currentTime should be null for a display: none source'); 47 </script> 48 49 <script> 50 test(function() { 51 const scroller = document.createElement('div'); 52 const content = document.createElement('div'); 53 54 scroller.style.overflow = 'auto'; 55 scroller.style.height = '100px'; 56 scroller.style.width = '100px'; 57 content.style.height = '250px'; 58 content.style.width = '250px'; 59 60 scroller.appendChild(content); 61 62 const scrollTimeline = new ScrollTimeline( 63 { source: scroller, orientation: 'block' }); 64 65 assert_equals(scrollTimeline.currentTime, null); 66 }, 'currentTime should be null for an unattached source'); 67 </script> 68 69 <div id='notAScroller' class='scroller' style='overflow: visible;'> 70 <div class='content'></div> 71 </div> 72 <script> 73 test(function() { 74 const scroller = document.querySelector('#notAScroller'); 75 const scrollTimeline = new ScrollTimeline( 76 { source: scroller, orientation: 'block' }); 77 78 assert_equals(scrollTimeline.currentTime, null); 79 }, 'currentTime should be null when the source is not a scroller'); 80 </script>