diff options
Diffstat (limited to 'devtools/server/tests/browser/browser_animation_refreshTransitions.js')
-rw-r--r-- | devtools/server/tests/browser/browser_animation_refreshTransitions.js | 97 |
1 files changed, 97 insertions, 0 deletions
diff --git a/devtools/server/tests/browser/browser_animation_refreshTransitions.js b/devtools/server/tests/browser/browser_animation_refreshTransitions.js new file mode 100644 index 0000000000..a48ea90e3d --- /dev/null +++ b/devtools/server/tests/browser/browser_animation_refreshTransitions.js @@ -0,0 +1,97 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +// When a transition finishes, no "removed" event is sent because it may still +// be used, but when it restarts again (transitions back), then a new +// AnimationPlayerFront should be sent, and the old one should be removed. + +add_task(async function () { + const { target, walker, animations } = await initAnimationsFrontForUrl( + MAIN_DOMAIN + "animation.html" + ); + + info("Retrieve the test node"); + const node = await walker.querySelector(walker.rootNode, ".all-transitions"); + + info("Retrieve the animation players for the node"); + const players = await animations.getAnimationPlayersForNode(node); + is(players.length, 0, "The node has no animation players yet"); + + info("Play a transition by adding the expand class, wait for mutations"); + let onMutations = expectMutationEvents(animations, 2); + await SpecialPowers.spawn(gBrowser.selectedBrowser, [], () => { + const el = content.document.querySelector(".all-transitions"); + el.classList.add("expand"); + }); + let reportedMutations = await onMutations; + + is(reportedMutations.length, 2, "2 mutation events were received"); + is(reportedMutations[0].type, "added", "The first event was 'added'"); + is(reportedMutations[1].type, "added", "The second event was 'added'"); + + info("Wait for the transitions to be finished"); + await waitForEnd(reportedMutations[0].player); + await waitForEnd(reportedMutations[1].player); + + info("Play the transition back by removing the class, wait for mutations"); + onMutations = expectMutationEvents(animations, 4); + await SpecialPowers.spawn(gBrowser.selectedBrowser, [], () => { + const el = content.document.querySelector(".all-transitions"); + el.classList.remove("expand"); + }); + reportedMutations = await onMutations; + + is(reportedMutations.length, 4, "4 new mutation events were received"); + is( + reportedMutations.filter(m => m.type === "removed").length, + 2, + "2 'removed' events were sent (for the old transitions)" + ); + is( + reportedMutations.filter(m => m.type === "added").length, + 2, + "2 'added' events were sent (for the new transitions)" + ); + + await target.destroy(); + gBrowser.removeCurrentTab(); +}); + +function expectMutationEvents(animationsFront, nbOfEvents) { + return new Promise(resolve => { + let reportedMutations = []; + function onMutations(mutations) { + reportedMutations = [...reportedMutations, ...mutations]; + info( + "Received " + + reportedMutations.length + + " mutation events, " + + "expecting " + + nbOfEvents + ); + if (reportedMutations.length === nbOfEvents) { + animationsFront.off("mutations", onMutations); + resolve(reportedMutations); + } + } + + info("Start listening for mutation events from the AnimationsFront"); + animationsFront.on("mutations", onMutations); + }); +} + +async function waitForEnd(animationFront) { + let playState; + while (playState !== "finished") { + const state = await animationFront.getCurrentState(); + playState = state.playState; + info( + "Wait for transition " + + animationFront.state.name + + " to finish, playState=" + + playState + ); + } +} |