diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
commit | 26a029d407be480d791972afb5975cf62c9360a6 (patch) | |
tree | f435a8308119effd964b339f76abb83a57c29483 /devtools/client/inspector/animation/test/browser_animation_keyframes-progress-bar.js | |
parent | Initial commit. (diff) | |
download | firefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz firefox-26a029d407be480d791972afb5975cf62c9360a6.zip |
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to '')
-rw-r--r-- | devtools/client/inspector/animation/test/browser_animation_keyframes-progress-bar.js | 103 |
1 files changed, 103 insertions, 0 deletions
diff --git a/devtools/client/inspector/animation/test/browser_animation_keyframes-progress-bar.js b/devtools/client/inspector/animation/test/browser_animation_keyframes-progress-bar.js new file mode 100644 index 0000000000..a7051d9a01 --- /dev/null +++ b/devtools/client/inspector/animation/test/browser_animation_keyframes-progress-bar.js @@ -0,0 +1,103 @@ +/* Any copyright is dedicated to the Public Domain. +http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +// Test for following KeyframesProgressBar: +// * element existence +// * progress bar position in multi effect timings +// * progress bar position after changing playback rate +// * progress bar position when select another animation + +requestLongerTimeout(3); + +const TEST_DATA = [ + { + targetClass: "cssanimation-linear", + scrubberPositions: [0, 0.25, 0.5, 0.75, 1], + expectedPositions: [0, 0.25, 0.5, 0.75, 0], + }, + { + targetClass: "easing-step", + scrubberPositions: [0, 0.49, 0.5, 0.99], + expectedPositions: [0, 0, 0.5, 0.5], + }, + { + targetClass: "delay-positive", + scrubberPositions: [0, 0.33, 0.5], + expectedPositions: [0, 0, 0.25], + }, + { + targetClass: "delay-negative", + scrubberPositions: [0, 0.49, 0.5, 0.75], + expectedPositions: [0, 0, 0.5, 0.75], + }, + { + targetClass: "enddelay-positive", + scrubberPositions: [0, 0.66, 0.67, 0.99], + expectedPositions: [0, 0.99, 0, 0], + }, + { + targetClass: "enddelay-negative", + scrubberPositions: [0, 0.49, 0.5, 0.99], + expectedPositions: [0, 0.49, 0, 0], + }, + { + targetClass: "direction-reverse-with-iterations-infinity", + scrubberPositions: [0, 0.25, 0.5, 0.75, 1], + expectedPositions: [1, 0.75, 0.5, 0.25, 1], + }, + { + targetClass: "fill-both-width-delay-iterationstart", + scrubberPositions: [0, 0.33, 0.66, 0.833, 1], + expectedPositions: [0.5, 0.5, 0.99, 0.25, 0.5], + }, +]; + +add_task(async function () { + await addTab(URL_ROOT + "doc_multi_timings.html"); + await removeAnimatedElementsExcept(TEST_DATA.map(t => `.${t.targetClass}`)); + const { animationInspector, inspector, panel } = + await openAnimationInspector(); + + info("Checking progress bar position in multi effect timings"); + + for (const testdata of TEST_DATA) { + const { targetClass, scrubberPositions, expectedPositions } = testdata; + + info(`Checking progress bar position for ${targetClass}`); + const onDetailRendered = animationInspector.once( + "animation-keyframes-rendered" + ); + await selectNode(`.${targetClass}`, inspector); + await onDetailRendered; + + info("Checking progress bar existence"); + const areaEl = panel.querySelector(".keyframes-progress-bar-area"); + ok(areaEl, "progress bar area should exist"); + const barEl = areaEl.querySelector(".keyframes-progress-bar"); + ok(barEl, "progress bar should exist"); + + for (let i = 0; i < scrubberPositions.length; i++) { + info(`Scrubber position is ${scrubberPositions[i]}`); + clickOnCurrentTimeScrubberController( + animationInspector, + panel, + scrubberPositions[i] + ); + await waitUntilAnimationsPlayState(animationInspector, "paused"); + assertPosition(barEl, areaEl, expectedPositions[i], animationInspector); + } + } +}); + +function assertPosition(barEl, areaEl, expectedRate, animationInspector) { + const controllerBounds = areaEl.getBoundingClientRect(); + const barBounds = barEl.getBoundingClientRect(); + const barX = barBounds.x + barBounds.width / 2 - controllerBounds.x; + const expected = controllerBounds.width * expectedRate; + ok( + expected - 1 < barX && barX < expected + 1, + `Position should apploximately be ${expected} (x of bar is ${barX})` + ); +} |