diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
commit | 43a97878ce14b72f0981164f87f2e35e14151312 (patch) | |
tree | 620249daf56c0258faa40cbdcf9cfba06de2a846 /testing/web-platform/tests/svg/animations/scripted | |
parent | Initial commit. (diff) | |
download | firefox-43a97878ce14b72f0981164f87f2e35e14151312.tar.xz firefox-43a97878ce14b72f0981164f87f2e35e14151312.zip |
Adding upstream version 110.0.1.upstream/110.0.1upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/svg/animations/scripted')
6 files changed, 236 insertions, 0 deletions
diff --git a/testing/web-platform/tests/svg/animations/scripted/SVGAnimationElement-exceptions.html b/testing/web-platform/tests/svg/animations/scripted/SVGAnimationElement-exceptions.html new file mode 100644 index 0000000000..fe06ac1a37 --- /dev/null +++ b/testing/web-platform/tests/svg/animations/scripted/SVGAnimationElement-exceptions.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<title>SVGAnimationElement exceptions</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<svg height="0"><animate begin="foo.begin"/></svg> +<script> +setup(function() { + window.animationElement = document.querySelector('animate'); +}); + +test(function() { + assert_throws_dom('InvalidStateError', function() { animationElement.getStartTime() }); +}, document.title+', getStartTime throws with unresolved interval.'); + +test(function() { + assert_throws_dom('NotSupportedError', function() { animationElement.getSimpleDuration() }); +}, document.title+', getSimpleDuration throws with undefined simple duration.'); +</script> diff --git a/testing/web-platform/tests/svg/animations/scripted/SVGAnimationElement-getStartTime.html b/testing/web-platform/tests/svg/animations/scripted/SVGAnimationElement-getStartTime.html new file mode 100644 index 0000000000..fec3ff4db2 --- /dev/null +++ b/testing/web-platform/tests/svg/animations/scripted/SVGAnimationElement-getStartTime.html @@ -0,0 +1,56 @@ +<!DOCTYPE html> +<title>SVGAnimationElement.getStartTime() returns the start time of the current interval.</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<svg height="0"> + <animate attributeName="visibility" begin="1s; 3s" dur="1s"/> + <animate attributeName="visibility" begin="1s; 3s" dur="1s" fill="freeze"/> +</svg> +<script> +setup(function() { + window.animationElements = document.querySelectorAll('animate'); + window.timeContainer = document.querySelector('svg'); +}); + +function checkStartTime(values, t) { + assert_equals(animationElements[0].getStartTime(), values[0], + 'start time @ ' + t); + assert_equals(animationElements[1].getStartTime(), values[1], + 'start time @ ' + t); +} + +function checkHasNoCurrentInterval(t) { + assert_throws_dom('InvalidStateError', () => { + animationElements[0].getStartTime() + }, 'no interval @ ' + t); + assert_throws_dom('InvalidStateError', () => { + animationElements[1].getStartTime() + }, 'no interval @ ' + t); +} + +async_test(t => { + timeContainer.pauseAnimations(); + // Wait for the timeline to start. + onload = t.step_func(() => { + t.step_timeout(function() { + assert_equals(timeContainer.getCurrentTime(), 0); + checkStartTime([1, 1], 0); + timeContainer.setCurrentTime(1); + checkStartTime([1, 1], 1); + timeContainer.setCurrentTime(1.5); + checkStartTime([1, 1], 1.5); + timeContainer.setCurrentTime(2); + checkStartTime([3, 3], 2); + timeContainer.setCurrentTime(2.5); + checkStartTime([3, 3], 2.5); + timeContainer.setCurrentTime(3); + checkStartTime([3, 3], 3); + timeContainer.setCurrentTime(4); + checkHasNoCurrentInterval(4); + timeContainer.setCurrentTime(5); + checkHasNoCurrentInterval(5); + t.done(); + }, 0); + }); +}); +</script> diff --git a/testing/web-platform/tests/svg/animations/scripted/animatetransform-type-missing-value-default.html b/testing/web-platform/tests/svg/animations/scripted/animatetransform-type-missing-value-default.html new file mode 100644 index 0000000000..aceca27f4c --- /dev/null +++ b/testing/web-platform/tests/svg/animations/scripted/animatetransform-type-missing-value-default.html @@ -0,0 +1,62 @@ +<!doctype html> +<title><animateTransform> 'type' attribute missing/invalid value default</title> +<link rel="help" href="https://svgwg.org/specs/animations/#AnimateTransformElementTypeAttribute"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<svg height="10"> + <rect width="10" height="10" fill="blue"> + <animateTransform attributeName="transform" type="translate" + fill="freeze" dur="1s" from="10 0" to="10 0"/> + </rect> + <rect width="10" height="10" fill="blue"> + <animateTransform attributeName="transform" + fill="freeze" dur="1s" from="30 0" to="30 0"/> + </rect> + <rect width="10" height="10" fill="blue"> + <animateTransform attributeName="transform" type="foo" + fill="freeze" dur="1s" from="50 0" to="50 0"/> + </rect> + <rect width="10" height="10" fill="blue"> + <animateTransform attributeName="transform" type="foo" + fill="freeze" dur="1s" from="70 0" to="70 0"/> + </rect> +</svg> +<script> + const animations = document.querySelectorAll('animateTransform'); + + async_test(t => { + animations[0].addEventListener('beginEvent', t.step_func_done(function() { + let ctm = animations[0].targetElement.getCTM(); + assert_equals(ctm.e, 10); + assert_equals(ctm.f, 0); + })); + }, document.title + ', "type" attribute is "translate"'); + + async_test(t => { + animations[1].addEventListener('beginEvent', t.step_func_done(function() { + let ctm = animations[1].targetElement.getCTM(); + assert_equals(ctm.e, 30); + assert_equals(ctm.f, 0); + })); + }, document.title + ', missing "type" attribute'); + + async_test(t => { + animations[2].addEventListener('beginEvent', t.step_func_done(function() { + let ctm = animations[2].targetElement.getCTM(); + assert_equals(ctm.e, 0); + assert_equals(ctm.f, 0); + })); + }, document.title + ', invalid "type" attribute'); + + async_test(t => { + animations[3].addEventListener('beginEvent', t.step_func(function() { + animations[3].removeAttribute('type'); + + window.requestAnimationFrame(t.step_func_done(function() { + let ctm = animations[3].targetElement.getCTM(); + assert_equals(ctm.e, 70); + assert_equals(ctm.f, 0); + })); + })); + }, document.title + ', removed "type" attribute'); +</script> diff --git a/testing/web-platform/tests/svg/animations/scripted/end-element-on-inactive-element.svg b/testing/web-platform/tests/svg/animations/scripted/end-element-on-inactive-element.svg new file mode 100644 index 0000000000..34be9b9781 --- /dev/null +++ b/testing/web-platform/tests/svg/animations/scripted/end-element-on-inactive-element.svg @@ -0,0 +1,20 @@ +<svg xmlns="http://www.w3.org/2000/svg" xmlns:h="http://www.w3.org/1999/xhtml"> + <h:script src="/resources/testharness.js"/> + <h:script src="/resources/testharnessreport.js"/> + <rect width="100" height="100" fill="red"> + <set id="anim" attributeName="fill" to="green" begin="indefinite"/> + </rect> + <script> + async_test(t => { + let anim = document.getElementById("anim"); + onload = t.step_func(() => { + anim.endElement(); + anim.beginElement(); + + requestAnimationFrame(t.step_func_done(() => { + assert_equals(getComputedStyle(anim.parentNode).fill, "rgb(0, 128, 0)"); + })); + }); + }, "endElement() on an inactive element"); + </script> +</svg> diff --git a/testing/web-platform/tests/svg/animations/scripted/onhover-syncbases.html b/testing/web-platform/tests/svg/animations/scripted/onhover-syncbases.html new file mode 100644 index 0000000000..de757f369a --- /dev/null +++ b/testing/web-platform/tests/svg/animations/scripted/onhover-syncbases.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8"> + <title>Check if onhover events reset correctly when triggered multiple times</title> + <link rel="help" href="https://svgwg.org/svg2-draft/single-page.html#interact-EventAttributes"> + <link rel="author" title="Edvard Thörnros" href="mailto:edvardt@opera.com"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + </head> + <body> + <svg> + <circle id="circle" cx="150" cy="75" r="50" fill="#F00"> + <set attributeName="fill" to="#0F0" begin="mouseover"/> + <set attributeName="fill" to="#F00" begin="mouseout"/> + </circle> + </svg> + <script> +async_test(t => { + let rounds = 5; // How many times the cursor is moved in and out + let circle = document.querySelector("#circle"); + let delay = 20; + function f() { + assert_equals(window.getComputedStyle(circle, null).fill, + "rgb(255, 0, 0)") + if (rounds-- == 0) { + t.done(); + return; + } + + circle.dispatchEvent(new Event("mouseover")); + t.step_timeout(function() { + assert_equals(window.getComputedStyle(circle, null).fill, + "rgb(0, 255, 0)") + circle.dispatchEvent(new Event("mouseout")) + t.step_timeout(f, delay); + }, delay); + } + t.step_timeout(f, 0); +}); + </script> + </body> +</html> diff --git a/testing/web-platform/tests/svg/animations/scripted/paced-value-animation-overwrites-keyTimes.html b/testing/web-platform/tests/svg/animations/scripted/paced-value-animation-overwrites-keyTimes.html new file mode 100644 index 0000000000..56f67dc5ed --- /dev/null +++ b/testing/web-platform/tests/svg/animations/scripted/paced-value-animation-overwrites-keyTimes.html @@ -0,0 +1,37 @@ +<!doctype html> +<title>Paced value animation doesn't overwrite keyTimes</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> + +<meta charset="utf-8"> +<link rel="author" title="Edvard Thörnros" href="mailto:edvardt@opera.com"> +<link rel="help" href="https://www.w3.org/TR/SMIL20/animation.html#animationNS-animateMotionElement"> +<link rel="bug" href="https://bugs.chromium.org/p/chromium/issues/detail?id=231525&hotlist_id=5524&sort=%20rank%20-ID"> + +<svg id="svg" xmlns="http://www.w3.org/2000/svg" width="500" height="500"> + <rect x="151" y="1" width="98" height="98" fill="red"/> + <rect id="rect" x="0" y="0" width="100" height="100" fill="green"> + <animate id="animate1" attributeName="x" dur="10s" calcMode="paced" values="100; 150; 200;" keyTimes="0; 0.2; 1"/> + </rect> +</svg> + +<script> + async_test(function(t) { + window.onload = t.step_func(function() { + let svg = document.getElementById('svg'); + let animate1 = document.getElementById('animate1'); + let rect = document.getElementById('rect'); + t.step_timeout(function() { + // animate1's keyTimes should not be affected by starting with calcMode=paced + animate1.setAttribute('calcMode', 'linear'); + svg.pauseAnimations(); + svg.setCurrentTime(2); + window.requestAnimationFrame(t.step_func(function() { + window.requestAnimationFrame(t.step_func_done(function() { + assert_approx_equals(rect.x.animVal.value, 150, 5); + })); + })); + }, 10); + }); + }); +</script> |