diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 17:32:43 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 17:32:43 +0000 |
| commit | 6bf0a5cb5034a7e684dcc3500e841785237ce2dd (patch) | |
| tree | a68f146d7fa01f0134297619fbe7e33db084e0aa /layout/reftests/svg/smil/motion/animateMotion-rotate-2.svg | |
| parent | Initial commit. (diff) | |
| download | thunderbird-6bf0a5cb5034a7e684dcc3500e841785237ce2dd.tar.xz thunderbird-6bf0a5cb5034a7e684dcc3500e841785237ce2dd.zip | |
Adding upstream version 1:115.7.0.upstream/1%115.7.0upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'layout/reftests/svg/smil/motion/animateMotion-rotate-2.svg')
| -rw-r--r-- | layout/reftests/svg/smil/motion/animateMotion-rotate-2.svg | 52 |
1 files changed, 52 insertions, 0 deletions
diff --git a/layout/reftests/svg/smil/motion/animateMotion-rotate-2.svg b/layout/reftests/svg/smil/motion/animateMotion-rotate-2.svg new file mode 100644 index 0000000000..7f6fcc7cf5 --- /dev/null +++ b/layout/reftests/svg/smil/motion/animateMotion-rotate-2.svg @@ -0,0 +1,52 @@ +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + class="reftest-wait"> + <!-- Tests for rotate="auto" and "auto-reverse" --> + <!-- The idea here is to create positioned red "holes" in the lime + background, and then hopefully use paused <animateMotion> elements to + position other elements exactly on top of the hole. --> + <style> + .background { fill: lime } + .hole { color: red } + .testBegin { color: purple } + .testEnd { color: orange } + .mask { color: lime } + </style> + <defs> + <!-- A 'pin' marker, just offscreen, pointing directly down at 0,0 --> + <!-- NOTE: The lime 2.83px-wide stroke is a hack to get around "seams" in + SVG when redrawing the same non-pixel-aligned shape on top of itself + in different colors. 2.83 is just over 2*sqrt(2), sqrt(2) being the + maximum distance from a path that antialiasing of square pixels can + cause the path to affect. --> + <path id="marker" d="m0,0 l-10,-30 c-5,-20 25,-20 20,0 z" + style="fill: currentColor; stroke: lime; stroke-width: 2.83px"/> + </defs> + <script xlink:href="../smil-util.js" type="text/javascript"/> + <script type="text/javascript"> + function doTest() { + setTimeAndSnapshot(101, true); + } + window.addEventListener("MozReftestInvalidate", doTest, false); + </script> + + <!-- Big green background to match lime.svg --> + <rect class="background" width="100%" height="100%" /> + <g transform="translate(50,50)"> + <!-- Here's the hole --> + <use xlink:href="#marker" class="hole" + transform="translate(20,20) rotate(45)"/> + + <!-- And here's a stack of elements animated with 'animateMotion' that + should end up there. --> + <use xlink:href="#marker" class="testBegin"> + <animateMotion from="20,20" to="40,40" rotate="auto" begin="101s" dur="1s"/> + </use> + <use xlink:href="#marker" class="testEnd"> + <animateMotion by="20,20" rotate="auto" begin="100" dur="1s" fill="freeze"/> + </use> + <use xlink:href="#marker" class="mask"> + <animateMotion by="40,40" rotate="auto" begin="100s" dur="2s"/> + </use> + </g> +</svg> |