зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1357993: Set dom.animations-api.core.enabled preference. r=hiro
We need 'dom.animations-api.core.enabled' preference to test animation. In this patch, set the preference before DOMWindowUtils test with animation. MozReview-Commit-ID: 9lz0hWvyo83 --HG-- extra : rebase_source : 1972bab70063a354efb57115b8ffed9e1bb41623
This commit is contained in:
Daisuke Akatsuka
Родитель
bed092fb4a
Коммит
7074d51c3c
|
|
@ -0,0 +1,151 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>DOMWindowUtils test with animation</title>
|
||||
</head>
|
||||
<body>
|
||||
<script type="application/javascript">
|
||||
|
||||
const SimpleTest = window.opener.SimpleTest;
|
||||
const utils = SpecialPowers.getDOMWindowUtils(window);
|
||||
const next = window.opener.next;
|
||||
const is = window.opener.is;
|
||||
const ok = window.opener.ok;
|
||||
|
||||
function addStyle(rules) {
|
||||
const extraStyle = document.createElement("style");
|
||||
document.head.appendChild(extraStyle);
|
||||
rules.forEach(rule => {
|
||||
extraStyle.sheet.insertRule(rule, extraStyle.sheet.cssRules.length);
|
||||
});
|
||||
}
|
||||
|
||||
function deleteStyle() {
|
||||
document.head.querySelector("style").remove();
|
||||
}
|
||||
|
||||
|
||||
function test_getUnanimatedComputedStyle() {
|
||||
[
|
||||
{
|
||||
property: "opacity",
|
||||
keyframes: [1, 0],
|
||||
expectedInitialStyle: "1",
|
||||
expectedDuringTransitionStyle: "0",
|
||||
isDiscrete: false,
|
||||
},
|
||||
{
|
||||
property: "clear",
|
||||
keyframes: ["left", "inline-end"],
|
||||
expectedInitialStyle: "none",
|
||||
expectedDuringTransitionStyle: "inline-end",
|
||||
isDiscrete: true,
|
||||
},
|
||||
].forEach(testcase => {
|
||||
const { property, keyframes, expectedInitialStyle,
|
||||
expectedDuringTransitionStyle, isDiscrete } = testcase;
|
||||
|
||||
[null, "unset", "initial", "inherit"].forEach(initialStyle => {
|
||||
const scriptAnimation = target => {
|
||||
return target.animate({ [property]: keyframes }, 1000);
|
||||
}
|
||||
checkUnanimatedComputedStyle(property, initialStyle, null,
|
||||
expectedInitialStyle, expectedInitialStyle,
|
||||
scriptAnimation, "script animation");
|
||||
|
||||
const cssAnimationStyle = `@keyframes cssanimation {`
|
||||
+ ` from { ${property}: ${ keyframes[0] }; }`
|
||||
+ ` to { ${property}: ${ keyframes[1] }; } }`;
|
||||
addStyle([cssAnimationStyle]);
|
||||
const cssAnimation = target => {
|
||||
target.style.animation = "cssanimation 1s";
|
||||
return target.getAnimations()[0];
|
||||
}
|
||||
checkUnanimatedComputedStyle(property, initialStyle, null,
|
||||
expectedInitialStyle, expectedInitialStyle,
|
||||
cssAnimation, "CSS Animations");
|
||||
deleteStyle();
|
||||
|
||||
// We don't support discrete animations for CSS Transitions yet.
|
||||
// (bug 1320854)
|
||||
if (!isDiscrete) {
|
||||
const cssTransition = target => {
|
||||
target.style[property] = keyframes[0];
|
||||
target.style.transition =
|
||||
`${ property } 1s`;
|
||||
window.getComputedStyle(target)[property];
|
||||
target.style[property] = keyframes[1];
|
||||
return target.getAnimations()[0];
|
||||
}
|
||||
checkUnanimatedComputedStyle(property, initialStyle, null,
|
||||
expectedInitialStyle,
|
||||
expectedDuringTransitionStyle,
|
||||
cssTransition, "CSS Transitions");
|
||||
}
|
||||
|
||||
addStyle([cssAnimationStyle,
|
||||
".pseudo::before { animation: cssanimation 1s; }"]);
|
||||
const pseudoAnimation = target => {
|
||||
target.classList.add("pseudo");
|
||||
return target.getAnimations({ subtree: true })[0];
|
||||
}
|
||||
checkUnanimatedComputedStyle(property, initialStyle, "::before",
|
||||
expectedInitialStyle, expectedInitialStyle,
|
||||
pseudoAnimation, "Animation at pseudo");
|
||||
deleteStyle();
|
||||
});
|
||||
});
|
||||
|
||||
SimpleTest.doesThrow(
|
||||
() => utils.getUnanimatedComputedStyle(div, null, "background"),
|
||||
"NS_ERROR_INVALID_ARG",
|
||||
"Shorthand property should throw");
|
||||
|
||||
SimpleTest.doesThrow(
|
||||
() => utils.getUnanimatedComputedStyle(div, null, "invalid"),
|
||||
"NS_ERROR_INVALID_ARG",
|
||||
"Invalid property should throw");
|
||||
|
||||
SimpleTest.doesThrow(
|
||||
() => utils.getUnanimatedComputedStyle(null, null, "opacity"),
|
||||
"NS_ERROR_INVALID_ARG",
|
||||
"Null element should throw");
|
||||
|
||||
next();
|
||||
window.close();
|
||||
}
|
||||
|
||||
function checkUnanimatedComputedStyle(property, initialStyle, pseudoType,
|
||||
expectedBeforeAnimation,
|
||||
expectedDuringAnimation,
|
||||
animate, animationType) {
|
||||
const div = document.createElement("div");
|
||||
document.body.appendChild(div);
|
||||
|
||||
if (initialStyle) {
|
||||
div.style[property] = initialStyle;
|
||||
}
|
||||
|
||||
is(utils.getUnanimatedComputedStyle(div, pseudoType, property),
|
||||
expectedBeforeAnimation,
|
||||
`'${ property }' property with '${ initialStyle }' style `
|
||||
+ `should be '${ expectedBeforeAnimation }' `
|
||||
+ `before animating by ${ animationType }`);
|
||||
|
||||
const animation = animate(div);
|
||||
animation.currentTime = 500;
|
||||
is(utils.getUnanimatedComputedStyle(div, pseudoType, property),
|
||||
expectedDuringAnimation,
|
||||
`'${ property }' property with '${ initialStyle }' style `
|
||||
+ `should be '${ expectedDuringAnimation }' `
|
||||
+ `even while animating by ${ animationType }`);
|
||||
|
||||
div.remove();
|
||||
}
|
||||
|
||||
window.addEventListener("load", test_getUnanimatedComputedStyle);
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -126,6 +126,7 @@ support-files =
|
|||
file_bug907892.html
|
||||
file_bug945152.jar
|
||||
file_bug1274806.html
|
||||
file_domwindowutils_animation.html
|
||||
file_general_document.html
|
||||
file_htmlserializer_1.html
|
||||
file_htmlserializer_1_bodyonly.html
|
||||
|
|
|
|||
|
|
@ -152,122 +152,12 @@ function test_getAnimationType() {
|
|||
}
|
||||
|
||||
function test_getUnanimatedComputedStyle() {
|
||||
[
|
||||
{
|
||||
property: "opacity",
|
||||
keyframes: [1, 0],
|
||||
expectedInitialStyle: "1",
|
||||
expectedDuringTransitionStyle: "0",
|
||||
isDiscrete: false,
|
||||
},
|
||||
{
|
||||
property: "clear",
|
||||
keyframes: ["left", "inline-end"],
|
||||
expectedInitialStyle: "none",
|
||||
expectedDuringTransitionStyle: "inline-end",
|
||||
isDiscrete: true,
|
||||
},
|
||||
].forEach(testcase => {
|
||||
const { property, keyframes, expectedInitialStyle,
|
||||
expectedDuringTransitionStyle, isDiscrete } = testcase;
|
||||
|
||||
[null, "unset", "initial", "inherit"].forEach(initialStyle => {
|
||||
const scriptAnimation = target => {
|
||||
return target.animate({ [property]: keyframes }, 1000);
|
||||
}
|
||||
checkUnanimatedComputedStyle(property, initialStyle, null,
|
||||
expectedInitialStyle, expectedInitialStyle,
|
||||
scriptAnimation, "script animation");
|
||||
|
||||
const cssAnimationStyle = `@keyframes cssanimation {`
|
||||
+ ` from { ${property}: ${ keyframes[0] }; }`
|
||||
+ ` to { ${property}: ${ keyframes[1] }; } }`;
|
||||
document.styleSheets[0].insertRule(cssAnimationStyle, 0);
|
||||
const cssAnimation = target => {
|
||||
target.style.animation = "cssanimation 1s";
|
||||
return target.getAnimations()[0];
|
||||
}
|
||||
checkUnanimatedComputedStyle(property, initialStyle, null,
|
||||
expectedInitialStyle, expectedInitialStyle,
|
||||
cssAnimation, "CSS Animations");
|
||||
document.styleSheets[0].deleteRule(0);
|
||||
|
||||
// We don't support discrete animations for CSS Transitions yet.
|
||||
// (bug 1320854)
|
||||
if (!isDiscrete) {
|
||||
const cssTransition = target => {
|
||||
target.style[property] = keyframes[0];
|
||||
target.style.transition =
|
||||
`${ property } 1s`;
|
||||
window.getComputedStyle(target)[property];
|
||||
target.style[property] = keyframes[1];
|
||||
return target.getAnimations()[0];
|
||||
}
|
||||
checkUnanimatedComputedStyle(property, initialStyle, null,
|
||||
expectedInitialStyle,
|
||||
expectedDuringTransitionStyle,
|
||||
cssTransition, "CSS Transitions");
|
||||
}
|
||||
|
||||
document.styleSheets[0].insertRule(cssAnimationStyle, 0);
|
||||
document.styleSheets[0].insertRule(
|
||||
".pseudo::before { animation: cssanimation 1s; }", 0);
|
||||
const pseudoAnimation = target => {
|
||||
target.classList.add("pseudo");
|
||||
return target.getAnimations({ subtree: true })[0];
|
||||
}
|
||||
checkUnanimatedComputedStyle(property, initialStyle, "::before",
|
||||
expectedInitialStyle, expectedInitialStyle,
|
||||
pseudoAnimation, "Animation at pseudo");
|
||||
document.styleSheets[0].deleteRule(0);
|
||||
document.styleSheets[0].deleteRule(0);
|
||||
});
|
||||
});
|
||||
|
||||
SimpleTest.doesThrow(
|
||||
() => utils.getUnanimatedComputedStyle(div, null, "background"),
|
||||
"NS_ERROR_INVALID_ARG",
|
||||
"Shorthand property should throw");
|
||||
|
||||
SimpleTest.doesThrow(
|
||||
() => utils.getUnanimatedComputedStyle(div, null, "invalid"),
|
||||
"NS_ERROR_INVALID_ARG",
|
||||
"Invalid property should throw");
|
||||
|
||||
SimpleTest.doesThrow(
|
||||
() => utils.getUnanimatedComputedStyle(null, null, "opacity"),
|
||||
"NS_ERROR_INVALID_ARG",
|
||||
"Null element should throw");
|
||||
|
||||
next();
|
||||
}
|
||||
|
||||
function checkUnanimatedComputedStyle(property, initialStyle, pseudoType,
|
||||
expectedBeforeAnimation,
|
||||
expectedDuringAnimation,
|
||||
animate, animationType) {
|
||||
const div = document.createElement("div");
|
||||
document.body.appendChild(div);
|
||||
|
||||
if (initialStyle) {
|
||||
div.style[property] = initialStyle;
|
||||
}
|
||||
|
||||
is(utils.getUnanimatedComputedStyle(div, pseudoType, property),
|
||||
expectedBeforeAnimation,
|
||||
`'${ property }' property with '${ initialStyle }' style `
|
||||
+ `should be '${ expectedBeforeAnimation }' `
|
||||
+ `before animating by ${ animationType }`);
|
||||
|
||||
const animation = animate(div);
|
||||
animation.currentTime = 500;
|
||||
is(utils.getUnanimatedComputedStyle(div, pseudoType, property),
|
||||
expectedDuringAnimation,
|
||||
`'${ property }' property with '${ initialStyle }' style `
|
||||
+ `should be '${ expectedDuringAnimation }' `
|
||||
+ `even while animating by ${ animationType }`);
|
||||
|
||||
div.remove();
|
||||
SpecialPowers.pushPrefEnv(
|
||||
{ set: [["dom.animations-api.core.enabled", true]] },
|
||||
() => {
|
||||
window.open("file_domwindowutils_animation.html");
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
var tests = [
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче