diff --git a/fixtures/unstable-async/time-slicing/src/index.js b/fixtures/unstable-async/time-slicing/src/index.js
index 0b1436e04eceb..8b84d723acf4b 100644
--- a/fixtures/unstable-async/time-slicing/src/index.js
+++ b/fixtures/unstable-async/time-slicing/src/index.js
@@ -147,8 +147,8 @@ class App extends PureComponent {
const container = document.getElementById('root');
render(
-
+
- ,
+ ,
container
);
diff --git a/packages/react-dom/src/__tests__/ReactDOMFiberAsync-test.internal.js b/packages/react-dom/src/__tests__/ReactDOMFiberAsync-test.internal.js
index 5768aa5f5d45d..84cfb049f0a01 100644
--- a/packages/react-dom/src/__tests__/ReactDOMFiberAsync-test.internal.js
+++ b/packages/react-dom/src/__tests__/ReactDOMFiberAsync-test.internal.js
@@ -14,7 +14,7 @@ let ReactFeatureFlags = require('shared/ReactFeatureFlags');
let ReactDOM;
-const AsyncMode = React.unstable_AsyncMode;
+const ConcurrentMode = React.unstable_ConcurrentMode;
const setUntrackedInputValue = Object.getOwnPropertyDescriptor(
HTMLInputElement.prototype,
@@ -108,9 +108,9 @@ describe('ReactDOMFiberAsync', () => {
}
}
ReactDOM.render(
-
+
- ,
+ ,
container,
);
expect(asyncValueRef.current.textContent).toBe('');
@@ -137,17 +137,17 @@ describe('ReactDOMFiberAsync', () => {
it('renders synchronously', () => {
ReactDOM.render(
-
+
Hi
- ,
+ ,
container,
);
expect(container.textContent).toEqual('Hi');
ReactDOM.render(
-
+
Bye
- ,
+ ,
container,
);
expect(container.textContent).toEqual('Bye');
@@ -197,7 +197,7 @@ describe('ReactDOMFiberAsync', () => {
expect(container.textContent).toEqual('1');
});
- it('AsyncMode creates an async subtree', () => {
+ it('ConcurrentMode creates an async subtree', () => {
let instance;
class Component extends React.Component {
state = {step: 0};
@@ -208,9 +208,9 @@ describe('ReactDOMFiberAsync', () => {
}
ReactDOM.render(
-
+
- ,
+ ,
container,
);
jest.runAllTimers();
@@ -233,9 +233,9 @@ describe('ReactDOMFiberAsync', () => {
ReactDOM.render(
,
container,
);
@@ -364,9 +364,9 @@ describe('ReactDOMFiberAsync', () => {
}
ReactDOM.render(
-
+
- ,
+ ,
container,
);
jest.runAllTimers();
@@ -409,9 +409,9 @@ describe('ReactDOMFiberAsync', () => {
}
}
ReactDOM.render(
-
+
- ,
+ ,
container,
);
expect(container.textContent).toEqual('0');
diff --git a/packages/react-dom/src/__tests__/ReactDOMRoot-test.js b/packages/react-dom/src/__tests__/ReactDOMRoot-test.js
index 9f7801d2246cb..4157e64b46cad 100644
--- a/packages/react-dom/src/__tests__/ReactDOMRoot-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMRoot-test.js
@@ -12,7 +12,7 @@
let React = require('react');
let ReactDOM = require('react-dom');
let ReactDOMServer = require('react-dom/server');
-let AsyncMode = React.unstable_AsyncMode;
+let ConcurrentMode = React.unstable_ConcurrentMode;
describe('ReactDOMRoot', () => {
let container;
@@ -63,7 +63,7 @@ describe('ReactDOMRoot', () => {
React = require('react');
ReactDOM = require('react-dom');
ReactDOMServer = require('react-dom/server');
- AsyncMode = React.unstable_AsyncMode;
+ ConcurrentMode = React.unstable_ConcurrentMode;
});
it('renders children', () => {
@@ -85,7 +85,7 @@ describe('ReactDOMRoot', () => {
it('`root.render` returns a thenable work object', () => {
const root = ReactDOM.unstable_createRoot(container);
- const work = root.render(Hi);
+ const work = root.render(Hi);
let ops = [];
work.then(() => {
ops.push('inside callback: ' + container.textContent);
@@ -103,7 +103,7 @@ describe('ReactDOMRoot', () => {
it('resolves `work.then` callback synchronously if the work already committed', () => {
const root = ReactDOM.unstable_createRoot(container);
- const work = root.render(Hi);
+ const work = root.render(Hi);
jest.runAllTimers();
let ops = [];
work.then(() => {
@@ -196,9 +196,9 @@ describe('ReactDOMRoot', () => {
const root = ReactDOM.unstable_createRoot(container);
const batch = root.createBatch();
batch.render(
-
+
- ,
+ ,
);
jest.runAllTimers();
@@ -246,7 +246,7 @@ describe('ReactDOMRoot', () => {
it('can wait for a batch to finish', () => {
const root = ReactDOM.unstable_createRoot(container);
const batch = root.createBatch();
- batch.render(Foo);
+ batch.render(Foo);
jest.runAllTimers();
@@ -286,7 +286,7 @@ describe('ReactDOMRoot', () => {
it('can commit an empty batch', () => {
const root = ReactDOM.unstable_createRoot(container);
- root.render(1);
+ root.render(1);
advanceCurrentTime(2000);
// This batch has a later expiration time than the earlier update.
diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationModes-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationModes-test.js
index ce37aa61616fb..3a4abc6abb249 100644
--- a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationModes-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationModes-test.js
@@ -104,36 +104,36 @@ describe('ReactDOMServerIntegration', () => {
});
});
- describe('React.unstable_AsyncMode', () => {
- itRenders('an async mode with one child', async render => {
+ describe('React.unstable_ConcurrentMode', () => {
+ itRenders('an concurrent mode with one child', async render => {
let e = await render(
-
+
text1
- ,
+ ,
);
let parent = e.parentNode;
expect(parent.childNodes[0].tagName).toBe('DIV');
});
- itRenders('an async mode with several children', async render => {
+ itRenders('an concurrent mode with several children', async render => {
let Header = props => {
return header
;
};
let Footer = props => {
return (
-
+
footer
about
-
+
);
};
let e = await render(
-
+
text1
text2
- ,
+ ,
);
let parent = e.parentNode;
expect(parent.childNodes[0].tagName).toBe('DIV');
@@ -143,23 +143,23 @@ describe('ReactDOMServerIntegration', () => {
expect(parent.childNodes[4].tagName).toBe('H3');
});
- itRenders('a nested async mode', async render => {
+ itRenders('a nested concurrent mode', async render => {
let e = await render(
-
-
+
+
text1
-
+
text2
-
-
-
+
+
+
{null}
-
+
{false}
-
-
- ,
+
+
+ ,
);
let parent = e.parentNode;
expect(parent.childNodes[0].tagName).toBe('DIV');
@@ -167,8 +167,8 @@ describe('ReactDOMServerIntegration', () => {
expect(parent.childNodes[2].tagName).toBe('P');
});
- itRenders('an empty async mode', async render => {
- expect(await render()).toBe(null);
+ itRenders('an empty concurrent mode', async render => {
+ expect(await render()).toBe(null);
});
});
});
diff --git a/packages/react-dom/src/client/ReactDOM.js b/packages/react-dom/src/client/ReactDOM.js
index f51239ca684b3..f0cf8ea162795 100644
--- a/packages/react-dom/src/client/ReactDOM.js
+++ b/packages/react-dom/src/client/ReactDOM.js
@@ -330,8 +330,12 @@ ReactWork.prototype._onCommit = function(): void {
}
};
-function ReactRoot(container: Container, isAsync: boolean, hydrate: boolean) {
- const root = DOMRenderer.createContainer(container, isAsync, hydrate);
+function ReactRoot(
+ container: Container,
+ isConcurrent: boolean,
+ hydrate: boolean,
+) {
+ const root = DOMRenderer.createContainer(container, isConcurrent, hydrate);
this._internalRoot = root;
}
ReactRoot.prototype.render = function(
@@ -497,8 +501,8 @@ function legacyCreateRootFromDOMContainer(
}
}
// Legacy roots are not async by default.
- const isAsync = false;
- return new ReactRoot(container, isAsync, shouldHydrate);
+ const isConcurrent = false;
+ return new ReactRoot(container, isConcurrent, shouldHydrate);
}
function legacyRenderSubtreeIntoContainer(
diff --git a/packages/react-dom/src/events/__tests__/SimpleEventPlugin-test.internal.js b/packages/react-dom/src/events/__tests__/SimpleEventPlugin-test.internal.js
index ec74d34393682..3f11c7137145d 100644
--- a/packages/react-dom/src/events/__tests__/SimpleEventPlugin-test.internal.js
+++ b/packages/react-dom/src/events/__tests__/SimpleEventPlugin-test.internal.js
@@ -426,9 +426,9 @@ describe('SimpleEventPlugin', function() {
// Intentionally not using the updater form here
() => this.setState({highPriCount: this.state.highPriCount + 1})
}>
-
+
-
+
);
}
diff --git a/packages/react-dom/src/server/ReactPartialRenderer.js b/packages/react-dom/src/server/ReactPartialRenderer.js
index 8989eaa1369ce..0b1e720595337 100644
--- a/packages/react-dom/src/server/ReactPartialRenderer.js
+++ b/packages/react-dom/src/server/ReactPartialRenderer.js
@@ -32,7 +32,7 @@ import {
REACT_FORWARD_REF_TYPE,
REACT_FRAGMENT_TYPE,
REACT_STRICT_MODE_TYPE,
- REACT_ASYNC_MODE_TYPE,
+ REACT_CONCURRENT_MODE_TYPE,
REACT_PLACEHOLDER_TYPE,
REACT_PORTAL_TYPE,
REACT_PROFILER_TYPE,
@@ -896,7 +896,7 @@ class ReactDOMServerRenderer {
switch (elementType) {
case REACT_STRICT_MODE_TYPE:
- case REACT_ASYNC_MODE_TYPE:
+ case REACT_CONCURRENT_MODE_TYPE:
case REACT_PROFILER_TYPE:
case REACT_FRAGMENT_TYPE: {
const nextChildren = toArray(
diff --git a/packages/react-is/README.md b/packages/react-is/README.md
index 80c1490b2e45c..a089be7359aee 100644
--- a/packages/react-is/README.md
+++ b/packages/react-is/README.md
@@ -44,14 +44,14 @@ ReactIs.isValidElementType(React.createFactory("div")); // true
### Determining an Element's Type
-#### AsyncMode
+#### ConcurrentMode
```js
import React from "react";
import * as ReactIs from 'react-is';
-ReactIs.isAsyncMode(); // true
-ReactIs.typeOf() === ReactIs.AsyncMode; // true
+ReactIs.isConcurrentMode(); // true
+ReactIs.typeOf() === ReactIs.ConcurrentMode; // true
```
#### Context
diff --git a/packages/react-is/src/ReactIs.js b/packages/react-is/src/ReactIs.js
index ed5cfaa5355f6..97a4212d6c85e 100644
--- a/packages/react-is/src/ReactIs.js
+++ b/packages/react-is/src/ReactIs.js
@@ -10,7 +10,7 @@
'use strict';
import {
- REACT_ASYNC_MODE_TYPE,
+ REACT_CONCURRENT_MODE_TYPE,
REACT_CONTEXT_TYPE,
REACT_ELEMENT_TYPE,
REACT_FORWARD_REF_TYPE,
@@ -21,6 +21,7 @@ import {
REACT_STRICT_MODE_TYPE,
} from 'shared/ReactSymbols';
import isValidElementType from 'shared/isValidElementType';
+import lowPriorityWarning from 'shared/lowPriorityWarning';
export function typeOf(object: any) {
if (typeof object === 'object' && object !== null) {
@@ -31,7 +32,7 @@ export function typeOf(object: any) {
const type = object.type;
switch (type) {
- case REACT_ASYNC_MODE_TYPE:
+ case REACT_CONCURRENT_MODE_TYPE:
case REACT_FRAGMENT_TYPE:
case REACT_PROFILER_TYPE:
case REACT_STRICT_MODE_TYPE:
@@ -56,7 +57,9 @@ export function typeOf(object: any) {
return undefined;
}
-export const AsyncMode = REACT_ASYNC_MODE_TYPE;
+// AsyncMode alias is deprecated along with isAsyncMode
+export const AsyncMode = REACT_CONCURRENT_MODE_TYPE;
+export const ConcurrentMode = REACT_CONCURRENT_MODE_TYPE;
export const ContextConsumer = REACT_CONTEXT_TYPE;
export const ContextProvider = REACT_PROVIDER_TYPE;
export const Element = REACT_ELEMENT_TYPE;
@@ -68,8 +71,25 @@ export const StrictMode = REACT_STRICT_MODE_TYPE;
export {isValidElementType};
+let hasWarnedAboutDeprecatedIsAsyncMode = false;
+
+// AsyncMode should be deprecated
export function isAsyncMode(object: any) {
- return typeOf(object) === REACT_ASYNC_MODE_TYPE;
+ if (__DEV__) {
+ if (!hasWarnedAboutDeprecatedIsAsyncMode) {
+ hasWarnedAboutDeprecatedIsAsyncMode = true;
+ lowPriorityWarning(
+ false,
+ 'The ReactIs.isAsyncMode() alias has been deprecated, ' +
+ 'and will be removed in React 17+. Update your code to use ' +
+ 'ReactIs.isConcurrentMode() instead. It has the exact same API.',
+ );
+ }
+ }
+ return isConcurrentMode(object);
+}
+export function isConcurrentMode(object: any) {
+ return typeOf(object) === REACT_CONCURRENT_MODE_TYPE;
}
export function isContextConsumer(object: any) {
return typeOf(object) === REACT_CONTEXT_TYPE;
diff --git a/packages/react-is/src/__tests__/ReactIs-test.js b/packages/react-is/src/__tests__/ReactIs-test.js
index 7833eae9563fa..86cca7a93e736 100644
--- a/packages/react-is/src/__tests__/ReactIs-test.js
+++ b/packages/react-is/src/__tests__/ReactIs-test.js
@@ -56,7 +56,9 @@ describe('ReactIs', () => {
true,
);
expect(ReactIs.isValidElementType(React.Fragment)).toEqual(true);
- expect(ReactIs.isValidElementType(React.unstable_AsyncMode)).toEqual(true);
+ expect(ReactIs.isValidElementType(React.unstable_ConcurrentMode)).toEqual(
+ true,
+ );
expect(ReactIs.isValidElementType(React.StrictMode)).toEqual(true);
expect(ReactIs.isValidElementType(true)).toEqual(false);
@@ -68,13 +70,17 @@ describe('ReactIs', () => {
});
it('should identify async mode', () => {
- expect(ReactIs.typeOf()).toBe(
- ReactIs.AsyncMode,
+ expect(ReactIs.typeOf()).toBe(
+ ReactIs.ConcurrentMode,
+ );
+ expect(ReactIs.isConcurrentMode()).toBe(
+ true,
+ );
+ expect(ReactIs.isConcurrentMode({type: ReactIs.ConcurrentMode})).toBe(
+ false,
);
- expect(ReactIs.isAsyncMode()).toBe(true);
- expect(ReactIs.isAsyncMode({type: ReactIs.AsyncMode})).toBe(false);
- expect(ReactIs.isAsyncMode()).toBe(false);
- expect(ReactIs.isAsyncMode()).toBe(false);
+ expect(ReactIs.isConcurrentMode()).toBe(false);
+ expect(ReactIs.isConcurrentMode()).toBe(false);
});
it('should identify context consumers', () => {
@@ -108,7 +114,7 @@ describe('ReactIs', () => {
expect(ReactIs.isElement()).toBe(true);
expect(ReactIs.isElement()).toBe(true);
expect(ReactIs.isElement()).toBe(true);
- expect(ReactIs.isElement()).toBe(true);
+ expect(ReactIs.isElement()).toBe(true);
expect(ReactIs.isElement()).toBe(true);
});
@@ -117,7 +123,7 @@ describe('ReactIs', () => {
expect(ReactIs.typeOf()).toBe(ReactIs.ForwardRef);
expect(ReactIs.isForwardRef()).toBe(true);
expect(ReactIs.isForwardRef({type: ReactIs.StrictMode})).toBe(false);
- expect(ReactIs.isForwardRef()).toBe(false);
+ expect(ReactIs.isForwardRef()).toBe(false);
expect(ReactIs.isForwardRef()).toBe(false);
});
@@ -142,7 +148,7 @@ describe('ReactIs', () => {
expect(ReactIs.typeOf()).toBe(ReactIs.StrictMode);
expect(ReactIs.isStrictMode()).toBe(true);
expect(ReactIs.isStrictMode({type: ReactIs.StrictMode})).toBe(false);
- expect(ReactIs.isStrictMode()).toBe(false);
+ expect(ReactIs.isStrictMode()).toBe(false);
expect(ReactIs.isStrictMode()).toBe(false);
});
@@ -156,7 +162,7 @@ describe('ReactIs', () => {
),
).toBe(true);
expect(ReactIs.isProfiler({type: ReactIs.unstable_Profiler})).toBe(false);
- expect(ReactIs.isProfiler()).toBe(false);
+ expect(ReactIs.isProfiler()).toBe(false);
expect(ReactIs.isProfiler()).toBe(false);
});
});
diff --git a/packages/react-noop-renderer/src/createReactNoop.js b/packages/react-noop-renderer/src/createReactNoop.js
index 85b3e7b44df69..5cb913b5d1a1f 100644
--- a/packages/react-noop-renderer/src/createReactNoop.js
+++ b/packages/react-noop-renderer/src/createReactNoop.js
@@ -451,13 +451,13 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
getOrCreateRootContainer(
rootID: string = DEFAULT_ROOT_ID,
- isAsync: boolean = false,
+ isConcurrent: boolean = false,
) {
let root = roots.get(rootID);
if (!root) {
const container = {rootID: rootID, children: []};
rootContainers.set(rootID, container);
- root = NoopRenderer.createContainer(container, isAsync, false);
+ root = NoopRenderer.createContainer(container, isConcurrent, false);
roots.set(rootID, root);
}
return root.current.stateNode.containerInfo;
@@ -478,8 +478,11 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
renderLegacySyncRoot(element: React$Element, callback: ?Function) {
const rootID = DEFAULT_ROOT_ID;
- const isAsync = false;
- const container = ReactNoop.getOrCreateRootContainer(rootID, isAsync);
+ const isConcurrent = false;
+ const container = ReactNoop.getOrCreateRootContainer(
+ rootID,
+ isConcurrent,
+ );
const root = roots.get(container.rootID);
NoopRenderer.updateContainer(element, root, null, callback);
},
@@ -489,8 +492,11 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
rootID: string,
callback: ?Function,
) {
- const isAsync = true;
- const container = ReactNoop.getOrCreateRootContainer(rootID, isAsync);
+ const isConcurrent = true;
+ const container = ReactNoop.getOrCreateRootContainer(
+ rootID,
+ isConcurrent,
+ );
const root = roots.get(container.rootID);
NoopRenderer.updateContainer(element, root, null, callback);
},
diff --git a/packages/react-reconciler/src/ReactFiber.js b/packages/react-reconciler/src/ReactFiber.js
index 5ba88f0011c95..019436c42fc4c 100644
--- a/packages/react-reconciler/src/ReactFiber.js
+++ b/packages/react-reconciler/src/ReactFiber.js
@@ -42,7 +42,12 @@ import getComponentName from 'shared/getComponentName';
import {isDevToolsPresent} from './ReactFiberDevToolsHook';
import {NoWork} from './ReactFiberExpirationTime';
-import {NoContext, AsyncMode, ProfileMode, StrictMode} from './ReactTypeOfMode';
+import {
+ NoContext,
+ ConcurrentMode,
+ ProfileMode,
+ StrictMode,
+} from './ReactTypeOfMode';
import {
REACT_FORWARD_REF_TYPE,
REACT_FRAGMENT_TYPE,
@@ -50,7 +55,7 @@ import {
REACT_PROFILER_TYPE,
REACT_PROVIDER_TYPE,
REACT_CONTEXT_TYPE,
- REACT_ASYNC_MODE_TYPE,
+ REACT_CONCURRENT_MODE_TYPE,
REACT_PLACEHOLDER_TYPE,
} from 'shared/ReactSymbols';
@@ -133,7 +138,7 @@ export type Fiber = {|
firstContextDependency: ContextDependency | null,
// Bitfield that describes properties about the fiber and its subtree. E.g.
- // the AsyncMode flag indicates whether the subtree should be async-by-
+ // the ConcurrentMode flag indicates whether the subtree should be async-by-
// default. When a fiber is created, it inherits the mode of its
// parent. Additional flags can be set at creation time, but after that the
// value should remain unchanged throughout the fiber's lifetime, particularly
@@ -387,8 +392,8 @@ export function createWorkInProgress(
return workInProgress;
}
-export function createHostRootFiber(isAsync: boolean): Fiber {
- let mode = isAsync ? AsyncMode | StrictMode : NoContext;
+export function createHostRootFiber(isConcurrent: boolean): Fiber {
+ let mode = isConcurrent ? ConcurrentMode | StrictMode : NoContext;
if (enableProfilerTimer && isDevToolsPresent) {
// Always collect profile timings when DevTools are present.
@@ -429,9 +434,9 @@ export function createFiberFromElement(
expirationTime,
key,
);
- case REACT_ASYNC_MODE_TYPE:
+ case REACT_CONCURRENT_MODE_TYPE:
fiberTag = Mode;
- mode |= AsyncMode | StrictMode;
+ mode |= ConcurrentMode | StrictMode;
break;
case REACT_STRICT_MODE_TYPE:
fiberTag = Mode;
diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.js b/packages/react-reconciler/src/ReactFiberBeginWork.js
index 61c75d05cddc6..48f680cad3a3e 100644
--- a/packages/react-reconciler/src/ReactFiberBeginWork.js
+++ b/packages/react-reconciler/src/ReactFiberBeginWork.js
@@ -66,7 +66,7 @@ import {
} from './ReactChildFiber';
import {processUpdateQueue} from './ReactUpdateQueue';
import {NoWork, Never} from './ReactFiberExpirationTime';
-import {AsyncMode, StrictMode} from './ReactTypeOfMode';
+import {ConcurrentMode, StrictMode} from './ReactTypeOfMode';
import {
shouldSetTextContent,
shouldDeprioritizeSubtree,
@@ -568,7 +568,7 @@ function updateHostComponent(current, workInProgress, renderExpirationTime) {
// Check the host config to see if the children are offscreen/hidden.
if (
renderExpirationTime !== Never &&
- workInProgress.mode & AsyncMode &&
+ workInProgress.mode & ConcurrentMode &&
shouldDeprioritizeSubtree(type, nextProps)
) {
// Schedule this fiber to re-render at offscreen priority. Then bailout.
diff --git a/packages/react-reconciler/src/ReactFiberReconciler.js b/packages/react-reconciler/src/ReactFiberReconciler.js
index 194f01503f82f..ca072d0c938f6 100644
--- a/packages/react-reconciler/src/ReactFiberReconciler.js
+++ b/packages/react-reconciler/src/ReactFiberReconciler.js
@@ -211,10 +211,10 @@ function findHostInstance(component: Object): PublicInstance | null {
export function createContainer(
containerInfo: Container,
- isAsync: boolean,
+ isConcurrent: boolean,
hydrate: boolean,
): OpaqueRoot {
- return createFiberRoot(containerInfo, isAsync, hydrate);
+ return createFiberRoot(containerInfo, isConcurrent, hydrate);
}
export function updateContainer(
diff --git a/packages/react-reconciler/src/ReactFiberRoot.js b/packages/react-reconciler/src/ReactFiberRoot.js
index 9fa00cb805b7e..d257f3c93ab6f 100644
--- a/packages/react-reconciler/src/ReactFiberRoot.js
+++ b/packages/react-reconciler/src/ReactFiberRoot.js
@@ -101,12 +101,12 @@ export type FiberRoot = {
export function createFiberRoot(
containerInfo: any,
- isAsync: boolean,
+ isConcurrent: boolean,
hydrate: boolean,
): FiberRoot {
// Cyclic construction. This cheats the type system right now because
// stateNode is any.
- const uninitializedFiber = createHostRootFiber(isAsync);
+ const uninitializedFiber = createHostRootFiber(isConcurrent);
let root;
if (enableSchedulerTracing) {
diff --git a/packages/react-reconciler/src/ReactFiberScheduler.js b/packages/react-reconciler/src/ReactFiberScheduler.js
index d312e60be8eb5..dcb0b8c105f78 100644
--- a/packages/react-reconciler/src/ReactFiberScheduler.js
+++ b/packages/react-reconciler/src/ReactFiberScheduler.js
@@ -112,7 +112,7 @@ import {
computeAsyncExpiration,
computeInteractiveExpiration,
} from './ReactFiberExpirationTime';
-import {AsyncMode, ProfileMode} from './ReactTypeOfMode';
+import {ConcurrentMode, ProfileMode} from './ReactTypeOfMode';
import {enqueueUpdate, resetCurrentlyProcessingQueue} from './ReactUpdateQueue';
import {createCapturedValue} from './ReactCapturedValue';
import {
@@ -1545,7 +1545,7 @@ function computeExpirationForFiber(currentTime: ExpirationTime, fiber: Fiber) {
} else {
// No explicit expiration context was set, and we're not currently
// performing work. Calculate a new expiration time.
- if (fiber.mode & AsyncMode) {
+ if (fiber.mode & ConcurrentMode) {
if (isBatchingInteractiveUpdates) {
// This is an interactive update
expirationTime = computeInteractiveExpiration(currentTime);
diff --git a/packages/react-reconciler/src/ReactFiberUnwindWork.js b/packages/react-reconciler/src/ReactFiberUnwindWork.js
index 546af6c0e2138..bfd7714966e28 100644
--- a/packages/react-reconciler/src/ReactFiberUnwindWork.js
+++ b/packages/react-reconciler/src/ReactFiberUnwindWork.js
@@ -38,7 +38,7 @@ import {
enableSuspense,
enableSchedulerTracing,
} from 'shared/ReactFeatureFlags';
-import {StrictMode, AsyncMode} from './ReactTypeOfMode';
+import {StrictMode, ConcurrentMode} from './ReactTypeOfMode';
import {createCapturedValue} from './ReactCapturedValue';
import {
@@ -211,10 +211,10 @@ function throwException(
if (!didTimeout) {
// Found the nearest boundary.
- // If the boundary is not in async mode, we should not suspend, and
+ // If the boundary is not in concurrent mode, we should not suspend, and
// likewise, when the promise resolves, we should ping synchronously.
const pingTime =
- (workInProgress.mode & AsyncMode) === NoEffect
+ (workInProgress.mode & ConcurrentMode) === NoEffect
? Sync
: renderExpirationTime;
diff --git a/packages/react-reconciler/src/ReactTypeOfMode.js b/packages/react-reconciler/src/ReactTypeOfMode.js
index e579e05d9d344..a727bec843425 100644
--- a/packages/react-reconciler/src/ReactTypeOfMode.js
+++ b/packages/react-reconciler/src/ReactTypeOfMode.js
@@ -10,6 +10,6 @@
export type TypeOfMode = number;
export const NoContext = 0b000;
-export const AsyncMode = 0b001;
+export const ConcurrentMode = 0b001;
export const StrictMode = 0b010;
export const ProfileMode = 0b100;
diff --git a/packages/react-reconciler/src/__tests__/ReactIncrementalPerf-test.internal.js b/packages/react-reconciler/src/__tests__/ReactIncrementalPerf-test.internal.js
index f5725080ad9f5..bc1dca7adf592 100644
--- a/packages/react-reconciler/src/__tests__/ReactIncrementalPerf-test.internal.js
+++ b/packages/react-reconciler/src/__tests__/ReactIncrementalPerf-test.internal.js
@@ -186,14 +186,14 @@ describe('ReactDebugFiberPerf', () => {
expect(getFlameChart()).toMatchSnapshot();
});
- it('does not include AsyncMode, StrictMode, or Profiler components in measurements', () => {
+ it('does not include ConcurrentMode, StrictMode, or Profiler components in measurements', () => {
ReactNoop.render(
-
+
-
+
,
diff --git a/packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js b/packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js
index 82ae915266328..2033b4e145385 100644
--- a/packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js
+++ b/packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js
@@ -5,7 +5,7 @@ let ReactNoop;
let SimpleCacheProvider;
let Placeholder;
let StrictMode;
-let AsyncMode;
+let ConcurrentMode;
let lazy;
let cache;
@@ -25,7 +25,7 @@ describe('ReactSuspense', () => {
SimpleCacheProvider = require('simple-cache-provider');
Placeholder = React.Placeholder;
StrictMode = React.StrictMode;
- AsyncMode = React.unstable_AsyncMode;
+ ConcurrentMode = React.unstable_ConcurrentMode;
lazy = React.lazy;
function invalidateCache() {
@@ -927,10 +927,10 @@ describe('ReactSuspense', () => {
function App() {
return (
}>
-
+
-
+
);
}
@@ -1004,7 +1004,7 @@ describe('ReactSuspense', () => {
return (
}>
-
+
{text => (
@@ -1014,9 +1014,9 @@ describe('ReactSuspense', () => {
)}
-
+
-
+
{text => (
@@ -1026,7 +1026,7 @@ describe('ReactSuspense', () => {
)}
-
+
);
}
@@ -1136,7 +1136,7 @@ describe('ReactSuspense', () => {
return (
}>
-
+
{text => (
@@ -1146,9 +1146,9 @@ describe('ReactSuspense', () => {
)}
-
+
-
+
{text => (
@@ -1158,7 +1158,7 @@ describe('ReactSuspense', () => {
)}
-
+
);
}
diff --git a/packages/react-reconciler/src/__tests__/__snapshots__/ReactIncrementalPerf-test.internal.js.snap b/packages/react-reconciler/src/__tests__/__snapshots__/ReactIncrementalPerf-test.internal.js.snap
index d725bf9bb0e37..dcef20d96875d 100644
--- a/packages/react-reconciler/src/__tests__/__snapshots__/ReactIncrementalPerf-test.internal.js.snap
+++ b/packages/react-reconciler/src/__tests__/__snapshots__/ReactIncrementalPerf-test.internal.js.snap
@@ -91,7 +91,7 @@ exports[`ReactDebugFiberPerf deduplicates lifecycle names during commit to reduc
"
`;
-exports[`ReactDebugFiberPerf does not include AsyncMode, StrictMode, or Profiler components in measurements 1`] = `
+exports[`ReactDebugFiberPerf does not include ConcurrentMode, StrictMode, or Profiler components in measurements 1`] = `
"⚛ (Waiting for async callback... will force flush in 5250 ms)
// Mount
diff --git a/packages/react-test-renderer/src/ReactTestRenderer.js b/packages/react-test-renderer/src/ReactTestRenderer.js
index ca9e59419e9ad..10b664651a017 100644
--- a/packages/react-test-renderer/src/ReactTestRenderer.js
+++ b/packages/react-test-renderer/src/ReactTestRenderer.js
@@ -39,7 +39,7 @@ import * as TestRendererScheduling from './ReactTestRendererScheduling';
type TestRendererOptions = {
createNodeMock: (element: React$Element) => any,
- unstable_isAsync: boolean,
+ unstable_isConcurrent: boolean,
};
type ReactTestRendererJSON = {|
@@ -419,13 +419,13 @@ function propsMatch(props: Object, filter: Object): boolean {
const ReactTestRendererFiber = {
create(element: React$Element, options: TestRendererOptions) {
let createNodeMock = defaultTestOptions.createNodeMock;
- let isAsync = false;
+ let isConcurrent = false;
if (typeof options === 'object' && options !== null) {
if (typeof options.createNodeMock === 'function') {
createNodeMock = options.createNodeMock;
}
- if (options.unstable_isAsync === true) {
- isAsync = true;
+ if (options.unstable_isConcurrent === true) {
+ isConcurrent = true;
}
}
let container = {
@@ -435,7 +435,7 @@ const ReactTestRendererFiber = {
};
let root: FiberRoot | null = TestRenderer.createContainer(
container,
- isAsync,
+ isConcurrent,
false,
);
invariant(root != null, 'something went wrong');
diff --git a/packages/react-test-renderer/src/__tests__/ReactTestRendererAsync-test.js b/packages/react-test-renderer/src/__tests__/ReactTestRendererAsync-test.js
index 80963eced872c..bdf019e0fe031 100644
--- a/packages/react-test-renderer/src/__tests__/ReactTestRendererAsync-test.js
+++ b/packages/react-test-renderer/src/__tests__/ReactTestRendererAsync-test.js
@@ -25,7 +25,7 @@ describe('ReactTestRendererAsync', () => {
return props.children;
}
const renderer = ReactTestRenderer.create(Hi, {
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
});
// Before flushing, nothing has mounted.
@@ -59,7 +59,7 @@ describe('ReactTestRendererAsync', () => {
);
}
const renderer = ReactTestRenderer.create(, {
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
});
expect(renderer).toFlushAll(['A:1', 'B:1', 'C:1']);
@@ -85,7 +85,7 @@ describe('ReactTestRendererAsync', () => {
);
}
const renderer = ReactTestRenderer.create(, {
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
});
// Flush the first two siblings
@@ -122,7 +122,7 @@ describe('ReactTestRendererAsync', () => {
}
const renderer = ReactTestRenderer.create(, {
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
});
// Flush the some of the changes, but don't commit
@@ -152,7 +152,7 @@ describe('ReactTestRendererAsync', () => {
,
{
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
},
);
@@ -174,7 +174,7 @@ describe('ReactTestRendererAsync', () => {
,
{
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
},
);
@@ -218,7 +218,7 @@ describe('ReactTestRendererAsync', () => {
}
const renderer = ReactTestRenderer.create(, {
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
});
expect(() => {
diff --git a/packages/react/src/React.js b/packages/react/src/React.js
index 106ab898dc93f..27a5638a0845a 100644
--- a/packages/react/src/React.js
+++ b/packages/react/src/React.js
@@ -7,7 +7,7 @@
import ReactVersion from 'shared/ReactVersion';
import {
- REACT_ASYNC_MODE_TYPE,
+ REACT_CONCURRENT_MODE_TYPE,
REACT_FRAGMENT_TYPE,
REACT_PROFILER_TYPE,
REACT_STRICT_MODE_TYPE,
@@ -52,7 +52,7 @@ const React = {
Fragment: REACT_FRAGMENT_TYPE,
StrictMode: REACT_STRICT_MODE_TYPE,
- unstable_AsyncMode: REACT_ASYNC_MODE_TYPE,
+ unstable_ConcurrentMode: REACT_CONCURRENT_MODE_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
index 802aa31c0dd22..ca6120b51ce4d 100644
--- a/packages/react/src/__tests__/ReactProfiler-test.internal.js
+++ b/packages/react/src/__tests__/ReactProfiler-test.internal.js
@@ -223,7 +223,7 @@ describe('Profiler', () => {
,
{
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
},
);
@@ -578,7 +578,7 @@ describe('Profiler', () => {
,
- {unstable_isAsync: true},
+ {unstable_isConcurrent: true},
);
expect(renderer).toFlushThrough(['Yield:2']);
expect(callback).toHaveBeenCalledTimes(0);
@@ -616,7 +616,7 @@ describe('Profiler', () => {
,
- {unstable_isAsync: true},
+ {unstable_isConcurrent: true},
);
expect(renderer).toFlushThrough(['Yield:5']);
expect(callback).toHaveBeenCalledTimes(0);
@@ -663,7 +663,7 @@ describe('Profiler', () => {
,
- {unstable_isAsync: true},
+ {unstable_isConcurrent: true},
);
expect(renderer).toFlushThrough(['Yield:10']);
expect(callback).toHaveBeenCalledTimes(0);
@@ -714,7 +714,7 @@ describe('Profiler', () => {
,
- {unstable_isAsync: true},
+ {unstable_isConcurrent: true},
);
// Render everything initially.
@@ -820,7 +820,7 @@ describe('Profiler', () => {
,
- {unstable_isAsync: true},
+ {unstable_isConcurrent: true},
);
// Render everything initially.
@@ -1295,7 +1295,7 @@ describe('Profiler', () => {
expect(() => {
SchedulerTracing.unstable_trace('event', mockNow(), () => {
renderer = ReactTestRenderer.create(fail, {
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
});
});
}).toThrow('Expected error onWorkScheduled');
@@ -1304,7 +1304,7 @@ describe('Profiler', () => {
// But should not leave React in a broken state for subsequent renders.
renderer = ReactTestRenderer.create(succeed, {
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
});
expect(renderer).toFlushAll(['Component:succeed']);
const tree = renderer.toTree();
@@ -1321,7 +1321,7 @@ describe('Profiler', () => {
let renderer;
SchedulerTracing.unstable_trace('event', mockNow(), () => {
renderer = ReactTestRenderer.create(text, {
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
});
});
onWorkStarted.mockClear();
@@ -1350,7 +1350,7 @@ describe('Profiler', () => {
let renderer;
SchedulerTracing.unstable_trace('event', mockNow(), () => {
renderer = ReactTestRenderer.create(text, {
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
});
});
expect(onInteractionScheduledWorkCompleted).not.toHaveBeenCalled();
@@ -1393,7 +1393,7 @@ describe('Profiler', () => {
SchedulerTracing.unstable_trace(eventOne.name, mockNow(), () => {
SchedulerTracing.unstable_trace(eventTwo.name, mockNow(), () => {
renderer = ReactTestRenderer.create(text, {
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
});
});
});
@@ -1482,7 +1482,7 @@ describe('Profiler', () => {
,
{
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
},
);
},
@@ -1723,7 +1723,7 @@ describe('Profiler', () => {
,
- {unstable_isAsync: true},
+ {unstable_isConcurrent: true},
);
// Initial mount.
@@ -1897,7 +1897,7 @@ describe('Profiler', () => {
,
- {unstable_isAsync: true},
+ {unstable_isConcurrent: true},
);
});
@@ -2102,7 +2102,7 @@ describe('Profiler', () => {
advanceTimeBy(1);
const renderer = ReactTestRenderer.create(, {
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
});
renderer.unstable_flushAll(['Child:0']);
onRender.mockClear();
@@ -2413,7 +2413,7 @@ describe('Profiler', () => {
,
{
- unstable_isAsync: true,
+ unstable_isConcurrent: true,
},
);
},
@@ -2456,7 +2456,7 @@ describe('Profiler', () => {
,
- {unstable_isAsync: true},
+ {unstable_isConcurrent: true},
);
},
);
@@ -2587,7 +2587,7 @@ describe('Profiler', () => {
,
- {unstable_isAsync: true},
+ {unstable_isConcurrent: true},
);
},
);
diff --git a/packages/react/src/__tests__/ReactStrictMode-test.internal.js b/packages/react/src/__tests__/ReactStrictMode-test.internal.js
index 286587bc0e7cb..896c7c179e301 100644
--- a/packages/react/src/__tests__/ReactStrictMode-test.internal.js
+++ b/packages/react/src/__tests__/ReactStrictMode-test.internal.js
@@ -313,9 +313,9 @@ describe('ReactStrictMode', () => {
UNSAFE_componentWillReceiveProps() {}
render() {
return (
-
+
-
+
);
}
}
@@ -357,7 +357,7 @@ describe('ReactStrictMode', () => {
rendered = ReactTestRenderer.create();
}).toWarnDev(
'Unsafe lifecycle methods were found within a strict-mode tree:' +
- '\n in AsyncMode (at **)' +
+ '\n in ConcurrentMode (at **)' +
'\n in SyncRoot (at **)' +
'\n\ncomponentWillMount: Please update the following components ' +
'to use componentDidMount instead: AsyncRoot' +
@@ -381,9 +381,9 @@ describe('ReactStrictMode', () => {
UNSAFE_componentWillReceiveProps() {}
render() {
return (
-
+
-
+
);
}
}
@@ -415,7 +415,7 @@ describe('ReactStrictMode', () => {
() => (rendered = ReactTestRenderer.create()),
).toWarnDev(
'Unsafe lifecycle methods were found within a strict-mode tree:' +
- '\n in AsyncMode (at **)' +
+ '\n in ConcurrentMode (at **)' +
'\n in SyncRoot (at **)' +
'\n\ncomponentWillMount: Please update the following components ' +
'to use componentDidMount instead: AsyncRoot, Parent' +
@@ -449,22 +449,22 @@ describe('ReactStrictMode', () => {
class AsyncRootOne extends React.Component {
render() {
return (
-
+
-
+
);
}
}
class AsyncRootTwo extends React.Component {
render() {
return (
-
+
-
+
);
}
}
@@ -493,14 +493,14 @@ describe('ReactStrictMode', () => {
() => (rendered = ReactTestRenderer.create()),
).toWarnDev([
'Unsafe lifecycle methods were found within a strict-mode tree:' +
- '\n in AsyncMode (at **)' +
+ '\n in ConcurrentMode (at **)' +
'\n in AsyncRootOne (at **)' +
'\n in div (at **)' +
'\n in SyncRoot (at **)' +
'\n\ncomponentWillMount: Please update the following components ' +
'to use componentDidMount instead: Bar, Foo',
'Unsafe lifecycle methods were found within a strict-mode tree:' +
- '\n in AsyncMode (at **)' +
+ '\n in ConcurrentMode (at **)' +
'\n in AsyncRootTwo (at **)' +
'\n in div (at **)' +
'\n in SyncRoot (at **)' +
@@ -517,9 +517,9 @@ describe('ReactStrictMode', () => {
class AsyncRoot extends React.Component {
render() {
return (
-
+
{this.props.foo ? : }
-
+
);
}
}
@@ -541,7 +541,7 @@ describe('ReactStrictMode', () => {
rendered = ReactTestRenderer.create();
}).toWarnDev(
'Unsafe lifecycle methods were found within a strict-mode tree:' +
- '\n in AsyncMode (at **)' +
+ '\n in ConcurrentMode (at **)' +
'\n in AsyncRoot (at **)' +
'\n\ncomponentWillMount: Please update the following components ' +
'to use componentDidMount instead: Foo' +
@@ -551,7 +551,7 @@ describe('ReactStrictMode', () => {
expect(() => rendered.update()).toWarnDev(
'Unsafe lifecycle methods were found within a strict-mode tree:' +
- '\n in AsyncMode (at **)' +
+ '\n in ConcurrentMode (at **)' +
'\n in AsyncRoot (at **)' +
'\n\ncomponentWillMount: Please update the following components ' +
'to use componentDidMount instead: Bar' +
diff --git a/packages/shared/ReactSymbols.js b/packages/shared/ReactSymbols.js
index 0653cae1656c1..a13a5fc792eb8 100644
--- a/packages/shared/ReactSymbols.js
+++ b/packages/shared/ReactSymbols.js
@@ -32,8 +32,8 @@ export const REACT_PROVIDER_TYPE = hasSymbol
export const REACT_CONTEXT_TYPE = hasSymbol
? Symbol.for('react.context')
: 0xeace;
-export const REACT_ASYNC_MODE_TYPE = hasSymbol
- ? Symbol.for('react.async_mode')
+export const REACT_CONCURRENT_MODE_TYPE = hasSymbol
+ ? Symbol.for('react.concurrent_mode')
: 0xeacf;
export const REACT_FORWARD_REF_TYPE = hasSymbol
? Symbol.for('react.forward_ref')
diff --git a/packages/shared/getComponentName.js b/packages/shared/getComponentName.js
index e39a6965e02e3..00625cf3304c5 100644
--- a/packages/shared/getComponentName.js
+++ b/packages/shared/getComponentName.js
@@ -11,7 +11,7 @@ import type {Thenable} from 'shared/ReactLazyComponent';
import warningWithoutStack from 'shared/warningWithoutStack';
import {
- REACT_ASYNC_MODE_TYPE,
+ REACT_CONCURRENT_MODE_TYPE,
REACT_CONTEXT_TYPE,
REACT_FORWARD_REF_TYPE,
REACT_FRAGMENT_TYPE,
@@ -44,8 +44,8 @@ function getComponentName(type: mixed): string | null {
return type;
}
switch (type) {
- case REACT_ASYNC_MODE_TYPE:
- return 'AsyncMode';
+ case REACT_CONCURRENT_MODE_TYPE:
+ return 'ConcurrentMode';
case REACT_FRAGMENT_TYPE:
return 'Fragment';
case REACT_PORTAL_TYPE:
diff --git a/packages/shared/isValidElementType.js b/packages/shared/isValidElementType.js
index 7fb50fa5f84da..22fab9d39aae3 100644
--- a/packages/shared/isValidElementType.js
+++ b/packages/shared/isValidElementType.js
@@ -8,7 +8,7 @@
*/
import {
- REACT_ASYNC_MODE_TYPE,
+ REACT_CONCURRENT_MODE_TYPE,
REACT_CONTEXT_TYPE,
REACT_FORWARD_REF_TYPE,
REACT_FRAGMENT_TYPE,
@@ -24,7 +24,7 @@ export default function isValidElementType(type: mixed) {
typeof type === 'function' ||
// Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
type === REACT_FRAGMENT_TYPE ||
- type === REACT_ASYNC_MODE_TYPE ||
+ type === REACT_CONCURRENT_MODE_TYPE ||
type === REACT_PROFILER_TYPE ||
type === REACT_STRICT_MODE_TYPE ||
type === REACT_PLACEHOLDER_TYPE ||