Use cache in the fixture

facebook · Nov 20, 2020 · 9a29464 · 9a29464
1 parent 89d4fe1
commit 9a29464
Show file tree

Hide file tree

Showing 13 changed files with 167 additions and 22 deletions.
diff --git a/fixtures/flight/package.json b/fixtures/flight/package.json
@@ -1,6 +1,5 @@
 {
  "name": "flight",
- "type": "module",
  "version": "0.1.0",
  "private": true,
  "dependencies": {

diff --git a/fixtures/flight/server/handler.server.js b/fixtures/flight/server/handler.server.js
@@ -2,6 +2,7 @@
 
 import {pipeToNodeWritable} from 'react-transport-dom-webpack/server';
 import * as React from 'react';
+import {CacheContext, createCache} from 'react/unstable-cache.js';
 
 import url from 'url';
 
@@ -10,10 +11,13 @@ function resolve(path) {
 }
 
 module.exports = async function(req, res) {
+ CacheContext._currentValue = createCache();
+
  res.setHeader('Access-Control-Allow-Origin', '*');
- const m = await import('../src/App.server.js');
- // const m = require('../src/App.server.js');
+ // const m = await import('../src/App.server.js');
+ const m = require('../src/App.server.js');
  const App = m.default.default || m.default;
+
  pipeToNodeWritable(<App />, res, {
  // TODO: Read from a map on the disk.
  [resolve('../src/Counter.client.js')]: {

diff --git a/fixtures/flight/server/index.js b/fixtures/flight/server/index.js
@@ -24,6 +24,20 @@ app.get('/', function(req, res) {
  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...');
 });

diff --git a/fixtures/flight/src/App.server.js b/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';
 
@@ -7,10 +8,16 @@ import Counter from './Counter.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 />
+ <ul>
+ {todos.map(todo => (
+ <li key={todo.id}>{todo.text}</li>
+ ))}
+ </ul>
  <ShowMore>
  <p>Lorem ipsum</p>
  </ShowMore>

diff --git a/fixtures/flight/src/index.js b/fixtures/flight/src/index.js
@@ -2,6 +2,7 @@ import * as React from 'react';
 import {Suspense} from 'react';
 import ReactDOM from 'react-dom';
 import ReactTransportDOMClient from 'react-transport-dom-webpack';
+import {CacheContext, createCache} from 'react/unstable-cache';
 
 let data = ReactTransportDOMClient.createFromFetch(
  fetch('http://localhost:3001')
@@ -11,10 +12,14 @@ function Content() {
  return data.readRoot();
 }
 
+let cache = createCache();
+
 ReactDOM.render(
- <Suspense fallback={<h1>Loading...</h1>}>
- <Content />
- </Suspense>,
+ <CacheContext.Provider value={cache}>
+ <Suspense fallback={<h1>Loading...</h1>}>
+ <Content />
+ </Suspense>
+ </CacheContext.Provider>,
  document.getElementById('root')
 );
 

diff --git a/packages/react-debug-tools/src/ReactDebugHooks.js b/packages/react-debug-tools/src/ReactDebugHooks.js
@@ -298,6 +298,7 @@ function useOpaqueIdentifier(): OpaqueIDType | void {
 }
 
 const Dispatcher: DispatcherType = {
+ readCache: readContext, // TODO
  readContext,
  useCallback,
  useContext,

diff --git a/packages/react-dom/src/server/ReactPartialRendererHooks.js b/packages/react-dom/src/server/ReactPartialRendererHooks.js
@@ -492,6 +492,7 @@ export function setCurrentPartialRenderer(renderer: PartialRenderer) {
 }
 
 export const Dispatcher: DispatcherType = {
+ readCache: readContext, // TODO
  readContext,
  useContext,
  useMemo,

diff --git a/packages/react-reconciler/src/ReactFiberHooks.new.js b/packages/react-reconciler/src/ReactFiberHooks.new.js
@@ -1816,6 +1816,7 @@ function dispatchAction<S, A>(
 }
 
 export const ContextOnlyDispatcher: Dispatcher = {
+ readCache: readContext, // TODO
  readContext,
 
  useCallback: throwInvalidHookError,
@@ -1837,6 +1838,7 @@ export const ContextOnlyDispatcher: Dispatcher = {
 };
 
 const HooksDispatcherOnMount: Dispatcher = {
+ readCache: readContext, // TODO
  readContext,
 
  useCallback: mountCallback,
@@ -1858,6 +1860,7 @@ const HooksDispatcherOnMount: Dispatcher = {
 };
 
 const HooksDispatcherOnUpdate: Dispatcher = {
+ readCache: readContext, // TODO
  readContext,
 
  useCallback: updateCallback,
@@ -1879,6 +1882,7 @@ const HooksDispatcherOnUpdate: Dispatcher = {
 };
 
 const HooksDispatcherOnRerender: Dispatcher = {
+ readCache: readContext, // TODO
  readContext,
 
  useCallback: updateCallback,
@@ -1927,6 +1931,14 @@ if (__DEV__) {
  };
 
  HooksDispatcherOnMountInDEV = {
+ // TODO: remove the arguments and change the implementation.
+ readCache<T>(
+ context: ReactContext<T>,
+ observedBits: void | number | boolean,
+ ): T {
+ warnInvalidContextAccess();
+ return readContext(context, observedBits);
+ },
  readContext<T>(
  context: ReactContext<T>,
  observedBits: void | number | boolean,
@@ -2054,6 +2066,14 @@ if (__DEV__) {
  };
 
  HooksDispatcherOnMountWithHookTypesInDEV = {
+ // TODO: remove the arguments and change the implementation.
+ readCache<T>(
+ context: ReactContext<T>,
+ observedBits: void | number | boolean,
+ ): T {
+ warnInvalidContextAccess();
+ return readContext(context, observedBits);
+ },
  readContext<T>(
  context: ReactContext<T>,
  observedBits: void | number | boolean,
@@ -2176,6 +2196,14 @@ if (__DEV__) {
  };
 
  HooksDispatcherOnUpdateInDEV = {
+ // TODO: remove the arguments and change the implementation.
+ readCache<T>(
+ context: ReactContext<T>,
+ observedBits: void | number | boolean,
+ ): T {
+ warnInvalidContextAccess();
+ return readContext(context, observedBits);
+ },
  readContext<T>(
  context: ReactContext<T>,
  observedBits: void | number | boolean,
@@ -2298,6 +2326,14 @@ if (__DEV__) {
  };
 
  HooksDispatcherOnRerenderInDEV = {
+ // TODO: remove the arguments and change the implementation.
+ readCache<T>(
+ context: ReactContext<T>,
+ observedBits: void | number | boolean,
+ ): T {
+ warnInvalidContextAccess();
+ return readContext(context, observedBits);
+ },
  readContext<T>(
  context: ReactContext<T>,
  observedBits: void | number | boolean,
@@ -2421,6 +2457,13 @@ if (__DEV__) {
  };
 
  InvalidNestedHooksDispatcherOnMountInDEV = {
+ readCache<T>(
+ // TODO: remove this argument.
+ context: ReactContext<T>,
+ observedBits: void | number | boolean,
+ ): T {
+ return readContext(context, observedBits);
+ },
  readContext<T>(
  context: ReactContext<T>,
  observedBits: void | number | boolean,
@@ -2558,6 +2601,14 @@ if (__DEV__) {
  };
 
  InvalidNestedHooksDispatcherOnUpdateInDEV = {
+ // TODO: remove the arguments and change the implementation.
+ readCache<T>(
+ context: ReactContext<T>,
+ observedBits: void | number | boolean,
+ ): T {
+ warnInvalidContextAccess();
+ return readContext(context, observedBits);
+ },
  readContext<T>(
  context: ReactContext<T>,
  observedBits: void | number | boolean,
@@ -2695,6 +2746,14 @@ if (__DEV__) {
  };
 
  InvalidNestedHooksDispatcherOnRerenderInDEV = {
+ // TODO: remove the arguments and change the implementation.
+ readCache<T>(
+ context: ReactContext<T>,
+ observedBits: void | number | boolean,
+ ): T {
+ warnInvalidContextAccess();
+ return readContext(context, observedBits);
+ },
  readContext<T>(
  context: ReactContext<T>,
  observedBits: void | number | boolean,

diff --git a/packages/react-reconciler/src/ReactFiberHooks.old.js b/packages/react-reconciler/src/ReactFiberHooks.old.js
@@ -1816,6 +1816,7 @@ function dispatchAction<S, A>(
 }
 
 export const ContextOnlyDispatcher: Dispatcher = {
+ readCache: readContext, // TODO
  readContext,
 
  useCallback: throwInvalidHookError,
@@ -1837,6 +1838,7 @@ export const ContextOnlyDispatcher: Dispatcher = {
 };
 
 const HooksDispatcherOnMount: Dispatcher = {
+ readCache: readContext, // TODO
  readContext,
 
  useCallback: mountCallback,
@@ -1858,6 +1860,7 @@ const HooksDispatcherOnMount: Dispatcher = {
 };
 
 const HooksDispatcherOnUpdate: Dispatcher = {
+ readCache: readContext, // TODO
  readContext,
 
  useCallback: updateCallback,
@@ -1879,6 +1882,7 @@ const HooksDispatcherOnUpdate: Dispatcher = {
 };
 
 const HooksDispatcherOnRerender: Dispatcher = {
+ readCache: readContext, // TODO
  readContext,
 
  useCallback: updateCallback,
@@ -1927,6 +1931,13 @@ if (__DEV__) {
  };
 
  HooksDispatcherOnMountInDEV = {
+ // TODO: remove the arguments and change the implementation.
+ readCache<T>(
+ context: ReactContext<T>,
+ observedBits: void | number | boolean,
+ ): T {
+ return readContext(context, observedBits);
+ },
  readContext<T>(
  context: ReactContext<T>,
  observedBits: void | number | boolean,
@@ -2054,6 +2065,13 @@ if (__DEV__) {
  };
 
  HooksDispatcherOnMountWithHookTypesInDEV = {
+ // TODO: remove the arguments and change the implementation.
+ readCache<T>(
+ context: ReactContext<T>,
+ observedBits: void | number | boolean,
+ ): T {
+ return readContext(context, observedBits);
+ },
  readContext<T>(
  context: ReactContext<T>,
  observedBits: void | number | boolean,
@@ -2176,6 +2194,13 @@ if (__DEV__) {
  };
 
  HooksDispatcherOnUpdateInDEV = {
+ // TODO: remove the arguments and change the implementation.
+ readCache<T>(
+ context: ReactContext<T>,
+ observedBits: void | number | boolean,
+ ): T {
+ return readContext(context, observedBits);
+ },
  readContext<T>(
  context: ReactContext<T>,
  observedBits: void | number | boolean,
@@ -2298,6 +2323,13 @@ if (__DEV__) {
  };
 
  HooksDispatcherOnRerenderInDEV = {
+ // TODO: remove the arguments and change the implementation.
+ readCache<T>(
+ context: ReactContext<T>,
+ observedBits: void | number | boolean,
+ ): T {
+ return readContext(context, observedBits);
+ },
  readContext<T>(
  context: ReactContext<T>,
  observedBits: void | number | boolean,
@@ -2421,6 +2453,13 @@ if (__DEV__) {
  };
 
  InvalidNestedHooksDispatcherOnMountInDEV = {
+ // TODO: remove the arguments and change the implementation.
+ readCache<T>(
+ context: ReactContext<T>,
+ observedBits: void | number | boolean,
+ ): T {
+ return readContext(context, observedBits);
+ },
  readContext<T>(
  context: ReactContext<T>,
  observedBits: void | number | boolean,
@@ -2558,6 +2597,13 @@ if (__DEV__) {
  };
 
  InvalidNestedHooksDispatcherOnUpdateInDEV = {
+ // TODO: remove the arguments and change the implementation.
+ readCache<T>(
+ context: ReactContext<T>,
+ observedBits: void | number | boolean,
+ ): T {
+ return readContext(context, observedBits);
+ },
  readContext<T>(
  context: ReactContext<T>,
  observedBits: void | number | boolean,
@@ -2695,6 +2741,13 @@ if (__DEV__) {
  };
 
  InvalidNestedHooksDispatcherOnRerenderInDEV = {
+ // TODO: remove the arguments and change the implementation.
+ readCache<T>(
+ context: ReactContext<T>,
+ observedBits: void | number | boolean,
+ ): T {
+ return readContext(context, observedBits);
+ },
  readContext<T>(
  context: ReactContext<T>,
  observedBits: void | number | boolean,

diff --git a/packages/react-reconciler/src/ReactInternalTypes.js b/packages/react-reconciler/src/ReactInternalTypes.js
@@ -274,6 +274,11 @@ type BasicStateAction<S> = (S => S) | S;
 type Dispatch<A> = A => void;
 
 export type Dispatcher = {|
+ readCache<T>(
+ // TODO: remove these arguments.
+ context: ReactContext<T>,
+ observedBits: void | number | boolean,
+ ): T,
  readContext<T>(
  context: ReactContext<T>,
  observedBits: void | number | boolean,