[Flight] Add getCacheForType() to the dispatcher

fixtures/flight/server/cli.server.js

@@ -17,13 +17,28 @@ const app = express();
 // Application
 app.get('/', function(req, res) {
   if (process.env.NODE_ENV === 'development') {
-    for (var key in require.cache) {
-      delete require.cache[key];
-    }
+    // This doesn't work in ESM mode.
+    // for (var key in require.cache) {
+    //   delete require.cache[key];
+    // }
   }
   require('./handler.server.js')(req, res);
 });
 
+app.get('/todos', function(req, res) {
+  res.setHeader('Access-Control-Allow-Origin', '*');
+  res.json([
+    {
+      id: 1,
+      text: 'Shave yaks',
+    },
+    {
+      id: 2,
+      text: 'Eat kale',
+    },
+  ]);
+});
+
 app.listen(3001, () => {
   console.log('Flight Server listening on port 3001...');
 });

fixtures/flight/src/App.server.js

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import {fetch} from 'react-fetch';
 
 import Container from './Container.js';
 
@@ -8,11 +9,17 @@ import {Counter as Counter2} from './Counter2.client.js';
 import ShowMore from './ShowMore.client.js';
 
 export default function App() {
+  const todos = fetch('http://localhost:3001/todos').json();
   return (
     <Container>
       <h1>Hello, world</h1>
       <Counter />
       <Counter2 />
+      <ul>
+        {todos.map(todo => (
+          <li key={todo.id}>{todo.text}</li>
+        ))}
+      </ul>
       <ShowMore>
         <p>Lorem ipsum</p>
       </ShowMore>

packages/react-debug-tools/src/ReactDebugHooks.js

@@ -23,6 +23,7 @@ import type {OpaqueIDType} from 'react-reconciler/src/ReactFiberHostConfig';
 import {NoMode} from 'react-reconciler/src/ReactTypeOfMode';
 
 import ErrorStackParser from 'error-stack-parser';
+import invariant from 'shared/invariant';
 import ReactSharedInternals from 'shared/ReactSharedInternals';
 import {REACT_OPAQUE_ID_TYPE} from 'shared/ReactSymbols';
 import {
@@ -100,6 +101,10 @@ function nextHook(): null | Hook {
   return hook;
 }
 
+function getCacheForType<T>(resourceType: () => T): T {
+  invariant(false, 'Not implemented.');
+}
+
 function readContext<T>(
   context: ReactContext<T>,
   observedBits: void | number | boolean,
@@ -298,6 +303,7 @@ function useOpaqueIdentifier(): OpaqueIDType | void {
 }
 
 const Dispatcher: DispatcherType = {
+  getCacheForType,
   readContext,
   useCallback,
   useContext,

packages/react-dom/src/server/ReactPartialRendererHooks.js

@@ -20,6 +20,7 @@ import type PartialRenderer from './ReactPartialRenderer';
 import {validateContextBounds} from './ReactPartialRendererContext';
 
 import invariant from 'shared/invariant';
+import {enableCache} from 'shared/ReactFeatureFlags';
 import is from 'shared/objectIs';
 
 type BasicStateAction<S> = (S => S) | S;
@@ -214,6 +215,10 @@ export function resetHooksState(): void {
   workInProgressHook = null;
 }
 
+function getCacheForType<T>(resourceType: () => T): T {
+  invariant(false, 'Not implemented.');
+}
+
 function readContext<T>(
   context: ReactContext<T>,
   observedBits: void | number | boolean,
@@ -512,3 +517,7 @@ export const Dispatcher: DispatcherType = {
   // Subscriptions are not setup in a server environment.
   useMutableSource,
 };
+
+if (enableCache) {
+  Dispatcher.getCacheForType = getCacheForType;
+}

packages/react-fetch/src/ReactFetchBrowser.js

@@ -9,7 +9,7 @@
 
 import type {Wakeable} from 'shared/ReactTypes';
 
-import {readCache} from 'react/unstable-cache';
+import {unstable_getCacheForType} from 'react';
 
 const Pending = 0;
 const Resolved = 1;
@@ -34,16 +34,13 @@ type Result = PendingResult | ResolvedResult | RejectedResult;
 
 // TODO: this is a browser-only version. Add a separate Node entry point.
 const nativeFetch = window.fetch;
-const fetchKey = {};
-
-function readResultMap(): Map<string, Result> {
-  const resources = readCache().resources;
-  let map = resources.get(fetchKey);
-  if (map === undefined) {
-    map = new Map();
-    resources.set(fetchKey, map);
-  }
-  return map;
+
+function getResultMap(): Map<string, Result> {
+  return unstable_getCacheForType(createResultMap);
+}
+
+function createResultMap(): Map<string, Result> {
+  return new Map();
 }
 
 function toResult(thenable): Result {
@@ -120,7 +117,7 @@ Response.prototype = {
 };
 
 function preloadResult(url: string, options: mixed): Result {
-  const map = readResultMap();
+  const map = getResultMap();
   let entry = map.get(url);
   if (!entry) {
     if (options) {

packages/react-fetch/src/ReactFetchNode.js

@@ -11,8 +11,7 @@ import type {Wakeable} from 'shared/ReactTypes';
 
 import * as http from 'http';
 import * as https from 'https';
-
-import {readCache} from 'react/unstable-cache';
+import {unstable_getCacheForType} from 'react';
 
 type FetchResponse = {|
   // Properties
@@ -75,16 +74,12 @@ type RejectedResult = {|
 
 type Result<V> = PendingResult | ResolvedResult<V> | RejectedResult;
 
-const fetchKey = {};
+function getResultMap(): Map<string, Result<FetchResponse>> {
+  return unstable_getCacheForType(createResultMap);
+}
 
-function readResultMap(): Map<string, Result<FetchResponse>> {
-  const resources = readCache().resources;
-  let map = resources.get(fetchKey);
-  if (map === undefined) {
-    map = new Map();
-    resources.set(fetchKey, map);
-  }
-  return map;
+function createResultMap(): Map<string, Result<FetchResponse>> {
+  return new Map();
 }
 
 function readResult<T>(result: Result<T>): T {
@@ -166,7 +161,7 @@ Response.prototype = {
 };
 
 function preloadResult(url: string, options: mixed): Result<FetchResponse> {
-  const map = readResultMap();
+  const map = getResultMap();
   let entry = map.get(url);
   if (!entry) {
     if (options) {