Remove unstable_ prefix from Suspense (#13922)

We are using it with lazy and the combination Suspense + lazy seems pretty stable. maxDuration is not but that's only enabled when you're in ConcurrentMode which is still unstable.
facebook · Oct 23, 2018 · d75c69e · d75c69e
1 parent c8ef2fe
commit d75c69e
Show file tree

Hide file tree

Showing 16 changed files with 42 additions and 45 deletions.
diff --git a/fixtures/dom/src/components/fixtures/suspense/index.js b/fixtures/dom/src/components/fixtures/suspense/index.js
@@ -5,7 +5,7 @@ import TestCase from '../../TestCase';
 const React = window.React;
 const ReactDOM = window.ReactDOM;
 
-const Suspense = React.unstable_Suspense;
+const Suspense = React.Suspense;
 
 let cache = new Set();
 

diff --git a/fixtures/unstable-async/suspense/src/components/App.js b/fixtures/unstable-async/suspense/src/components/App.js
@@ -1,4 +1,4 @@
-import React, {lazy, unstable_Suspense as Suspense, PureComponent} from 'react';
+import React, {lazy, Suspense, PureComponent} from 'react';
 import {unstable_scheduleCallback} from 'scheduler';
 import {
   unstable_trace as trace,

diff --git a/fixtures/unstable-async/suspense/src/components/UserPage.js b/fixtures/unstable-async/suspense/src/components/UserPage.js
@@ -1,4 +1,4 @@
-import React, {unstable_Suspense as Suspense} from 'react';
+import React, {Suspense} from 'react';
 import {createResource} from 'react-cache';
 import Spinner from './Spinner';
 import {cache} from '../cache';

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerSuspense-test.internal.js b/packages/react-dom/src/__tests__/ReactDOMServerSuspense-test.internal.js
@@ -48,9 +48,9 @@ describe('ReactDOMServerSuspense', () => {
       throw new Promise(() => {});
     };
     const e = await serverRender(
-      <React.unstable_Suspense fallback={<div />}>
+      <React.Suspense fallback={<div />}>
         <Suspended />
-      </React.unstable_Suspense>,
+      </React.Suspense>,
     );
 
     expect(e.tagName).toBe('DIV');

diff --git a/packages/react-dom/src/__tests__/ReactDOMSuspensePlaceholder-test.internal.js b/packages/react-dom/src/__tests__/ReactDOMSuspensePlaceholder-test.internal.js
@@ -23,11 +23,10 @@ describe('ReactDOMSuspensePlaceholder', () => {
   beforeEach(() => {
     jest.resetModules();
     ReactFeatureFlags = require('shared/ReactFeatureFlags');
-    ReactFeatureFlags.enableSuspense = true;
     React = require('react');
     ReactDOM = require('react-dom');
     ReactCache = require('react-cache');
-    Suspense = React.unstable_Suspense;
+    Suspense = React.Suspense;
     container = document.createElement('div');
 
     function invalidateCache() {

diff --git a/packages/react-dom/src/__tests__/ReactServerRendering-test.js b/packages/react-dom/src/__tests__/ReactServerRendering-test.js
@@ -610,7 +610,7 @@ describe('ReactDOMServer', () => {
 
   it('throws for unsupported types on the server', () => {
     expect(() => {
-      ReactDOMServer.renderToString(<React.unstable_Suspense />);
+      ReactDOMServer.renderToString(<React.Suspense />);
     }).toThrow('ReactDOMServer does not yet support Suspense.');
 
     async function fakeImport(result) {

diff --git a/packages/react-dom/src/__tests__/ReactServerRenderingHydration-test.js b/packages/react-dom/src/__tests__/ReactServerRenderingHydration-test.js
@@ -470,9 +470,9 @@ describe('ReactDOMServerHydration', () => {
           <div>
             Hello{' '}
             {this.state.isClient && (
-              <React.unstable_Suspense fallback="loading">
+              <React.Suspense fallback="loading">
                 <Lazy />
-              </React.unstable_Suspense>
+              </React.Suspense>
             )}
           </div>
         );

diff --git a/packages/react-reconciler/src/__tests__/ReactIncrementalPerf-test.internal.js b/packages/react-reconciler/src/__tests__/ReactIncrementalPerf-test.internal.js
@@ -587,9 +587,9 @@ describe('ReactDebugFiberPerf', () => {
 
     ReactNoop.render(
       <Parent>
-        <React.unstable_Suspense fallback={<Spinner />}>
+        <React.Suspense fallback={<Spinner />}>
           <LazyFoo />
-        </React.unstable_Suspense>
+        </React.Suspense>
       </Parent>,
     );
     ReactNoop.flush();
@@ -605,9 +605,9 @@ describe('ReactDebugFiberPerf', () => {
 
     ReactNoop.render(
       <Parent>
-        <React.unstable_Suspense>
+        <React.Suspense>
           <LazyFoo />
-        </React.unstable_Suspense>
+        </React.Suspense>
       </Parent>,
     );
     ReactNoop.flush();

diff --git a/packages/react-reconciler/src/__tests__/ReactLazy-test.internal.js b/packages/react-reconciler/src/__tests__/ReactLazy-test.internal.js
@@ -11,7 +11,7 @@ describe('ReactLazy', () => {
     ReactFeatureFlags.debugRenderPhaseSideEffectsForStrictMode = false;
     ReactFeatureFlags.replayFailedUnitOfWorkWithInvokeGuardedCallback = false;
     React = require('react');
-    Suspense = React.unstable_Suspense;
+    Suspense = React.Suspense;
     lazy = React.lazy;
     ReactTestRenderer = require('react-test-renderer');
   });

diff --git a/packages/react-reconciler/src/__tests__/ReactMemo-test.internal.js b/packages/react-reconciler/src/__tests__/ReactMemo-test.internal.js
@@ -56,7 +56,7 @@ describe('memo', () => {
   function sharedTests(label, memo) {
     describe(`${label}`, () => {
       it('bails out on props equality', async () => {
-        const {unstable_Suspense: Suspense} = React;
+        const {Suspense} = React;
 
         function Counter({count}) {
           return <Text text={count} />;
@@ -93,7 +93,7 @@ describe('memo', () => {
       });
 
       it("does not bail out if there's a context change", async () => {
-        const {unstable_Suspense: Suspense} = React;
+        const {Suspense} = React;
 
         const CountContext = React.createContext(0);
 
@@ -142,7 +142,7 @@ describe('memo', () => {
       });
 
       it('accepts custom comparison function', async () => {
-        const {unstable_Suspense: Suspense} = React;
+        const {Suspense} = React;
 
         function Counter({count}) {
           return <Text text={count} />;
@@ -184,7 +184,7 @@ describe('memo', () => {
       });
 
       it('supports non-pure class components', async () => {
-        const {unstable_Suspense: Suspense} = React;
+        const {Suspense} = React;
 
         class CounterInner extends React.Component {
           static defaultProps = {suffix: '!'};

diff --git a/packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js b/packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js
@@ -23,7 +23,7 @@ describe('ReactSuspense', () => {
     // JestReact = require('jest-react');
     ReactCache = require('react-cache');
 
-    Suspense = React.unstable_Suspense;
+    Suspense = React.Suspense;
 
     function invalidateCache() {
       cache = ReactCache.createCache(invalidateCache);

diff --git a/packages/react-reconciler/src/__tests__/ReactSuspensePlaceholder-test.internal.js b/packages/react-reconciler/src/__tests__/ReactSuspensePlaceholder-test.internal.js
@@ -37,7 +37,7 @@ function runPlaceholderTests(suiteLabel, loadReactNoop) {
       // JestReact = require('jest-react');
       ReactCache = require('react-cache');
 
-      Suspense = React.unstable_Suspense;
+      Suspense = React.Suspense;
 
       function invalidateCache() {
         cache = ReactCache.createCache(invalidateCache);

diff --git a/packages/react-reconciler/src/__tests__/ReactSuspenseWithNoopRenderer-test.internal.js b/packages/react-reconciler/src/__tests__/ReactSuspenseWithNoopRenderer-test.internal.js
@@ -24,7 +24,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
     Fragment = React.Fragment;
     ReactNoop = require('react-noop-renderer');
     ReactCache = require('react-cache');
-    Suspense = React.unstable_Suspense;
+    Suspense = React.Suspense;
     StrictMode = React.StrictMode;
     ConcurrentMode = React.unstable_ConcurrentMode;
 

diff --git a/packages/react/src/React.js b/packages/react/src/React.js
@@ -55,7 +55,7 @@ const React = {
   Fragment: REACT_FRAGMENT_TYPE,
   StrictMode: REACT_STRICT_MODE_TYPE,
   unstable_ConcurrentMode: REACT_CONCURRENT_MODE_TYPE,
-  unstable_Suspense: REACT_SUSPENSE_TYPE,
+  Suspense: REACT_SUSPENSE_TYPE,
   unstable_Profiler: REACT_PROFILER_TYPE,
 
   createElement: __DEV__ ? createElementWithValidation : createElement,

diff --git a/packages/react/src/__tests__/ReactProfiler-test.internal.js b/packages/react/src/__tests__/ReactProfiler-test.internal.js
@@ -2228,9 +2228,9 @@ describe('Profiler', () => {
         SchedulerTracing.unstable_trace(interaction.name, mockNow(), () => {
           ReactNoop.render(
             <React.unstable_Profiler id="test-profiler" onRender={onRender}>
-              <React.unstable_Suspense fallback={<Text text="Loading..." />}>
+              <React.Suspense fallback={<Text text="Loading..." />}>
                 <AsyncText text="Async" ms={20000} />
-              </React.unstable_Suspense>
+              </React.Suspense>
               <Text text="Sync" />
               <Monkey ref={monkey} />
             </React.unstable_Profiler>,
@@ -2316,11 +2316,11 @@ describe('Profiler', () => {
           () => {
             ReactTestRenderer.create(
               <React.unstable_Profiler id="app" onRender={onRender}>
-                <React.unstable_Suspense
+                <React.Suspense
                   maxDuration={1000}
                   fallback={<Text text="loading" />}>
                   <AsyncText text="loaded" ms={2000} />
-                </React.unstable_Suspense>
+                </React.Suspense>
               </React.unstable_Profiler>,
             );
           },
@@ -2370,11 +2370,11 @@ describe('Profiler', () => {
           () => {
             ReactTestRenderer.create(
               <React.unstable_Profiler id="app" onRender={onRender}>
-                <React.unstable_Suspense
+                <React.Suspense
                   maxDuration={1000}
                   fallback={<Text text="loading" />}>
                   <AsyncComponentWithCascadingWork text="loaded" ms={2000} />
-                </React.unstable_Suspense>
+                </React.Suspense>
               </React.unstable_Profiler>,
             );
           },
@@ -2410,11 +2410,11 @@ describe('Profiler', () => {
           () => {
             renderer = ReactTestRenderer.create(
               <React.unstable_Profiler id="app" onRender={onRender}>
-                <React.unstable_Suspense
+                <React.Suspense
                   maxDuration={1000}
                   fallback={<Text text="loading" />}>
                   <AsyncText text="loaded" ms={2000} />
-                </React.unstable_Suspense>
+                </React.Suspense>
               </React.unstable_Profiler>,
               {
                 unstable_isConcurrent: true,
@@ -2458,11 +2458,11 @@ describe('Profiler', () => {
           () => {
             renderer = ReactTestRenderer.create(
               <React.unstable_Profiler id="app" onRender={onRender}>
-                <React.unstable_Suspense
+                <React.Suspense
                   maxDuration={2000}
                   fallback={<Text text="loading" />}>
                   <AsyncText text="loaded" ms={1000} />
-                </React.unstable_Suspense>
+                </React.Suspense>
               </React.unstable_Profiler>,
               {unstable_isConcurrent: true},
             );
@@ -2497,11 +2497,11 @@ describe('Profiler', () => {
           () => {
             renderer = ReactTestRenderer.create(
               <React.unstable_Profiler id="app" onRender={onRender}>
-                <React.unstable_Suspense
+                <React.Suspense
                   maxDuration={2000}
                   fallback={<Text text="loading" />}>
                   <AsyncText text="loaded" ms={1000} />
-                </React.unstable_Suspense>
+                </React.Suspense>
                 <Text text="initial" />
               </React.unstable_Profiler>,
             );
@@ -2531,11 +2531,11 @@ describe('Profiler', () => {
             () => {
               renderer.update(
                 <React.unstable_Profiler id="app" onRender={onRender}>
-                  <React.unstable_Suspense
+                  <React.Suspense
                     maxDuration={2000}
                     fallback={<Text text="loading" />}>
                     <AsyncText text="loaded" ms={1000} />
-                  </React.unstable_Suspense>
+                  </React.Suspense>
                   <Text text="updated" />
                 </React.unstable_Profiler>,
               );
@@ -2593,11 +2593,11 @@ describe('Profiler', () => {
           () => {
             renderer = ReactTestRenderer.create(
               <React.unstable_Profiler id="app" onRender={onRender}>
-                <React.unstable_Suspense
+                <React.Suspense
                   maxDuration={2000}
                   fallback={<Text text="loading" />}>
                   <AsyncText text="loaded" ms={1000} />
-                </React.unstable_Suspense>
+                </React.Suspense>
                 <Text text="initial" />
               </React.unstable_Profiler>,
               {unstable_isConcurrent: true},
@@ -2631,11 +2631,11 @@ describe('Profiler', () => {
             () => {
               renderer.update(
                 <React.unstable_Profiler id="app" onRender={onRender}>
-                  <React.unstable_Suspense
+                  <React.Suspense
                     maxDuration={2000}
                     fallback={<Text text="loading" />}>
                     <AsyncText text="loaded" ms={1000} />
-                  </React.unstable_Suspense>
+                  </React.Suspense>
                   <Text text="updated" />
                 </React.unstable_Profiler>,
               );

diff --git a/packages/react/src/__tests__/ReactProfilerDOM-test.internal.js b/packages/react/src/__tests__/ReactProfilerDOM-test.internal.js
@@ -119,11 +119,9 @@ describe('ProfilerDOM', () => {
       const root = ReactDOM.unstable_createRoot(element);
       batch = root.createBatch();
       batch.render(
-        <React.unstable_Suspense
-          maxDuration={100}
-          fallback={<Text text="Loading..." />}>
+        <React.Suspense maxDuration={100} fallback={<Text text="Loading..." />}>
           <AsyncText text="Text" ms={200} />
-        </React.unstable_Suspense>,
+        </React.Suspense>,
       );
       batch.then(
         SchedulerTracing.unstable_wrap(() => {