browser_animation_keyframes-progress-bar_after-resuming.js (1962B)
1 /* Any copyright is dedicated to the Public Domain. 2 http://creativecommons.org/publicdomain/zero/1.0/ */ 3 4 "use strict"; 5 6 // Test whether keyframes progress bar moves correctly after resuming the animation. 7 8 add_task(async function () { 9 await addTab(URL_ROOT + "doc_simple_animation.html"); 10 await removeAnimatedElementsExcept([".animated"]); 11 const { animationInspector, panel } = await openAnimationInspector(); 12 13 const scrubberPositions = [0, 0.25, 0.5, 0.75]; 14 const expectedPositions = [0, 0.25, 0.5, 0.75]; 15 16 info("Check whether the keyframes progress bar position was correct"); 17 await assertPosition( 18 panel, 19 scrubberPositions, 20 expectedPositions, 21 animationInspector 22 ); 23 24 info( 25 "Check whether the keyframes progress bar position was correct " + 26 "after a bit time passed and resuming" 27 ); 28 await wait(500); 29 clickOnPauseResumeButton(animationInspector, panel); 30 await assertPosition( 31 panel, 32 scrubberPositions, 33 expectedPositions, 34 animationInspector 35 ); 36 }); 37 38 async function assertPosition( 39 panel, 40 scrubberPositions, 41 expectedPositions, 42 animationInspector 43 ) { 44 const areaEl = panel.querySelector(".keyframes-progress-bar-area"); 45 const barEl = areaEl.querySelector(".keyframes-progress-bar"); 46 const controllerBounds = areaEl.getBoundingClientRect(); 47 48 for (let i = 0; i < scrubberPositions.length; i++) { 49 info(`Scrubber position is ${scrubberPositions[i]}`); 50 clickOnCurrentTimeScrubberController( 51 animationInspector, 52 panel, 53 scrubberPositions[i] 54 ); 55 await waitUntilAnimationsPlayState(animationInspector, "paused"); 56 const barBounds = barEl.getBoundingClientRect(); 57 const barX = barBounds.x + barBounds.width / 2 - controllerBounds.x; 58 const expected = controllerBounds.width * expectedPositions[i]; 59 ok( 60 expected - 1 < barX && barX < expected + 1, 61 `Position should apploximately be ${expected} (x of bar is ${barX})` 62 ); 63 } 64 }