Skip to content
This repository was archived by the owner on Mar 19, 2021. It is now read-only.

Commit c83df3d

Browse files
Edvard Thörnroschromium-wpt-export-bot
Edvard Thörnros
authored and
chromium-wpt-export-bot
committed
Translate 25 tests to WPT
This is the second commit in the series of updating all the old svg animation tests. The usage of testharness has replaced the older SVGAnimationTest.js for all where it's suitable. No functionality should have changed and the tests should cover almost the same. In all of the animations where there is a sampling at T=0, where it was assumed that no animations had started. Which didn't work flawlessly when moved to the new system. Bug: 985335 Change-Id: I789c1a020ee9004f4cfb7fe4292ba80f318aeeee Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1730904 Commit-Queue: Edvard Thörnros <[email protected]> Reviewed-by: Stephen Chenney <[email protected]> Cr-Commit-Position: refs/heads/master@{#683926}
1 parent 32fc578 commit c83df3d

26 files changed

+1878
-1
lines changed

‎resources/SVGAnimationTestCase-testharness.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
// NOTE(edvardt):
2-
// This file is a slimmed down wrapper for the Chromium SVGAnimationTestCase.js,
2+
// This file is a slimmed down wrapper for the old SVGAnimationTestCase.js,
33
// it has some convenience functions and should not be used for new tests.
44
// New tests should not build on this API as it's just meant to keep things
55
// working.
@@ -32,6 +32,7 @@ function createSVGElement(type) {
3232
return document.createElementNS("http://www.w3.org/2000/svg", type);
3333
}
3434

35+
// Inspired by Layoutests/animations/animation-test-helpers.js
3536
function moveAnimationTimelineAndSample(index) {
3637
var animationId = expectedResults[index][0];
3738
var time = expectedResults[index][1];

‎svg/animations/svglength-animation-LengthModeWidth.html

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
<!doctype html>
2+
<html>
3+
<meta charset="utf-8">
4+
<title>Test SVGLength animation on LengthModeWidth.</title>
5+
<script src="/resources/testharness.js"></script>
6+
<script src="/resources/testharnessreport.js"></script>
7+
<script src="/resources/SVGAnimationTestCase-testharness.js"></script>
8+
9+
<svg>
10+
</svg>
11+
12+
<script>
13+
var rootSVGElement = document.querySelector("svg");
14+
var epsilon = 1.0;
15+
16+
// Setup test document
17+
rootSVGElement.setAttribute("width", "600");
18+
rootSVGElement.setAttribute("height", "400");
19+
20+
// Setup test document
21+
var rect = createSVGElement("rect");
22+
rect.setAttribute("id", "rect");
23+
rect.setAttribute("x", "0");
24+
rect.setAttribute("width", "100");
25+
rect.setAttribute("height", "100");
26+
rect.setAttribute("fill", "green");
27+
rect.setAttribute("font-size", "10px");
28+
rect.setAttribute("onclick", "executeTest()");
29+
30+
var animate = createSVGElement("animate");
31+
animate.setAttribute("id", "animation");
32+
animate.setAttribute("attributeName", "width");
33+
animate.setAttribute("begin", "0s");
34+
animate.setAttribute("dur", "4s");
35+
animate.setAttribute("from", "100");
36+
animate.setAttribute("to", "50%");
37+
rect.appendChild(animate);
38+
rootSVGElement.appendChild(rect);
39+
40+
// Setup animation test
41+
function sample1() {
42+
// Check initial/end conditions
43+
assert_approx_equals(rect.width.animVal.value, 100, epsilon);
44+
assert_equals(rect.width.baseVal.value, 100);
45+
}
46+
47+
function sample2() {
48+
assert_approx_equals(rect.width.animVal.value, 200, epsilon);
49+
assert_equals(rect.width.baseVal.value, 100);
50+
}
51+
52+
function sample3() {
53+
assert_approx_equals(rect.width.animVal.value, 300, epsilon);
54+
assert_equals(rect.width.baseVal.value, 100);
55+
}
56+
57+
smil_async_test((t) => {
58+
const expectedValues = [
59+
// [animationId, time, sampleCallback]
60+
["animation", 0.0, sample1],
61+
["animation", 2.0, sample2],
62+
["animation", 3.999, sample3],
63+
["animation", 4.001, sample1]
64+
];
65+
66+
runAnimationTest(t, expectedValues);
67+
});
68+
69+
</script>

‎svg/animations/svglength-animation-number-to-number.html

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
<!doctype html>
2+
<html>
3+
<meta charset="utf-8">
4+
<title>Test SVGLength animation from px to cm.</title>
5+
<script src="/resources/testharness.js"></script>
6+
<script src="/resources/testharnessreport.js"></script>
7+
<script src="/resources/SVGAnimationTestCase-testharness.js"></script>
8+
9+
<svg>
10+
</svg>
11+
12+
<script>
13+
var rootSVGElement = document.querySelector("svg");
14+
var epsilon = 1.0;
15+
16+
// Setup test document
17+
var rect = createSVGElement("rect");
18+
rect.setAttribute("id", "rect");
19+
rect.setAttribute("x", "0");
20+
rect.setAttribute("width", "100");
21+
rect.setAttribute("height", "100");
22+
rect.setAttribute("fill", "green");
23+
rect.setAttribute("onclick", "executeTest()");
24+
25+
var animate = createSVGElement("animate");
26+
animate.setAttribute("id", "animation");
27+
animate.setAttribute("attributeName", "width");
28+
animate.setAttribute("begin", "0s");
29+
animate.setAttribute("dur", "4s");
30+
animate.setAttribute("from", "100");
31+
animate.setAttribute("to", "200");
32+
rect.appendChild(animate);
33+
rootSVGElement.appendChild(rect);
34+
35+
// Setup animation test
36+
function sample1() {
37+
// Check initial/end conditions
38+
assert_approx_equals(rect.width.animVal.value, 100, epsilon);
39+
assert_equals(rect.width.baseVal.value, 100);
40+
}
41+
42+
function sample2() {
43+
assert_approx_equals(rect.width.animVal.value, 150, epsilon);
44+
assert_equals(rect.width.baseVal.value, 100);
45+
}
46+
47+
function sample3() {
48+
assert_approx_equals(rect.width.animVal.value, 200, epsilon);
49+
assert_equals(rect.width.baseVal.value, 100);
50+
}
51+
52+
smil_async_test((t) => {
53+
const expectedValues = [
54+
// [animationId, time, sampleCallback]
55+
["animation", 0.0, sample1],
56+
["animation", 2.0, sample2],
57+
["animation", 3.999, sample3],
58+
["animation", 4.001, sample1]
59+
];
60+
61+
runAnimationTest(t, expectedValues);
62+
});
63+
64+
</script>

‎svg/animations/svglength-animation-px-to-cm.html

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
<!doctype html>
2+
<html>
3+
<meta charset="utf-8">
4+
<title>Test SVGLength animation from px to cm.</title>
5+
<script src="/resources/testharness.js"></script>
6+
<script src="/resources/testharnessreport.js"></script>
7+
<script src="/resources/SVGAnimationTestCase-testharness.js"></script>
8+
9+
<svg>
10+
</svg>
11+
12+
<script>
13+
var rootSVGElement = document.querySelector("svg");
14+
var epsilon = 1.0;
15+
16+
// Setup test document
17+
var rect = createSVGElement("rect");
18+
rect.setAttribute("id", "rect");
19+
rect.setAttribute("x", "0");
20+
rect.setAttribute("width", "100");
21+
rect.setAttribute("height", "100");
22+
rect.setAttribute("fill", "green");
23+
rect.setAttribute("onclick", "executeTest()");
24+
25+
var animate = createSVGElement("animate");
26+
animate.setAttribute("id", "animation");
27+
animate.setAttribute("attributeName", "width");
28+
animate.setAttribute("begin", "0s");
29+
animate.setAttribute("dur", "4s");
30+
animate.setAttribute("from", "100px");
31+
animate.setAttribute("to", "5cm");
32+
rect.appendChild(animate);
33+
rootSVGElement.appendChild(rect);
34+
35+
// Setup animation test
36+
function sample1() {
37+
// Check initial/end conditions
38+
assert_approx_equals(rect.width.animVal.value, 100, epsilon);
39+
assert_equals(rect.width.baseVal.value, 100);
40+
}
41+
42+
function sample2() {
43+
assert_approx_equals(rect.width.animVal.value, 144.5, epsilon);
44+
assert_equals(rect.width.baseVal.value, 100);
45+
}
46+
47+
function sample3() {
48+
assert_approx_equals(rect.width.animVal.value, 189, epsilon);
49+
assert_equals(rect.width.baseVal.value, 100);
50+
}
51+
52+
smil_async_test((t) => {
53+
const expectedValues = [
54+
// [animationId, time, sampleCallback]
55+
["animation", 0.0, sample1],
56+
["animation", 2.0, sample2],
57+
["animation", 3.999, sample3],
58+
["animation", 4.001, sample1]
59+
];
60+
61+
runAnimationTest(t, expectedValues);
62+
});
63+
64+
</script>

‎svg/animations/svglength-animation-px-to-ems.html

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
<!doctype html>
2+
<html>
3+
<meta charset="utf-8">
4+
<title>Test SVGLength animation from px to ems.</title>
5+
<script src="/resources/testharness.js"></script>
6+
<script src="/resources/testharnessreport.js"></script>
7+
<script src="/resources/SVGAnimationTestCase-testharness.js"></script>
8+
9+
<svg>
10+
</svg>
11+
12+
<script>
13+
var rootSVGElement = document.querySelector("svg");
14+
var epsilon = 1.0;
15+
16+
// Setup test document
17+
var rect = createSVGElement("rect");
18+
rect.setAttribute("id", "rect");
19+
rect.setAttribute("x", "0");
20+
rect.setAttribute("width", "100");
21+
rect.setAttribute("height", "100");
22+
rect.setAttribute("fill", "green");
23+
rect.setAttribute("font-size", "10px");
24+
rect.setAttribute("onclick", "executeTest()");
25+
26+
var animate = createSVGElement("animate");
27+
animate.setAttribute("id", "animation");
28+
animate.setAttribute("attributeName", "width");
29+
animate.setAttribute("begin", "0s");
30+
animate.setAttribute("dur", "4s");
31+
animate.setAttribute("from", "100px");
32+
animate.setAttribute("to", "20em");
33+
rect.appendChild(animate);
34+
rootSVGElement.appendChild(rect);
35+
36+
// Setup animation test
37+
function sample1() {
38+
// Check initial/end conditions
39+
assert_approx_equals(rect.width.animVal.value, 100, epsilon);
40+
assert_equals(rect.width.baseVal.value, 100);
41+
}
42+
43+
function sample2() {
44+
assert_approx_equals(rect.width.animVal.value, 150, epsilon);
45+
assert_equals(rect.width.baseVal.value, 100);
46+
}
47+
48+
function sample3() {
49+
assert_approx_equals(rect.width.animVal.value, 200, epsilon);
50+
assert_equals(rect.width.baseVal.value, 100);
51+
}
52+
53+
smil_async_test((t) => {
54+
const expectedValues = [
55+
// [animationId, time, sampleCallback]
56+
["animation", 0.0, sample1],
57+
["animation", 2.0, sample2],
58+
["animation", 3.999, sample3],
59+
["animation", 4.001, sample1]
60+
];
61+
62+
runAnimationTest(t, expectedValues);
63+
});
64+
65+
</script>

‎svg/animations/svglength-animation-px-to-in.html

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
<!doctype html>
2+
<html>
3+
<meta charset="utf-8">
4+
<title>Test SVGLength animation from px to inch.</title>
5+
<script src="/resources/testharness.js"></script>
6+
<script src="/resources/testharnessreport.js"></script>
7+
<script src="/resources/SVGAnimationTestCase-testharness.js"></script>
8+
9+
<svg>
10+
</svg>
11+
12+
<script>
13+
var rootSVGElement = document.querySelector("svg");
14+
var epsilon = 1.0;
15+
16+
// Setup test document
17+
var rect = createSVGElement("rect");
18+
rect.setAttribute("id", "rect");
19+
rect.setAttribute("x", "0");
20+
rect.setAttribute("width", "100");
21+
rect.setAttribute("height", "100");
22+
rect.setAttribute("fill", "green");
23+
rect.setAttribute("onclick", "executeTest()");
24+
25+
var animate = createSVGElement("animate");
26+
animate.setAttribute("id", "animation");
27+
animate.setAttribute("attributeName", "width");
28+
animate.setAttribute("begin", "0s");
29+
animate.setAttribute("dur", "4s");
30+
animate.setAttribute("from", "100px");
31+
animate.setAttribute("to", "2.5in");
32+
rect.appendChild(animate);
33+
rootSVGElement.appendChild(rect);
34+
35+
// Setup animation test
36+
function sample1() {
37+
// Check initial/end conditions
38+
assert_approx_equals(rect.width.animVal.value, 100, epsilon);
39+
assert_equals(rect.width.baseVal.value, 100);
40+
}
41+
42+
function sample2() {
43+
assert_approx_equals(rect.width.animVal.value, 170, epsilon);
44+
assert_equals(rect.width.baseVal.value, 100);
45+
}
46+
47+
function sample3() {
48+
assert_approx_equals(rect.width.animVal.value, 240, epsilon);
49+
assert_equals(rect.width.baseVal.value, 100);
50+
}
51+
52+
smil_async_test((t) => {
53+
const expectedValues = [
54+
// [animationId, time, sampleCallback]
55+
["animation", 0.0, sample1],
56+
["animation", 2.0, sample2],
57+
["animation", 3.999, sample3],
58+
["animation", 4.001, sample1]
59+
];
60+
61+
runAnimationTest(t, expectedValues);
62+
});
63+
64+
</script>

0 commit comments

Comments
 (0)