fix(spec): fakeAsyncTestSpec should handle requestAnimationFrame (#805)

Fixes #804.

Author: vikerman

Diff for: lib/zone-spec/fake-async-test.ts

@@ -297,8 +297,15 @@
               break;
             case 'XMLHttpRequest.send':
               throw new Error('Cannot make XHRs from within a fake async test.');
+            case 'requestAnimationFrame':
+            case 'webkitRequestAnimationFrame':
+            case 'mozRequestAnimationFrame':
+              // Simulate a requestAnimationFrame by using a setTimeout with 16 ms.
+              // (60 frames per second)
+              task.data['handleId'] = this._setTimeout(task.invoke, 16, (task.data as any)['args']);
+              break;
             default:
-              task = delegate.scheduleTask(target, task);
+              throw new Error('Unknown macroTask scheduled in fake async test: ' + task.source);
           }
           break;
         case 'eventTask':
@@ -311,6 +318,9 @@
     onCancelTask(delegate: ZoneDelegate, current: Zone, target: Zone, task: Task): any {
       switch (task.source) {
         case 'setTimeout':
+        case 'requestAnimationFrame':
+        case 'webkitRequestAnimationFrame':
+        case 'mozRequestAnimationFrame':
           return this._clearTimeout(task.data['handleId']);
         case 'setInterval':
           return this._clearInterval(task.data['handleId']);

Diff for: test/zone-spec/fake-async-test.spec.ts

@@ -516,6 +516,45 @@ describe('FakeAsyncTestZoneSpec', () => {
     });
   });
 
+  describe('requestAnimationFrame', () => {
+    const functions =
+        ['requestAnimationFrame', 'webkitRequestAnimationFrame', 'mozRequestAnimationFrame'];
+    functions.forEach((fnName) => {
+      describe(fnName, ifEnvSupports(fnName, () => {
+                 it('should schedule a requestAnimationFrame with timeout of 16ms', () => {
+                   fakeAsyncTestZone.run(() => {
+                     let ran = false;
+                     requestAnimationFrame(() => {
+                       ran = true;
+                     });
+
+                     testZoneSpec.tick(6);
+                     expect(ran).toEqual(false);
+
+                     testZoneSpec.tick(10);
+                     expect(ran).toEqual(true);
+                   });
+                 });
+                 it('should cancel a scheduled requestAnimatiomFrame', () => {
+                   fakeAsyncTestZone.run(() => {
+                     let ran = false;
+                     const id = requestAnimationFrame(() => {
+                       ran = true;
+                     });
+
+                     testZoneSpec.tick(6);
+                     expect(ran).toEqual(false);
+
+                     cancelAnimationFrame(id);
+
+                     testZoneSpec.tick(10);
+                     expect(ran).toEqual(false);
+                   });
+                 });
+               }));
+    });
+  });
+
   describe('XHRs', ifEnvSupports('XMLHttpRequest', () => {
              it('should throw an exception if an XHR is initiated in the zone', () => {
                expect(() => {