Update cache() and use() to the canary aka next channel (#25502)

Testing what it would look like to move this to the `next` channel.

Author: sebmarkbage

ReactVersions.js

@@ -30,6 +30,7 @@ const stablePackages = {
   react: ReactVersion,
   'react-art': ReactVersion,
   'react-dom': ReactVersion,
+  'react-server-dom-webpack': ReactVersion,
   'react-is': ReactVersion,
   'react-reconciler': '0.30.0',
   'react-refresh': '0.15.0',
@@ -42,12 +43,7 @@ const stablePackages = {
 // These packages do not exist in the @next or @latest channel, only
 // @experimental. We don't use semver, just the commit sha, so this is just a
 // list of package names instead of a map.
-const experimentalPackages = [
-  'react-fetch',
-  'react-fs',
-  'react-pg',
-  'react-server-dom-webpack',
-];
+const experimentalPackages = ['react-fetch', 'react-fs', 'react-pg'];
 
 module.exports = {
   ReactVersion,

fixtures/fizz-ssr-browser/index.html

@@ -17,6 +17,7 @@ <h1>Fizz Example</h1>
       </p>
     </div>
     <script src="../../build/node_modules/react/umd/react.development.js"></script>
+    <script src="../../build/node_modules/react-dom/umd/react-dom.development.js"></script>
     <script src="../../build/node_modules/react-dom/umd/react-dom-server.browser.development.js"></script>
     <script src="https://unpkg.com/babel-standalone@6/babel.js"></script>
     <script type="text/babel">

fixtures/flight-browser/index.html

@@ -83,7 +83,7 @@ <h1>Flight Example</h1>
       }
 
       function Shell({ data }) {
-        let model = React.experimental_use(data);
+        let model = React.use(data);
         return <div>
           <Suspense fallback="...">
             <h1>{model.title}</h1>
@@ -94,11 +94,12 @@ <h1>{model.title}</h1>
 
       function renderResult(data) {
         let container = document.getElementById('container');
-        ReactDOM.render(
+        ReactDOM.createRoot(
+          container
+        ).render(
           <Suspense fallback="Loading...">
             <Shell data={data} />
           </Suspense>,
-          container
         );
       }
     </script>

fixtures/flight/src/index.js

@@ -6,7 +6,7 @@ import ReactServerDOMReader from 'react-server-dom-webpack/client';
 let data = ReactServerDOMReader.createFromFetch(fetch('http://localhost:3001'));
 
 function Content() {
-  return React.experimental_use(data);
+  return React.use(data);
 }
 
 ReactDOM.createRoot(document.getElementById('root')).render(

packages/react-client/src/__tests__/ReactFlight-test.js

@@ -27,7 +27,7 @@ describe('ReactFlight', () => {
 
     React = require('react');
     startTransition = React.startTransition;
-    use = React.experimental_use;
+    use = React.use;
     ReactNoop = require('react-noop-renderer');
     ReactNoopFlightServer = require('react-noop-renderer/flight-server');
     ReactNoopFlightClient = require('react-noop-renderer/flight-client');

packages/react-dom/index.classic.fb.js

@@ -33,6 +33,8 @@ export {
   unstable_isNewReconciler,
   unstable_renderSubtreeIntoContainer,
   unstable_runWithPriority, // DO NOT USE: Temporarily exposed to migrate off of Scheduler.runWithPriority.
+  preinit,
+  preload,
   version,
 } from './src/client/ReactDOM';
 

packages/react-dom/index.experimental.js

@@ -20,7 +20,7 @@ export {
   unstable_batchedUpdates,
   unstable_renderSubtreeIntoContainer,
   unstable_runWithPriority, // DO NOT USE: Temporarily exposed to migrate off of Scheduler.runWithPriority.
+  preinit,
+  preload,
   version,
 } from './src/client/ReactDOM';
-
-export {preinit, preload} from 'react-dom-bindings/src/shared/ReactDOMFloat';

packages/react-dom/index.js

@@ -25,5 +25,7 @@ export {
   unstable_isNewReconciler,
   unstable_renderSubtreeIntoContainer,
   unstable_runWithPriority, // DO NOT USE: Temporarily exposed to migrate off of Scheduler.runWithPriority.
+  preinit,
+  preload,
   version,
 } from './src/client/ReactDOM';

packages/react-dom/index.modern.fb.js

@@ -18,5 +18,7 @@ export {
   unstable_flushControlled,
   unstable_isNewReconciler,
   unstable_runWithPriority, // DO NOT USE: Temporarily exposed to migrate off of Scheduler.runWithPriority.
+  preinit,
+  preload,
   version,
 } from './src/client/ReactDOM';

packages/react-dom/index.stable.js

@@ -19,5 +19,7 @@ export {
   unmountComponentAtNode,
   unstable_batchedUpdates,
   unstable_renderSubtreeIntoContainer,
+  preinit,
+  preload,
   version,
 } from './src/client/ReactDOM';

packages/react-dom/server-rendering-stub.experimental.js

@@ -18,4 +18,6 @@ export {default as __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED} from './s
 export {
   createPortal,
   flushSync,
+  preload,
+  preinit,
 } from './src/server/ReactDOMServerRenderingStub';

packages/react-dom/server-rendering-stub.js

@@ -41,9 +41,9 @@ describe('ReactDOMFizzServer', () => {
     ReactDOMFizzServer = require('react-dom/server');
     Stream = require('stream');
     Suspense = React.Suspense;
+    use = React.use;
     if (gate(flags => flags.enableSuspenseList)) {
       SuspenseList = React.SuspenseList;
-      use = React.experimental_use;
     }
 
     PropTypes = require('prop-types');

packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js

@@ -1963,7 +1963,7 @@ describe('ReactDOMFloat', () => {
       );
     });
 
-    // @gate enableFloat
+    // @gate enableFloat && enableHostSingletons && (enableClientRenderFallbackOnTextMismatch || !__DEV__)
     it('can render a title before a singleton even if that singleton clears its contents', async () => {
       await actIntoEmptyDocument(() => {
         const {pipe} = ReactDOMFizzServer.renderToPipeableStream(
@@ -1975,7 +1975,6 @@ describe('ReactDOMFloat', () => {
                 <div>server</div>
               </body>
             </html>
-            ,
           </>,
         );
         pipe(writable);
@@ -2243,7 +2242,7 @@ describe('ReactDOMFloat', () => {
       );
     });
 
-    // @gate enableFloat && enableHostSingletons
+    // @gate enableFloat && enableHostSingletons && enableClientRenderFallbackOnTextMismatch
     it('retains styles even when a new html, head, and/body mount', async () => {
       await actIntoEmptyDocument(() => {
         const {pipe} = ReactDOMFizzServer.renderToPipeableStream(

packages/react-dom/src/__tests__/ReactDOMFloat-test.js

@@ -15,7 +15,6 @@ describe('ReactDOMInReactServer', () => {
     jest.mock('react', () => require('react/react.shared-subset'));
   });
 
-  // @gate experimental && !www
   it('can require react-dom', () => {
     // In RSC this will be aliased.
     require('react');

packages/react-dom/src/__tests__/ReactDOMInReactServer-test.js

@@ -153,7 +153,7 @@ function resolveMostRecentTextCache(text) {
 
 const resolveText = resolveMostRecentTextCache;
 
-// @gate enableCache
+// @gate enableLegacyCache
 // @gate enableSuspenseList
 test('regression (#20932): return pointer is correct before entering deleted tree', async () => {
   // Based on a production bug. Designed to trigger a very specific

packages/react-dom/src/__tests__/ReactWrongReturnPointer-test.js

@@ -76,6 +76,8 @@ import {
 } from 'react-dom-bindings/src/events/ReactDOMControlledComponent';
 import Internals from '../ReactDOMSharedInternals';
 
+export {preinit, preload} from 'react-dom-bindings/src/shared/ReactDOMFloat';
+
 setAttemptSynchronousHydration(attemptSynchronousHydration);
 setAttemptDiscreteHydration(attemptDiscreteHydration);
 setAttemptContinuousHydration(attemptContinuousHydration);

packages/react-dom/src/client/ReactDOM.js

@@ -7,6 +7,8 @@
  * @flow
  */
 
+export {preinit, preload} from 'react-dom-bindings/src/shared/ReactDOMFloat';
+
 export function createPortal() {
   throw new Error(
     'createPortal was called on the server. Portals are not currently' +

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

@@ -40,6 +40,7 @@ import {
   enableUseHook,
   enableUseMemoCacheHook,
   enableUseEventHook,
+  enableLegacyCache,
 } from 'shared/ReactFeatureFlags';
 import {
   REACT_CONTEXT_TYPE,
@@ -2357,9 +2358,17 @@ function refreshCache<T>(fiber: Fiber, seedKey: ?() => T, seedValue: T) {
         // unmount that boundary before the refresh completes.
         const seededCache = createCache();
         if (seedKey !== null && seedKey !== undefined && root !== null) {
-          // Seed the cache with the value passed by the caller. This could be
-          // from a server mutation, or it could be a streaming response.
-          seededCache.data.set(seedKey, seedValue);
+          if (enableLegacyCache) {
+            // Seed the cache with the value passed by the caller. This could be
+            // from a server mutation, or it could be a streaming response.
+            seededCache.data.set(seedKey, seedValue);
+          } else {
+            if (__DEV__) {
+              console.error(
+                'The seed argument is not enabled outside experimental channels.',
+              );
+            }
+          }
         }
 
         const payload = {

packages/react-reconciler/src/ReactFiberHooks.new.js

@@ -40,6 +40,7 @@ import {
   enableUseHook,
   enableUseMemoCacheHook,
   enableUseEventHook,
+  enableLegacyCache,
 } from 'shared/ReactFeatureFlags';
 import {
   REACT_CONTEXT_TYPE,
@@ -2357,9 +2358,17 @@ function refreshCache<T>(fiber: Fiber, seedKey: ?() => T, seedValue: T) {
         // unmount that boundary before the refresh completes.
         const seededCache = createCache();
         if (seedKey !== null && seedKey !== undefined && root !== null) {
-          // Seed the cache with the value passed by the caller. This could be
-          // from a server mutation, or it could be a streaming response.
-          seededCache.data.set(seedKey, seedValue);
+          if (enableLegacyCache) {
+            // Seed the cache with the value passed by the caller. This could be
+            // from a server mutation, or it could be a streaming response.
+            seededCache.data.set(seedKey, seedValue);
+          } else {
+            if (__DEV__) {
+              console.error(
+                'The seed argument is not enabled outside experimental channels.',
+              );
+            }
+          }
         }
 
         const payload = {

packages/react-reconciler/src/ReactFiberHooks.old.js

@@ -292,7 +292,7 @@ describe('act warnings', () => {
   });
 
   // @gate __DEV__
-  // @gate enableCache
+  // @gate enableLegacyCache
   test('warns if Suspense retry is not wrapped', () => {
     function App() {
       return (
@@ -322,7 +322,7 @@ describe('act warnings', () => {
   });
 
   // @gate __DEV__
-  // @gate enableCache
+  // @gate enableLegacyCache
   test('warns if Suspense ping is not wrapped', () => {
     function App({showMore}) {
       return (