Bug 1357993: Set dom.animations-api.core.enabled preference. r=hiro draft
authorDaisuke Akatsuka <dakatsuka@mozilla.com>
Mon, 24 Apr 2017 16:53:59 +0900
changeset 567025 1972bab70063a354efb57115b8ffed9e1bb41623
parent 566789 8e969cc9aff49f845678cba5b35d9dd8aa340f16
child 625498 8531f24075fdd3de9d92be9859274507c77683b5
push id55416
push userbmo:dakatsuka@mozilla.com
push dateMon, 24 Apr 2017 09:55:44 +0000
reviewershiro
bugs1357993
milestone55.0a1
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
dom/base/test/file_domwindowutils_animation.html
dom/base/test/mochitest.ini
dom/base/test/test_domwindowutils.html
new file mode 100644
--- /dev/null
+++ b/dom/base/test/file_domwindowutils_animation.html
@@ -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>
--- a/dom/base/test/mochitest.ini
+++ b/dom/base/test/mochitest.ini
@@ -121,16 +121,17 @@ support-files =
   file_bug804395.jar
   file_bug869432.eventsource
   file_bug869432.eventsource^headers^
   file_bug902350.html
   file_bug902350_frame.html
   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
   file_htmlserializer_1_format.html
   file_htmlserializer_1_linebreak.html
   file_htmlserializer_1_links.html
   file_htmlserializer_1_nested_body.html
   file_htmlserializer_1_no_body.html
--- a/dom/base/test/test_domwindowutils.html
+++ b/dom/base/test/test_domwindowutils.html
@@ -147,132 +147,22 @@ function test_getAnimationType() {
     () => utils.getAnimationTypeForLonghand("invalid"),
     "NS_ERROR_ILLEGAL_VALUE",
     "Invalid property should throw");
 
   next();
 }
 
 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 = [
   test_sendMouseEventDefaults,
   test_sendMouseEventOptionals,
   test_getAnimationType,
   test_getUnanimatedComputedStyle
 ];