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
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
|
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Test that when animations displayed in the timeline are running on the
// compositor, they get a special icon and information in the tooltip.
requestLongerTimeout(2);
add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
await removeAnimatedElementsExcept([
".compositor-all",
".compositor-notall",
".no-compositor",
]);
const { animationInspector, inspector, panel } =
await openAnimationInspector();
info("Check animation whose all properties are running on compositor");
const summaryGraphAllEl = await findSummaryGraph(".compositor-all", panel);
ok(
summaryGraphAllEl.classList.contains("compositor"),
"The element has the compositor css class"
);
ok(
hasTooltip(
summaryGraphAllEl,
ANIMATION_L10N.getStr("player.allPropertiesOnCompositorTooltip")
),
"The element has the right tooltip content"
);
info("Check animation is not running on compositor");
const summaryGraphNoEl = await findSummaryGraph(".no-compositor", panel);
ok(
!summaryGraphNoEl.classList.contains("compositor"),
"The element does not have the compositor css class"
);
ok(
!hasTooltip(
summaryGraphNoEl,
ANIMATION_L10N.getStr("player.allPropertiesOnCompositorTooltip")
),
"The element does not have oncompositor tooltip content"
);
ok(
!hasTooltip(
summaryGraphNoEl,
ANIMATION_L10N.getStr("player.somePropertiesOnCompositorTooltip")
),
"The element does not have oncompositor tooltip content"
);
info(
"Select a node has animation whose some properties are running on compositor"
);
await selectNode(".compositor-notall", inspector);
const summaryGraphEl = await findSummaryGraph(".compositor-notall", panel);
ok(
summaryGraphEl.classList.contains("compositor"),
"The element has the compositor css class"
);
ok(
hasTooltip(
summaryGraphEl,
ANIMATION_L10N.getStr("player.somePropertiesOnCompositorTooltip")
),
"The element has the right tooltip content"
);
info("Check compositor sign after pausing");
clickOnPauseResumeButton(animationInspector, panel);
await waitUntil(() => !summaryGraphEl.classList.contains("compositor"));
ok(
true,
"The element should not have the compositor css class after pausing"
);
info("Check compositor sign after resuming");
clickOnPauseResumeButton(animationInspector, panel);
await waitUntil(() => summaryGraphEl.classList.contains("compositor"));
ok(true, "The element should have the compositor css class after resuming");
info("Check compositor sign after rewind");
clickOnRewindButton(animationInspector, panel);
await waitUntil(() => !summaryGraphEl.classList.contains("compositor"));
ok(
true,
"The element should not have the compositor css class after rewinding"
);
clickOnPauseResumeButton(animationInspector, panel);
await waitUntil(() => summaryGraphEl.classList.contains("compositor"));
ok(true, "The element should have the compositor css class after resuming");
info("Check compositor sign after setting the current time");
clickOnCurrentTimeScrubberController(animationInspector, panel, 0.5);
await waitUntil(() => !summaryGraphEl.classList.contains("compositor"));
ok(
true,
"The element should not have the compositor css class " +
"after setting the current time"
);
clickOnPauseResumeButton(animationInspector, panel);
await waitUntil(() => summaryGraphEl.classList.contains("compositor"));
ok(true, "The element should have the compositor css class after resuming");
});
async function findSummaryGraph(selector, panel) {
const animationItemEl = await findAnimationItemByTargetSelector(
panel,
selector
);
return animationItemEl.querySelector(".animation-summary-graph");
}
function hasTooltip(summaryGraphEl, expected) {
const tooltip = summaryGraphEl.getAttribute("title");
return tooltip.includes(expected);
}
|
