Reland "Move SMIL events tests to WPT"
Now with <script> elements in the HTML namespace. Because reasons.
Change-Id: Ia3eba0f7856f265ed6fa601272a2d7c577b07c1c
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2043450
Commit-Queue: Stephen Chenney <schenney@chromium.org>
Auto-Submit: Fredrik Söderquist <fs@opera.com>
Reviewed-by: Stephen Chenney <schenney@chromium.org>
Cr-Commit-Position: refs/heads/master@{#739354}
diff --git a/svg/animations/begin-event.svg b/svg/animations/begin-event.svg
new file mode 100644
index 0000000..c673dff
--- /dev/null
+++ b/svg/animations/begin-event.svg
@@ -0,0 +1,17 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+ <title>Animation triggers on 'beginEvent'</title>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharness.js"/>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharnessreport.js"/>
+ <rect width="0" height="100" fill="green">
+ <animate id="anim" attributeName="visibility" to="visible" begin="0s" end="2s" fill="freeze"/>
+ <set attributeName="width" to="100" begin="anim.beginEvent"/>
+ </rect>
+ <script>
+ async_test(t => {
+ let set = document.querySelector('set');
+ set.addEventListener('beginEvent', t.step_func_done(function() {
+ assert_equals(set.parentNode.getBBox().width, 100);
+ }));
+ });
+ </script>
+</svg>
diff --git a/svg/animations/end-event.svg b/svg/animations/end-event.svg
new file mode 100644
index 0000000..aa0854d
--- /dev/null
+++ b/svg/animations/end-event.svg
@@ -0,0 +1,19 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+ <title>Animation triggers on 'endEvent'</title>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharness.js"/>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharnessreport.js"/>
+ <rect width="0" height="100" fill="green">
+ <animate id="anim" attributeName="visibility" to="visible" begin="0s" end="2s"/>
+ <set attributeName="width" to="100" begin="anim.endEvent"/>
+ </rect>
+ <script>
+ async_test(t => {
+ document.documentElement.setCurrentTime(1.99);
+
+ let set = document.querySelector('set');
+ set.addEventListener('beginEvent', t.step_func_done(function() {
+ assert_equals(set.parentNode.getBBox().width, 100);
+ }));
+ });
+ </script>
+</svg>
diff --git a/svg/animations/onbegin.svg b/svg/animations/onbegin.svg
new file mode 100644
index 0000000..d3de366
--- /dev/null
+++ b/svg/animations/onbegin.svg
@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+ <title>'onbegin' event handler content attribute</title>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharness.js"/>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharnessreport.js"/>
+ <rect width="0" height="100" fill="green">
+ <animate id="anim" attributeName="visibility" to="visible" begin="0s" end="2s" fill="freeze"
+ onbegin="document.getElementById('anim2').beginElement()"/>
+ <set id="anim2" attributeName="width" to="100" begin="indefinite"/>
+ </rect>
+ <script>
+ async_test(t => {
+ let set = document.getElementById('anim2');
+ set.addEventListener('beginEvent', t.step_func_done(function() {
+ assert_equals(set.parentNode.getBBox().width, 100);
+ }));
+ });
+ </script>
+</svg>
diff --git a/svg/animations/onend.svg b/svg/animations/onend.svg
new file mode 100644
index 0000000..46b78af
--- /dev/null
+++ b/svg/animations/onend.svg
@@ -0,0 +1,20 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+ <title>'onend' event handler content attribute</title>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharness.js"/>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharnessreport.js"/>
+ <rect width="0" height="100" fill="green">
+ <animate id="anim" attributeName="visibility" to="visible" begin="0s" end="2s" fill="freeze"
+ onend="document.getElementById('anim2').beginElement()"/>
+ <set id="anim2" attributeName="width" to="100" begin="indefinite"/>
+ </rect>
+ <script>
+ async_test(t => {
+ document.documentElement.setCurrentTime(1.99);
+
+ let set = document.getElementById('anim2');
+ set.addEventListener('beginEvent', t.step_func_done(function() {
+ assert_equals(set.parentNode.getBBox().width, 100);
+ }));
+ });
+ </script>
+</svg>
diff --git a/svg/animations/onrepeat.svg b/svg/animations/onrepeat.svg
new file mode 100644
index 0000000..cd4a265
--- /dev/null
+++ b/svg/animations/onrepeat.svg
@@ -0,0 +1,20 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+ <title>'onrepeat' event handler content attribute</title>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharness.js"/>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharnessreport.js"/>
+ <rect width="0" height="100" fill="green">
+ <animate id="anim" attributeName="visibility" to="visible" begin="0s" dur="1s" fill="freeze" repeatCount="2"
+ onrepeat="document.getElementById('anim2').beginElement()"/>
+ <set id="anim2" attributeName="width" to="100" begin="indefinite" />
+ </rect>
+ <script>
+ async_test(t => {
+ document.documentElement.setCurrentTime(0.99);
+
+ let set = document.getElementById('anim2');
+ set.addEventListener('beginEvent', t.step_func_done(function() {
+ assert_equals(set.parentNode.getBBox().width, 100);
+ }));
+ });
+ </script>
+</svg>
diff --git a/svg/animations/repeat-event.svg b/svg/animations/repeat-event.svg
new file mode 100644
index 0000000..0a9a3cb
--- /dev/null
+++ b/svg/animations/repeat-event.svg
@@ -0,0 +1,19 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+ <title>Animation triggers on 'repeatEvent'</title>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharness.js"/>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharnessreport.js"/>
+ <rect width="0" height="100" fill="green">
+ <animate id="anim" attributeName="visibility" to="visible" begin="0s" dur="1s" repeatCount="2" fill="freeze"/>
+ <set attributeName="width" to="100" begin="anim.repeatEvent"/>
+ </rect>
+ <script>
+ async_test(t => {
+ document.documentElement.setCurrentTime(0.99);
+
+ let set = document.querySelector('set');
+ set.addEventListener('beginEvent', t.step_func_done(function() {
+ assert_equals(set.parentNode.getBBox().width, 100);
+ }));
+ });
+ </script>
+</svg>
diff --git a/svg/animations/repeat-iteration-event-001.svg b/svg/animations/repeat-iteration-event-001.svg
new file mode 100644
index 0000000..0cf7a7a
--- /dev/null
+++ b/svg/animations/repeat-iteration-event-001.svg
@@ -0,0 +1,27 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+ <title>Animation does not triggers on 'repeat(0)'</title>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharness.js"/>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharnessreport.js"/>
+ <rect width="100" height="100" fill="green">
+ <animate id="anim" attributeName="visibility" to="visible" begin="0s" dur="2s" repeatCount="4"/>
+ <set attributeName="width" to="0" begin="anim.repeat(0)"/>
+ </rect>
+ <script>
+ function waitForFrame() {
+ return new Promise(resolve => {
+ window.requestAnimationFrame(resolve);
+ });
+ }
+
+ promise_test(t => {
+ let set = document.querySelector("set");
+ new EventWatcher(t, set, 'beginEvent');
+ let windowWatcher = new EventWatcher(t, window, 'load');
+ return windowWatcher.wait_for('load').then(() => {
+ return waitForFrame();
+ }).then(() => {
+ assert_equals(set.parentNode.getBBox().width, 100);
+ });
+ });
+ </script>
+</svg>
diff --git a/svg/animations/repeat-iteration-event-002.svg b/svg/animations/repeat-iteration-event-002.svg
new file mode 100644
index 0000000..6d2f379
--- /dev/null
+++ b/svg/animations/repeat-iteration-event-002.svg
@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+ <title>Animation triggers on 'repeat(1)'</title>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharness.js"/>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharnessreport.js"/>
+ <rect width="0" height="100" fill="green">
+ <animate id="anim" attributeName="visibility" to="visible" begin="0s" dur="2s" repeatCount="4"/>
+ <set attributeName="width" to="100" begin="anim.repeat(1)"/>
+ </rect>
+ <script>
+ promise_test(t => {
+ document.documentElement.setCurrentTime(1.995);
+ let set = document.querySelector("set");
+ return new EventWatcher(t, set, 'beginEvent').wait_for('beginEvent').then(() => {
+ assert_equals(set.parentNode.getBBox().width, 100);
+ });
+ });
+ </script>
+</svg>
diff --git a/svg/animations/repeat-iteration-event-003.svg b/svg/animations/repeat-iteration-event-003.svg
new file mode 100644
index 0000000..50cb47e
--- /dev/null
+++ b/svg/animations/repeat-iteration-event-003.svg
@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+ <title>Animation triggers on 'repeat(2)'</title>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharness.js"/>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharnessreport.js"/>
+ <rect width="0" height="100" fill="green">
+ <animate id="anim" attributeName="visibility" to="visible" begin="0s" dur="2s" repeatCount="4"/>
+ <set attributeName="width" to="100" begin="anim.repeat(2)"/>
+ </rect>
+ <script>
+ promise_test(t => {
+ document.documentElement.setCurrentTime(3.995);
+ let set = document.querySelector("set");
+ return new EventWatcher(t, set, 'beginEvent').wait_for('beginEvent').then(() => {
+ assert_equals(set.parentNode.getBBox().width, 100);
+ });
+ });
+ </script>
+</svg>
diff --git a/svg/animations/repeat-iteration-event-004.svg b/svg/animations/repeat-iteration-event-004.svg
new file mode 100644
index 0000000..93c12d6
--- /dev/null
+++ b/svg/animations/repeat-iteration-event-004.svg
@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+ <title>Animation triggers on 'repeat(3)'</title>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharness.js"/>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharnessreport.js"/>
+ <rect width="0" height="100" fill="green">
+ <animate id="anim" attributeName="visibility" to="visible" begin="0s" dur="2s" repeatCount="4"/>
+ <set attributeName="width" to="100" begin="anim.repeat(3)"/>
+ </rect>
+ <script>
+ promise_test(t => {
+ document.documentElement.setCurrentTime(5.995);
+ let set = document.querySelector("set");
+ return new EventWatcher(t, set, 'beginEvent').wait_for('beginEvent').then(() => {
+ assert_equals(set.parentNode.getBBox().width, 100);
+ });
+ });
+ </script>
+</svg>
diff --git a/svg/animations/repeat-iteration-event-005.svg b/svg/animations/repeat-iteration-event-005.svg
new file mode 100644
index 0000000..63ba7fb
--- /dev/null
+++ b/svg/animations/repeat-iteration-event-005.svg
@@ -0,0 +1,29 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+ <title>No repeat iteration at interval end</title>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharness.js"/>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharnessreport.js"/>
+ <rect width="100" height="100" fill="green">
+ <animate id="anim" attributeName="visibility" to="visible" begin="0s" dur="2s" repeatCount="4"/>
+ <set attributeName="width" to="0" begin="anim.repeat(4)"/>
+ </rect>
+ <script>
+ function waitForFrame() {
+ return new Promise(resolve => {
+ window.requestAnimationFrame(resolve);
+ });
+ }
+
+ promise_test(t => {
+ document.documentElement.setCurrentTime(7.995);
+ let set = document.querySelector("set");
+ new EventWatcher(t, set, 'beginEvent');
+ let anim = document.getElementById("anim");
+ let animWatcher = new EventWatcher(t, anim, 'endEvent');
+ return animWatcher.wait_for('endEvent').then(() => {
+ return waitForFrame();
+ }).then(() => {
+ assert_equals(set.parentNode.getBBox().width, 100);
+ });
+ });
+ </script>
+</svg>
diff --git a/svg/animations/repeat-iteration-event-006.svg b/svg/animations/repeat-iteration-event-006.svg
new file mode 100644
index 0000000..de4c8f1
--- /dev/null
+++ b/svg/animations/repeat-iteration-event-006.svg
@@ -0,0 +1,48 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+ <title>Animation triggers on 'repeatEvent' iteration</title>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharness.js"/>
+ <script xmlns="http://www.w3.org/1999/xhtml" src="/resources/testharnessreport.js"/>
+ <g>
+ <animate id="anim" attributeName="visibility" to="visible" begin="0s" dur="2s" repeatCount="4"/>
+ <rect x="0" y="0" width="100" height="100" fill="green">
+ <set attributeName="fill" to="red" begin="anim.repeat(0)"/>
+ </rect>
+ <rect x="200" y="0" width="100" height="100" fill="red">
+ <set attributeName="fill" to="green" begin="anim.repeat(1)"/>
+ </rect>
+ <rect x="0" y="200" width="100" height="100" fill="red">
+ <set attributeName="fill" to="green" begin="anim.repeat(2)"/>
+ </rect>
+ <rect x="200" y="200" width="100" height="100" fill="red">
+ <set attributeName="fill" to="green" begin="anim.repeat(3)"/>
+ </rect>
+ </g>
+ <script>
+ promise_test(t => {
+ let svg = document.documentElement;
+ let anim = document.getElementById('anim');
+ let animWatcher = new EventWatcher(t, anim, ['beginEvent', 'repeatEvent']);
+ // Wait for #anims 'beginEvent' and then step through the
+ // 'repeatEvents' one at a time.
+ let stepsPromise = animWatcher.wait_for('beginEvent').then(() => {
+ svg.setCurrentTime(1.99);
+ return animWatcher.wait_for('repeatEvent');
+ }).then(() => {
+ svg.setCurrentTime(3.99);
+ return animWatcher.wait_for('repeatEvent');
+ }).then(() => {
+ svg.setCurrentTime(5.99);
+ return animWatcher.wait_for('repeatEvent');
+ });
+ let setElements = document.getElementsByTagName('set');
+ let setBeginWatchers = Array.from(setElements).map(element => {
+ return new EventWatcher(t, element, 'beginEvent');
+ });
+ // Expect 'beginEvent' to be dispatched for all but the first 'set' element.
+ let beginPromises = setBeginWatchers.slice(1).map(watcher => {
+ return watcher.wait_for('beginEvent');
+ })
+ return Promise.all([stepsPromise, ...beginPromises]);
+ });
+ </script>
+</svg>
