enhance: Environments without RequestIdleCallback will call immediate…

…ly (#3033)

.changeset/itchy-kiwis-design.md

@@ -0,0 +1,6 @@
+---
+"@data-client/react": patch
+"@data-client/core": patch
+---
+
+Environments without RequestIdleCallback will call immediately

.circleci/config.yml

@@ -117,8 +117,9 @@ jobs:
           command: |
             node --version
       - run:
+          # we must use npm because yarn 4 isn't compatible with legacy node versions
           command: |
-            npm test --ci --maxWorkers=3 --selectProjects Node
+            npm test --ci --maxWorkers=2 --selectProjects Node
 
   non-app-examples:
     docker: *docker
@@ -207,7 +208,7 @@ workflows:
       - node_matrix:
           matrix:
             parameters:
-              node-version: ["14.21", "16.19", "18.18"]
+              node-version: ["14.21", "16.19", "18.18", "20.12.2"]
           requires:
             - setup
       - lint:

packages/core/src/state/RIC.ts

@@ -1,5 +1,5 @@
 const RIC: (cb: (...args: any[]) => void, options: any) => void = (
   typeof requestIdleCallback === 'function' ? requestIdleCallback : (
-    (cb: any) => setTimeout(cb, 0)
+    (cb: any) => cb()
   )) as any;
 export default RIC;

packages/react/src/__tests__/integration.node.tsx

@@ -1,102 +1,66 @@
 import { CacheProvider as ExternalCacheProvider } from '@data-client/redux';
 import { act } from '@testing-library/react-hooks';
-import { CoolerArticleResource, CoolerArticleDetail } from '__tests__/new';
-import nock from 'nock';
+import { CoolerArticleDetail } from '__tests__/new';
 
 // relative imports to avoid circular dependency in tsconfig references
 import { makeRenderDataClient } from '../../../test';
 import { useCache, useSuspense } from '../hooks';
 import { useController } from '../hooks';
-import {
-  payload,
-  createPayload,
-  users,
-  nested,
-  paginatedFirstPage,
-  paginatedSecondPage,
-  valuesFixture,
-  editorPayload,
-} from '../test-fixtures';
+import { payload } from '../test-fixtures';
 
 describe('SSR', () => {
   let renderDataClient: ReturnType<typeof makeRenderDataClient>;
-  let mynock: nock.Scope;
-
-  beforeEach(() => {
-    nock(/.*/)
-      .persist()
-      .defaultReplyHeaders({
-        'Access-Control-Allow-Origin': '*',
-        'Content-Type': 'application/json',
-      })
-      .options(/.*/)
-      .reply(200)
-      .get(`/article-cooler/${payload.id}`)
-      .reply(200, payload)
-      .delete(`/article-cooler/${payload.id}`)
-      .reply(204, '')
-      .delete(`/article/${payload.id}`)
-      .reply(200, {})
-      .delete(`/user/23`)
-      .reply(204, '')
-      .get(`/article-cooler/0`)
-      .reply(403, {})
-      .get(`/article-cooler/500`)
-      .reply(500, { message: 'server failure' })
-      .get(`/article-cooler/666`)
-      .reply(200, '')
-      .get(`/article-cooler`)
-      .reply(200, nested)
-      .get(`/article-cooler/values`)
-      .reply(200, valuesFixture)
-      .post(`/article-cooler`)
-      .reply(200, createPayload)
-      .get(`/user`)
-      .reply(200, users)
-      .get(`/article-cooler/withEditor`)
-      .reply(200, editorPayload);
-
-    mynock = nock(/.*/).defaultReplyHeaders({
-      'Access-Control-Allow-Origin': '*',
-      'Content-Type': 'application/json',
-    });
-  });
-
-  afterEach(() => {
-    nock.cleanAll();
-  });
 
   beforeEach(() => {
     renderDataClient = makeRenderDataClient(ExternalCacheProvider);
   });
 
   it('should update useCache()', async () => {
-    const { result, waitForNextUpdate } = renderDataClient(() => {
-      return [
-        useCache(CoolerArticleDetail, { id: payload.id }),
-        useController(),
-      ] as const;
-    });
+    const { result } = renderDataClient(
+      () => {
+        return [
+          useCache(CoolerArticleDetail, { id: payload.id }),
+          useController(),
+        ] as const;
+      },
+      {
+        resolverFixtures: [
+          {
+            endpoint: CoolerArticleDetail,
+            args: [{ id: payload.id }],
+            response: payload,
+          },
+        ],
+      },
+    );
     expect(result.current[0]).toBeUndefined();
-    /* TODO: need react-18 compatible test engine
-    await act(() => {
-      result.current[1].fetch(CoolerArticleDetail, { id: payload.id });
+    await act(async () => {
+      await result.current[1].fetch(CoolerArticleDetail, { id: payload.id });
     });
     expect(result.current[0]?.title).toBe(payload.title);
     // @ts-expect-error
     expect(result.current[0]?.lafsjlfd).toBeUndefined();
-    */
   });
 
   it('should resolve useSuspense()', async () => {
-    const { result, waitForNextUpdate } = renderDataClient(() => {
-      return useSuspense(CoolerArticleDetail, payload);
-    });
+    const { result, waitForNextUpdate } = renderDataClient(
+      () => {
+        return useSuspense(CoolerArticleDetail, payload);
+      },
+      {
+        resolverFixtures: [
+          {
+            endpoint: CoolerArticleDetail,
+            args: [{ id: payload.id }],
+            response: payload,
+          },
+        ],
+      },
+    );
     expect(result.current).toBeUndefined();
-    /* TODO: need react-18 compatible test engine
     await waitForNextUpdate();
     expect(result.current.title).toBe(payload.title);
     // @ts-expect-error
-    expect(result.current.lafsjlfd).toBeUndefined();*/
+    expect(result.current.lafsjlfd).toBeUndefined();
   });
 });