зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1564128 part 3 - Reftests checking for if animations are applied in print preview r=hiro
Changes the existing reftest to expect success, and adds additional tests for pseudo-elements, paused animations, the web animation API, and shadow DOM elements. Differential Revision: https://phabricator.services.mozilla.com/D73140
This commit is contained in:
Родитель
c161bb67d3
Коммит
c6e5d7a8bd
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html class="reftest-paged">
|
||||
<title>Static CSS animation in Shadow DOM</title>
|
||||
<style>
|
||||
p {
|
||||
color: olive;
|
||||
}
|
||||
</style>
|
||||
<p>blue with animation support; olive without</p>
|
||||
<p>orange with animation support; olive without</p>
|
|
@ -0,0 +1,6 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html class="reftest-paged">
|
||||
<title>Static CSS animation in Shadow DOM</title>
|
||||
<p style="color: blue">blue with animation support; olive without</p>
|
||||
<p style="color: orange">orange with animation support; olive without</p>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html class="reftest-paged">
|
||||
<title>Static CSS animation in Shadow DOM</title>
|
||||
<style>
|
||||
|
||||
@keyframes a {
|
||||
from, to { color: blue }
|
||||
}
|
||||
|
||||
.anim {
|
||||
color: olive;
|
||||
animation: a 1s infinite;
|
||||
}
|
||||
|
||||
</style>
|
||||
<p class="anim">blue with animation support; olive without</p>
|
||||
<div id="holder"></div>
|
||||
<script>
|
||||
let shadow_style = style = document.createElement("style");
|
||||
shadow_style.textContent = "@keyframes shadow_a { from, to { color: orange } }";
|
||||
|
||||
let shadow = document.getElementById("holder").attachShadow({mode:"open"});
|
||||
let shadow_p = document.createElement("p");
|
||||
|
||||
shadow_p.style.color = "olive";
|
||||
shadow_p.style.animation = "shadow_a 1s infinite";
|
||||
shadow_p.innerHTML = "orange with animation support; olive without";
|
||||
shadow.appendChild(shadow_style);
|
||||
shadow.appendChild(shadow_p);
|
||||
</script>
|
|
@ -0,0 +1,4 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html class="reftest-paged">
|
||||
<title>Paused CSS animation</title>
|
||||
<p style="color: olive">blue with animation support; olive without</p>
|
|
@ -0,0 +1,4 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html class="reftest-paged">
|
||||
<title>Paused CSS animation</title>
|
||||
<p style="color: blue">blue with animation support; olive without</p>
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html class="reftest-paged">
|
||||
<title>Paused CSS animation</title>
|
||||
<style>
|
||||
|
||||
@keyframes a {
|
||||
from, to { color: blue; }
|
||||
}
|
||||
|
||||
p {
|
||||
color: olive;
|
||||
animation: a 1s infinite;
|
||||
}
|
||||
|
||||
</style>
|
||||
<p id="anim">blue with animation support; olive without</p>
|
||||
<script>
|
||||
let element = document.getElementById("anim");
|
||||
element.style.animationPlayState = "paused";
|
||||
</script>
|
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html class="reftest-paged">
|
||||
<title>Static CSS animation</title>
|
||||
<style>
|
||||
|
||||
p {
|
||||
color: olive;
|
||||
}
|
||||
|
||||
p::after {
|
||||
color: purple;
|
||||
content: "(::after)";
|
||||
}
|
||||
|
||||
p::before {
|
||||
color: yellow;
|
||||
content: "(::before)";
|
||||
}
|
||||
|
||||
</style>
|
||||
<p>blue with animation support; olive without</p>
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html class="reftest-paged">
|
||||
<title>Static CSS animation</title>
|
||||
<style>
|
||||
|
||||
p {
|
||||
color: blue;
|
||||
}
|
||||
|
||||
</style>
|
||||
<p>(::before)blue with animation support; olive without(::after)</p>
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html class="reftest-paged">
|
||||
<title>Static CSS animation</title>
|
||||
<style>
|
||||
|
||||
@keyframes a {
|
||||
from, to { color: blue }
|
||||
}
|
||||
|
||||
p {
|
||||
color: olive;
|
||||
animation: a 1s infinite;
|
||||
}
|
||||
p::after {
|
||||
color: purple;
|
||||
content: "(::after)";
|
||||
animation: a 1s infinite;
|
||||
}
|
||||
|
||||
p::before {
|
||||
color: yellow;
|
||||
content: "(::before)";
|
||||
animation: a 1s infinite;
|
||||
}
|
||||
|
||||
</style>
|
||||
<p>blue with animation support; olive without</p>
|
|
@ -0,0 +1,4 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html class="reftest-paged">
|
||||
<title>Web animation</title>
|
||||
<p style="color: olive">blue with animation support; olive without</p>
|
|
@ -0,0 +1,4 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html class="reftest-paged">
|
||||
<title>Web animation</title>
|
||||
<p style="color: blue">blue with animation support; olive without</p>
|
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html class="reftest-paged">
|
||||
<title>Web animation</title>
|
||||
<p id="anim" style="color: olive">blue with animation support; olive without</p>
|
||||
<script>
|
||||
const animationData = [
|
||||
{"color":"#0000FF"},
|
||||
{"color":"#0000FF"}
|
||||
];
|
||||
|
||||
const animationTiming = {
|
||||
"duration":1,
|
||||
"iterations":Infinity
|
||||
};
|
||||
|
||||
let element = document.getElementById("anim");
|
||||
element.animate(animationData, animationTiming);
|
||||
</script>
|
|
@ -1,7 +1,15 @@
|
|||
== screen-animations.html screen-animations-ref.html
|
||||
!= screen-animations.html screen-animations-notref.html
|
||||
fails == print-no-animations.html print-no-animations-ref.html # reftest harness doesn't actually make pres context non-dynamic for reftest-paged tests.
|
||||
fails != print-no-animations.html print-no-animations-notref.html # reftest harness doesn't actually make pres context non-dynamic for reftest-paged tests.
|
||||
== print-animations.html print-animations-ref.html
|
||||
!= print-animations.html print-animations-notref.html
|
||||
== print-pseudo-animations.html print-pseudo-animations-ref.html
|
||||
!= print-pseudo-animations.html print-pseudo-animations-notref.html
|
||||
== print-animations-shadow.html print-animations-shadow-ref.html
|
||||
!= print-animations-shadow.html print-animations-shadow-notref.html
|
||||
== print-paused-animations.html print-paused-animations-ref.html
|
||||
!= print-paused-animations.html print-paused-animations-notref.html
|
||||
== print-web-animations.html print-web-animations-ref.html
|
||||
!= print-web-animations.html print-web-animations-notref.html
|
||||
== animate-opacity.html animate-opacity-ref.html
|
||||
== animate-preserves3d.html animate-preserves3d-ref.html
|
||||
== animation-initially-out-of-view-with-delay.html animation-initially-out-of-view-with-delay-ref.html
|
||||
|
|
Загрузка…
Ссылка в новой задаче