Bug 911987 part 3 - Add onwebkit prefixed event handler tests. r=birtles
authorMantaroh Yoshinaga <mantaroh@gmail.com>
Fri, 05 Aug 2016 14:03:51 +0900
changeset 308523 893ae2ebfe9fcbf6a9fade1c873ad6e4fa7ba9be
parent 308522 c941f7d76a27530cecc9d94106e28e058bc7b483
child 308524 9dc08c2240db8b52fbb39e29285a28c509afc1be
push id31129
push usermantaroh@gmail.com
push dateMon, 08 Aug 2016 02:36:40 +0000
treeherderautoland@9dc08c2240db [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersbirtles
bugs911987
milestone51.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 911987 part 3 - Add onwebkit prefixed event handler tests. r=birtles MozReview-Commit-ID: B9SmsyXjLil
layout/style/test/test_animations_event_handler_attribute.html
--- a/layout/style/test/test_animations_event_handler_attribute.html
+++ b/layout/style/test/test_animations_event_handler_attribute.html
@@ -19,32 +19,28 @@ https://bugzilla.mozilla.org/show_bug.cg
 <a target="_blank"
   href="https://bugzilla.mozilla.org/show_bug.cgi?id=911987">Mozilla Bug
   911987</a>
 <div id="display"></div>
 <pre id="test">
 <script type="application/javascript">
 'use strict';
 
-var gDisplay = document.getElementById('display');
-
 // Create the div element with event handlers.
 // We need two elements: one with the content attribute speficied and one
 // with the IDL attribute specified since we can't set these independently.
-function createAndRegisterTargets(parentElement) {
+function createAndRegisterTargets(eventAttributes) {
+  var displayElement = document.getElementById('display');
   var contentAttributeElement = document.createElement("div");
   var idlAttributeElement     = document.createElement("div");
-  parentElement.appendChild(contentAttributeElement);
-  parentElement.appendChild(idlAttributeElement);
+  displayElement.appendChild(contentAttributeElement);
+  displayElement.appendChild(idlAttributeElement);
 
   // Add handlers
-  [ 'onanimationstart',
-    'onanimationiteration',
-    'onanimationend',
-    'ontransitionend' ].forEach(event => {
+  eventAttributes.forEach(event => {
     contentAttributeElement.setAttribute(event, 'handleEvent(event);');
     contentAttributeElement.handlerType = 'content attribute';
     idlAttributeElement[event] = handleEvent;
     idlAttributeElement.handlerType = 'IDL attribute';
   });
 
   return [contentAttributeElement, idlAttributeElement];
 }
@@ -53,32 +49,35 @@ function handleEvent(event) {
   if (event.target.receivedEventType) {
     ok(false, `Received ${event.type} event, but this element have previous `
               `received event '${event.target.receivedEventType}'.`);
     return;
   }
   event.target.receivedEventType = event.type;
 }
 
-function checkReceivedEvents(eventType, elements) {
+function checkReceivedEvents(eventType, elements, evalFunc) {
+  if (!evalFunc) { evalFunc = is; }
   elements.forEach(element => {
-    is(element.receivedEventType, eventType,
-       `Expected to receive '${eventType}', got ` +
-       `'${element.receivedEventType}', for event handler registered using ` +
-       ` ${element.handlerType}`);
+    evalFunc(element.receivedEventType, eventType,
+             `Expected to receive '${eventType}', got
+              '${element.receivedEventType}', for event handler registered
+              using ${element.handlerType}`);
     element.receivedEventType = undefined;
   });
 }
 
 // Take over the refresh driver right from the start.
 advance_clock(0);
 
 // 1. Test CSS Animation event handlers.
 
-var targets = createAndRegisterTargets(gDisplay);
+var targets = createAndRegisterTargets([ 'onanimationstart',
+                                         'onanimationiteration',
+                                         'onanimationend' ]);
 targets.forEach(div => {
   div.setAttribute('style', 'animation: anim 100ms 2');
   getComputedStyle(div).animationName;  // flush
 });
 
 advance_clock(0);
 checkReceivedEvents("animationstart", targets);
 
@@ -88,26 +87,63 @@ checkReceivedEvents("animationiteration"
 advance_clock(200);
 checkReceivedEvents("animationend", targets);
 
 targets.forEach(div => { div.remove(); });
 
 // 2. Test CSS Transition event handlers.
 
 advance_clock(0);
-var targets = createAndRegisterTargets(gDisplay);
+var targets = createAndRegisterTargets([ 'ontransitionend' ]);
 targets.forEach(div => {
   div.style.transition = 'margin-left 100ms';
   getComputedStyle(div).marginLeft; // flush
   div.style.marginLeft = "200px";
   getComputedStyle(div).marginLeft; // flush
 });
 
 advance_clock(100);
 checkReceivedEvents("transitionend", targets);
 
 targets.forEach(div => { div.remove(); });
 
+// 3. Test prefixed CSS Animation event handlers.
+
+var targets = createAndRegisterTargets([ 'onwebkitanimationstart',
+                                         'onwebkitanimationiteration',
+                                         'onwebkitanimationend' ]);
+targets.forEach(div => {
+  div.setAttribute('style', 'animation: anim 100ms 2');
+  getComputedStyle(div).animationName;  // flush
+});
+
+advance_clock(0);
+checkReceivedEvents("webkitAnimationStart", targets, todo_is);
+
+advance_clock(100);
+checkReceivedEvents("webkitAnimationIteration", targets, todo_is);
+
+advance_clock(200);
+checkReceivedEvents("webkitAnimationEnd", targets, todo_is);
+
+targets.forEach(div => { div.remove(); });
+
+// 4. Test prefixed CSS Transition event handlers.
+
+advance_clock(0);
+var targets = createAndRegisterTargets([ 'onwebkittransitionend' ]);
+targets.forEach(div => {
+  div.style.transition = 'margin-left 100ms';
+  getComputedStyle(div).marginLeft; // flush
+  div.style.marginLeft = "200px";
+  getComputedStyle(div).marginLeft; // flush
+});
+
+advance_clock(100);
+checkReceivedEvents("webkitTransitionEnd", targets, todo_is);
+
+targets.forEach(div => { div.remove(); });
+
 SpecialPowers.DOMWindowUtils.restoreNormalRefresh();
 
 </script>
 </body>
 </html>