1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
|
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Test whether pausing/resuming the each animations correctly.
add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
await removeAnimatedElementsExcept([".animated", ".compositor-all"]);
const { animationInspector, inspector, panel } =
await openAnimationInspector();
const buttonEl = panel.querySelector(".pause-resume-button");
info(
"Check '.compositor-all' animation is still running " +
"after even pausing '.animated' animation"
);
await selectNode(".animated", inspector);
clickOnPauseResumeButton(animationInspector, panel);
await waitUntilAnimationsPlayState(animationInspector, "paused");
ok(buttonEl.classList.contains("paused"), "State of button should be paused");
await selectNode("body", inspector);
await assertStatus(
animationInspector.state.animations,
buttonEl,
["paused", "running"],
false
);
info(
"Check both animations are paused after clicking pause/resume " +
"while displaying both animations"
);
clickOnPauseResumeButton(animationInspector, panel);
await assertStatus(
animationInspector.state.animations,
buttonEl,
["paused", "paused"],
true
);
info(
"Check '.animated' animation is still paused " +
"after even resuming '.compositor-all' animation"
);
await selectNode(".compositor-all", inspector);
clickOnPauseResumeButton(animationInspector, panel);
await waitUntil(() =>
animationInspector.state.animations.some(
a => a.state.playState === "running"
)
);
ok(
!buttonEl.classList.contains("paused"),
"State of button should be running"
);
await selectNode("body", inspector);
await assertStatus(
animationInspector.state.animations,
buttonEl,
["paused", "running"],
false
);
});
async function assertStatus(
animations,
buttonEl,
expectedAnimationStates,
shouldButtonPaused
) {
await waitUntil(() => {
for (let i = 0; i < expectedAnimationStates.length; i++) {
const animation = animations[i];
const state = expectedAnimationStates[i];
if (animation.state.playState !== state) {
return false;
}
}
return true;
});
expectedAnimationStates.forEach((state, index) => {
is(
animations[index].state.playState,
state,
`Animation ${index} should be ${state}`
);
});
is(
buttonEl.classList.contains("paused"),
shouldButtonPaused,
"State of button is correct"
);
}
|
