React.unstable_Async

Alternative to using the static class property unstable_asyncUpdates.
Everything inside <Async /> has async updates by default.

src/isomorphic/ReactAsyncWrapper.js

@@ -0,0 +1,21 @@
+/**
+ * Copyright 2014-present, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ *
+ * @providesModule ReactAsyncWrapper
+ */
+
+const ReactBaseClasses = require('ReactBaseClasses');
+
+class ReactAsyncWrapper extends ReactBaseClasses.Component {
+  static unstable_asyncUpdates = true;
+  render() {
+    return this.props.children;
+  }
+}
+
+module.exports = ReactAsyncWrapper;

src/isomorphic/ReactEntry.js

@@ -15,6 +15,7 @@ var ReactBaseClasses = require('ReactBaseClasses');
 var ReactChildren = require('ReactChildren');
 var ReactElement = require('ReactElement');
 var ReactVersion = require('ReactVersion');
+var ReactAsyncWrapper = require('ReactAsyncWrapper');
 
 var onlyChild = require('onlyChild');
 
@@ -49,6 +50,8 @@ var React = {
 
   version: ReactVersion,
 
+  unstable_Async: ReactAsyncWrapper,
+
   __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: {
     ReactCurrentOwner: require('ReactCurrentOwner'),
   },

src/renderers/dom/fiber/__tests__/ReactDOMFiberAsync-test.js

@@ -4,6 +4,8 @@ var ReactFeatureFlags = require('ReactFeatureFlags');
 
 var ReactDOM;
 
+var Async = React.unstable_Async;
+
 describe('ReactDOMFiberAsync', () => {
   var container;
 
@@ -25,12 +27,6 @@ describe('ReactDOMFiberAsync', () => {
 
   if (ReactDOMFeatureFlags.useFiber) {
     it('renders synchronously when feature flag is disabled', () => {
-      class Async extends React.Component {
-        static unstable_asyncUpdates = true;
-        render() {
-          return this.props.children;
-        }
-      }
       ReactDOM.render(<Async><div>Hi</div></Async>, container);
       expect(container.textContent).toEqual('Hi');
 
@@ -48,12 +44,6 @@ describe('ReactDOMFiberAsync', () => {
       });
 
       it('unstable_asyncUpdates at the root makes the entire tree async', () => {
-        class Async extends React.Component {
-          static unstable_asyncUpdates = true;
-          render() {
-            return this.props.children;
-          }
-        }
         ReactDOM.render(<Async><div>Hi</div></Async>, container);
         expect(container.textContent).toEqual('');
         jest.runAllTimers();
@@ -66,13 +56,6 @@ describe('ReactDOMFiberAsync', () => {
       });
 
       it('updates inside an async tree are async by default', () => {
-        class Async extends React.Component {
-          static unstable_asyncUpdates = true;
-          render() {
-            return this.props.children;
-          }
-        }
-
         let instance;
         class Component extends React.Component {
           state = {step: 0};