Skip to content

Commit c086431

Browse files
Critterosmeta-codesync[bot]
authored andcommitted
Add TypeScript declarations for requestIdleCallback and cancelIdleCallback (#57545)
Summary: `requestIdleCallback` and `cancelIdleCallback` exist at runtime on both architectures. The New Architecture has a native implementation since 0.75 in #44759 (landed as abfadc6, closing #44636). Legacy architecture has a JS-timer-based implementation in `JSTimers` since 2016 (18394fb, follow-up to #5052). Support for the `options` param was added in cf51aee. The API is documented at https://reactnative.dev/docs/global-requestIdleCallback Flow libdefs already declare both functions in`flow/global.js` The public TypeScript declarations never included them. React Native projects compile without `lib: ["dom"]`, so TypeScript users get no declaration This PR adds the declarations to the `Timer Functions` region of `src/types/globals.d.ts`, based on the Flow signatures ## Changelog: [GENERAL] [ADDED] - Add TypeScript declarations for `requestIdleCallback` and `cancelIdleCallback` Pull Request resolved: #57545 Test Plan: Added `testRequestIdleCallback()` to `packages/react-native/__typetests__/globals.tsx` ``` yarn test-generated-typescript yarn test-typescript-legacy yarn lint yarn prettier ``` Reviewed By: javache Differential Revision: D112540741 Pulled By: fabriziocucci fbshipit-source-id: 77f26b4729ecd6cd6b723da026d45730cee22995
1 parent 7825d51 commit c086431

2 files changed

Lines changed: 33 additions & 0 deletions

File tree

packages/react-native/__typetests__/globals.tsx

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -137,6 +137,30 @@ function testRequestAnimationFrame(){
137137
);
138138
}
139139

140+
function testRequestIdleCallback() {
141+
cancelIdleCallback(null);
142+
cancelIdleCallback(undefined);
143+
144+
let handle = requestIdleCallback(deadline => {
145+
const didTimeout: boolean = deadline.didTimeout;
146+
const remaining: number = deadline.timeRemaining();
147+
console.log(didTimeout, remaining);
148+
});
149+
cancelIdleCallback(handle);
150+
151+
handle = requestIdleCallback(noop, { timeout: 100 });
152+
cancelIdleCallback(handle);
153+
154+
handle = requestIdleCallback(noop, {});
155+
cancelIdleCallback(handle);
156+
157+
// @ts-expect-error
158+
requestIdleCallback(noop, { timeout: 'wrong-type' });
159+
160+
// @ts-expect-error
161+
cancelIdleCallback('wrong-type');
162+
}
163+
140164
const fetchCopy: WindowOrWorkerGlobalScope['fetch'] = fetch;
141165

142166
const myHeaders = new Headers();

packages/react-native/src/types/globals.d.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -125,6 +125,15 @@ declare global {
125125
function cancelAnimationFrame(handle: number | null | undefined): void;
126126
function requestAnimationFrame(callback: (time: number) => void): number;
127127

128+
function requestIdleCallback(
129+
callback: (deadline: {
130+
didTimeout: boolean;
131+
timeRemaining: () => number;
132+
}) => void,
133+
options?: {timeout?: number | undefined},
134+
): number;
135+
function cancelIdleCallback(handle: number | null | undefined): void;
136+
128137
function fetchBundle(
129138
bundleId: number,
130139
callback: (error?: Error | null) => void,

0 commit comments

Comments
 (0)