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
|
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Test the position and the class of unchanged animated property items.
const TEST_DATA = [
{ property: "background-color", isUnchanged: false },
{ property: "padding-left", isUnchanged: false },
{ property: "background-attachment", isUnchanged: true },
{ property: "background-clip", isUnchanged: true },
{ property: "background-image", isUnchanged: true },
{ property: "background-origin", isUnchanged: true },
{ property: "background-position-x", isUnchanged: true },
{ property: "background-position-y", isUnchanged: true },
{ property: "background-repeat", isUnchanged: true },
{ property: "background-size", isUnchanged: true },
{ property: "padding-bottom", isUnchanged: true },
{ property: "padding-right", isUnchanged: true },
{ property: "padding-top", isUnchanged: true },
];
add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
await removeAnimatedElementsExcept([".longhand"]);
const { panel } = await openAnimationInspector();
info("Checking unchanged animated property item");
const itemEls = panel.querySelectorAll(".animated-property-item");
is(
itemEls.length,
TEST_DATA.length,
`Count of animated property item should be ${TEST_DATA.length}`
);
for (let i = 0; i < TEST_DATA.length; i++) {
const { property, isUnchanged } = TEST_DATA[i];
const itemEl = itemEls[i];
ok(
itemEl.querySelector(`.keyframes-graph.${property}`),
`Item of ${property} should display at here`
);
if (isUnchanged) {
ok(
itemEl.classList.contains("unchanged"),
"Animated property item should have 'unchanged' class"
);
} else {
ok(
!itemEl.classList.contains("unchanged"),
"Animated property item should not have 'unchanged' class"
);
}
}
});
|
