feat: Flush animation frames every 16ms when using legacy timers (#11567

)

CHANGELOG.md

@@ -2,6 +2,8 @@
 
 ### Features
 
+- `[jest-fake-timers]` Flush callbacks scheduled with `requestAnimationFrame` every 16ms when using legacy timers. ([#11523](https://github.com/facebook/jest/pull/11567))
+
 ### Fixes
 
 - `[jest-reporter]` Allow `node-notifier@10` as peer dependency ([#11523](https://github.com/facebook/jest/pull/11523))

e2e/fake-time/legacy/requestAnimationFrame/__tests__/test.js

@@ -0,0 +1,26 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates. All Rights Reserved.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/* global requestAnimationFrame */
+
+'use strict';
+
+test('requestAnimationFrame', () => {
+  jest.useFakeTimers('legacy');
+  let frameTimestamp = -1;
+  requestAnimationFrame(timestamp => {
+    frameTimestamp = timestamp;
+  });
+
+  jest.advanceTimersByTime(15);
+
+  expect(frameTimestamp).toBe(-1);
+
+  jest.advanceTimersByTime(1);
+
+  expect(frameTimestamp).toBeGreaterThan(15);
+});

e2e/fake-time/legacy/requestAnimationFrame/package.json

@@ -0,0 +1,5 @@
+{
+  "jest": {
+    "testEnvironment": "jsdom"
+  }
+}

e2e/fake-time/modern/requestAnimationFrame/__tests__/test.js

@@ -0,0 +1,26 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates. All Rights Reserved.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/* global requestAnimationFrame */
+
+'use strict';
+
+test('requestAnimationFrame', () => {
+  jest.useFakeTimers('modern');
+  let frameTimestamp = -1;
+  requestAnimationFrame(timestamp => {
+    frameTimestamp = timestamp;
+  });
+
+  jest.advanceTimersByTime(15);
+
+  expect(frameTimestamp).toBe(-1);
+
+  jest.advanceTimersByTime(1);
+
+  expect(frameTimestamp).toBeGreaterThan(15);
+});

e2e/fake-time/modern/requestAnimationFrame/package.json

@@ -0,0 +1,5 @@
+{
+  "jest": {
+    "testEnvironment": "jsdom"
+  }
+}