.',
@@ -1652,7 +1637,6 @@ describe('ReactDOMServerHooks', () => {
);
});
- // @gate experimental
it('useOpaqueIdentifier: IDs match when part of the DOM tree is server rendered and part is client rendered', async () => {
let suspend = true;
@@ -1695,7 +1679,7 @@ describe('ReactDOMServerHooks', () => {
container.innerHTML = ReactDOMServer.renderToString(
);
suspend = false;
- const root = ReactDOM.unstable_createRoot(container, {hydrate: true});
+ const root = ReactDOM.createRoot(container, {hydrate: true});
await act(async () => {
root.render(
);
});
@@ -1717,7 +1701,6 @@ describe('ReactDOMServerHooks', () => {
).not.toBeNull();
});
- // @gate experimental
it('useOpaqueIdentifier warn when there is a hydration error', async () => {
function Child({appId}) {
return
;
@@ -1732,7 +1715,7 @@ describe('ReactDOMServerHooks', () => {
// This is the wrong HTML string
container.innerHTML = '
);
expect(() => Scheduler.unstable_flushAll()).toErrorDev(
[
'Warning: An error occurred during hydration. The server HTML was replaced with client content in
.',
@@ -1742,7 +1725,6 @@ describe('ReactDOMServerHooks', () => {
);
});
- // @gate experimental
it('useOpaqueIdentifier warns when there is a hydration error and we are using ID as a string', async () => {
function Child({appId}) {
return
;
@@ -1757,7 +1739,7 @@ describe('ReactDOMServerHooks', () => {
// This is the wrong HTML string
container.innerHTML = '
';
- ReactDOM.unstable_createRoot(container, {hydrate: true}).render(
);
+ ReactDOM.createRoot(container, {hydrate: true}).render(
);
expect(() => Scheduler.unstable_flushAll()).toErrorDev(
[
'Warning: The object passed back from useOpaqueIdentifier is meant to be passed through to attributes only. Do not read the value directly.',
@@ -1767,7 +1749,6 @@ describe('ReactDOMServerHooks', () => {
);
});
- // @gate experimental
it('useOpaqueIdentifier warns when there is a hydration error and we are using ID as a string', async () => {
function Child({appId}) {
return
;
@@ -1782,7 +1763,7 @@ describe('ReactDOMServerHooks', () => {
// This is the wrong HTML string
container.innerHTML = '
';
- ReactDOM.unstable_createRoot(container, {hydrate: true}).render(
);
+ ReactDOM.createRoot(container, {hydrate: true}).render(
);
expect(() => Scheduler.unstable_flushAll()).toErrorDev(
[
'Warning: The object passed back from useOpaqueIdentifier is meant to be passed through to attributes only. Do not read the value directly.',
@@ -1792,7 +1773,6 @@ describe('ReactDOMServerHooks', () => {
);
});
- // @gate experimental
it('useOpaqueIdentifier warns if you try to use the result as a string in a child component', async () => {
function Child({appId}) {
return
;
@@ -1806,7 +1786,7 @@ describe('ReactDOMServerHooks', () => {
document.body.appendChild(container);
container.innerHTML = ReactDOMServer.renderToString(
);
- ReactDOM.unstable_createRoot(container, {hydrate: true}).render(
);
+ ReactDOM.createRoot(container, {hydrate: true}).render(
);
expect(() => Scheduler.unstable_flushAll()).toErrorDev(
[
'Warning: The object passed back from useOpaqueIdentifier is meant to be passed through to attributes only. Do not read the value directly.',
@@ -1816,7 +1796,6 @@ describe('ReactDOMServerHooks', () => {
);
});
- // @gate experimental
it('useOpaqueIdentifier warns if you try to use the result as a string', async () => {
function App() {
const id = useOpaqueIdentifier();
@@ -1827,7 +1806,7 @@ describe('ReactDOMServerHooks', () => {
document.body.appendChild(container);
container.innerHTML = ReactDOMServer.renderToString(
);
- ReactDOM.unstable_createRoot(container, {hydrate: true}).render(
);
+ ReactDOM.createRoot(container, {hydrate: true}).render(
);
expect(() => Scheduler.unstable_flushAll()).toErrorDev(
[
'Warning: The object passed back from useOpaqueIdentifier is meant to be passed through to attributes only. Do not read the value directly.',
@@ -1837,7 +1816,6 @@ describe('ReactDOMServerHooks', () => {
);
});
- // @gate experimental
it('useOpaqueIdentifier warns if you try to use the result as a string in a child component wrapped in a Suspense', async () => {
function Child({appId}) {
return
;
@@ -1856,7 +1834,7 @@ describe('ReactDOMServerHooks', () => {
container.innerHTML = ReactDOMServer.renderToString(
);
- ReactDOM.unstable_createRoot(container, {hydrate: true}).render(
);
+ ReactDOM.createRoot(container, {hydrate: true}).render(
);
if (gate(flags => flags.deferRenderPhaseUpdateToNextBatch)) {
expect(() => Scheduler.unstable_flushAll()).toErrorDev([
@@ -1878,7 +1856,6 @@ describe('ReactDOMServerHooks', () => {
}
});
- // @gate experimental
it('useOpaqueIdentifier warns if you try to add the result as a number in a child component wrapped in a Suspense', async () => {
function Child({appId}) {
return
;
@@ -1899,7 +1876,7 @@ describe('ReactDOMServerHooks', () => {
container.innerHTML = ReactDOMServer.renderToString(
);
- ReactDOM.unstable_createRoot(container, {hydrate: true}).render(
);
+ ReactDOM.createRoot(container, {hydrate: true}).render(
);
if (gate(flags => flags.deferRenderPhaseUpdateToNextBatch)) {
expect(() => Scheduler.unstable_flushAll()).toErrorDev([
@@ -1921,7 +1898,6 @@ describe('ReactDOMServerHooks', () => {
}
});
- // @gate experimental
it('useOpaqueIdentifier with two opaque identifiers on the same page', () => {
let _setShow;
@@ -1960,7 +1936,7 @@ describe('ReactDOMServerHooks', () => {
.getAttribute('aria-labelledby'),
).toEqual(serverID);
- ReactDOM.unstable_createRoot(container, {hydrate: true}).render(
);
+ ReactDOM.createRoot(container, {hydrate: true}).render(
);
jest.runAllTimers();
expect(Scheduler).toHaveYielded([]);
expect(Scheduler).toFlushAndYield([]);
diff --git a/packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js b/packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js
index 02a388a1898ed..1e644be1276cf 100644
--- a/packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js
+++ b/packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js
@@ -917,9 +917,7 @@ describe('ReactDOMServerPartialHydration', () => {
expect(container.textContent).toBe('Hello');
// Render an update with a long timeout.
- React.unstable_startTransition(() =>
- root.render(
),
- );
+ React.startTransition(() => root.render(
));
// This shouldn't force the fallback yet.
Scheduler.unstable_flushAll();
@@ -1591,7 +1589,7 @@ describe('ReactDOMServerPartialHydration', () => {
await act(async () => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render(
);
});
diff --git a/packages/react-dom/src/__tests__/ReactServerRenderingHydration-test.js b/packages/react-dom/src/__tests__/ReactServerRenderingHydration-test.js
index 0ea7972f5d65d..29d2ce6c22149 100644
--- a/packages/react-dom/src/__tests__/ReactServerRenderingHydration-test.js
+++ b/packages/react-dom/src/__tests__/ReactServerRenderingHydration-test.js
@@ -492,12 +492,11 @@ describe('ReactDOMServerHydration', () => {
expect(element.textContent).toBe('Hello world');
});
- // @gate experimental
it('does not re-enter hydration after committing the first one', () => {
const finalHTML = ReactDOMServer.renderToString(
);
const container = document.createElement('div');
container.innerHTML = finalHTML;
- const root = ReactDOM.unstable_createRoot(container, {hydrate: true});
+ const root = ReactDOM.createRoot(container, {hydrate: true});
root.render(
);
Scheduler.unstable_flushAll();
root.render(null);
diff --git a/packages/react-dom/src/__tests__/ReactTestUtilsAct-test.js b/packages/react-dom/src/__tests__/ReactTestUtilsAct-test.js
index dee4b7852a837..d2ea73e09800c 100644
--- a/packages/react-dom/src/__tests__/ReactTestUtilsAct-test.js
+++ b/packages/react-dom/src/__tests__/ReactTestUtilsAct-test.js
@@ -29,7 +29,7 @@ describe('ReactTestUtils.act()', () => {
if (__EXPERIMENTAL__) {
let concurrentRoot = null;
const renderConcurrent = (el, dom) => {
- concurrentRoot = ReactDOM.unstable_createRoot(dom);
+ concurrentRoot = ReactDOM.createRoot(dom);
concurrentRoot.render(el);
};
@@ -96,20 +96,17 @@ describe('ReactTestUtils.act()', () => {
]);
});
- // @gate experimental
it('does not warn in concurrent mode', () => {
- const root = ReactDOM.unstable_createRoot(document.createElement('div'));
+ const root = ReactDOM.createRoot(document.createElement('div'));
root.render(
);
Scheduler.unstable_flushAll();
});
- // @gate experimental
it('warns in concurrent mode if root is strict', () => {
expect(() => {
- const root = ReactDOM.unstable_createRoot(
- document.createElement('div'),
- {unstable_strictMode: true},
- );
+ const root = ReactDOM.createRoot(document.createElement('div'), {
+ unstable_strictMode: true,
+ });
root.render(
);
Scheduler.unstable_flushAll();
}).toErrorDev([
@@ -665,7 +662,7 @@ function runActTests(label, render, unmount, rerender) {
expect(document.querySelector('[data-test-id=spinner]')).toBeNull();
// trigger a suspendy update with a delay
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
act(() => {
rerender(
);
});
diff --git a/packages/react-dom/src/__tests__/ReactUnmockedSchedulerWarning-test.js b/packages/react-dom/src/__tests__/ReactUnmockedSchedulerWarning-test.js
index 79437e7f5c760..3091c3d1af785 100644
--- a/packages/react-dom/src/__tests__/ReactUnmockedSchedulerWarning-test.js
+++ b/packages/react-dom/src/__tests__/ReactUnmockedSchedulerWarning-test.js
@@ -29,10 +29,9 @@ it('does not warn when rendering in legacy mode', () => {
}).toErrorDev([]);
});
-// @gate experimental
it('should warn when rendering in concurrent mode', () => {
expect(() => {
- ReactDOM.unstable_createRoot(document.createElement('div')).render(
);
+ ReactDOM.createRoot(document.createElement('div')).render(
);
}).toErrorDev(
'In Concurrent or Sync modes, the "scheduler" module needs to be mocked ' +
'to guarantee consistent behaviour across tests and browsers.',
@@ -40,6 +39,6 @@ it('should warn when rendering in concurrent mode', () => {
);
// does not warn twice
expect(() => {
- ReactDOM.unstable_createRoot(document.createElement('div')).render(
);
+ ReactDOM.createRoot(document.createElement('div')).render(
);
}).toErrorDev([]);
});
diff --git a/packages/react-dom/src/__tests__/ReactUpdates-test.js b/packages/react-dom/src/__tests__/ReactUpdates-test.js
index 28dd03158b7e4..dfa1a51939c3a 100644
--- a/packages/react-dom/src/__tests__/ReactUpdates-test.js
+++ b/packages/react-dom/src/__tests__/ReactUpdates-test.js
@@ -1332,7 +1332,7 @@ describe('ReactUpdates', () => {
);
}
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
let hiddenDiv;
act(() => {
root.render(
);
diff --git a/packages/react-dom/src/__tests__/ReactWrongReturnPointer-test.js b/packages/react-dom/src/__tests__/ReactWrongReturnPointer-test.js
index bb3e040cbeb6e..37b8f72cd2399 100644
--- a/packages/react-dom/src/__tests__/ReactWrongReturnPointer-test.js
+++ b/packages/react-dom/src/__tests__/ReactWrongReturnPointer-test.js
@@ -22,7 +22,7 @@ beforeEach(() => {
Scheduler = require('scheduler');
Suspense = React.Suspense;
- SuspenseList = React.unstable_SuspenseList;
+ SuspenseList = React.SuspenseList;
getCacheForType = React.unstable_getCacheForType;
diff --git a/packages/react-dom/src/events/__tests__/DOMPluginEventSystem-test.internal.js b/packages/react-dom/src/events/__tests__/DOMPluginEventSystem-test.internal.js
index 44353e6fb4422..c72720706e61e 100644
--- a/packages/react-dom/src/events/__tests__/DOMPluginEventSystem-test.internal.js
+++ b/packages/react-dom/src/events/__tests__/DOMPluginEventSystem-test.internal.js
@@ -1951,7 +1951,7 @@ describe('DOMPluginEventSystem', () => {
// Increase counter
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render(
);
});
} else {
diff --git a/packages/react-dom/src/events/plugins/__tests__/ChangeEventPlugin-test.js b/packages/react-dom/src/events/plugins/__tests__/ChangeEventPlugin-test.js
index 3eb9edd2fecbd..507de50f14086 100644
--- a/packages/react-dom/src/events/plugins/__tests__/ChangeEventPlugin-test.js
+++ b/packages/react-dom/src/events/plugins/__tests__/ChangeEventPlugin-test.js
@@ -495,9 +495,8 @@ describe('ChangeEventPlugin', () => {
});
describe('concurrent mode', () => {
- // @gate experimental
it('text input', () => {
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
let input;
class ControlledInput extends React.Component {
@@ -538,9 +537,8 @@ describe('ChangeEventPlugin', () => {
expect(input.value).toBe('changed [!]');
});
- // @gate experimental
it('checkbox input', () => {
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
let input;
class ControlledInput extends React.Component {
@@ -594,9 +592,8 @@ describe('ChangeEventPlugin', () => {
expect(input.checked).toBe(false);
});
- // @gate experimental
it('textarea', () => {
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
let textarea;
class ControlledTextarea extends React.Component {
@@ -637,9 +634,8 @@ describe('ChangeEventPlugin', () => {
expect(textarea.value).toBe('changed [!]');
});
- // @gate experimental
it('parent of input', () => {
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
let input;
class ControlledInput extends React.Component {
@@ -684,9 +680,8 @@ describe('ChangeEventPlugin', () => {
expect(input.value).toBe('changed [!]');
});
- // @gate experimental
it('is sync for non-input events', async () => {
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
let input;
class ControlledInput extends React.Component {
@@ -731,12 +726,11 @@ describe('ChangeEventPlugin', () => {
expect(input.value).toBe('');
});
- // @gate experimental
it('mouse enter/leave should be user-blocking but not discrete', async () => {
const {unstable_concurrentAct: act} = TestUtils;
const {useState} = React;
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
const target = React.createRef(null);
function Foo() {
diff --git a/packages/react-dom/src/events/plugins/__tests__/SimpleEventPlugin-test.js b/packages/react-dom/src/events/plugins/__tests__/SimpleEventPlugin-test.js
index cb522ba1edf52..73c1e90f4ae5e 100644
--- a/packages/react-dom/src/events/plugins/__tests__/SimpleEventPlugin-test.js
+++ b/packages/react-dom/src/events/plugins/__tests__/SimpleEventPlugin-test.js
@@ -240,10 +240,9 @@ describe('SimpleEventPlugin', function() {
act = require('react-dom/test-utils').unstable_concurrentAct;
});
- // @gate experimental
it('flushes pending interactive work before exiting event handler', async () => {
container = document.createElement('div');
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
document.body.appendChild(container);
let button;
@@ -316,10 +315,9 @@ describe('SimpleEventPlugin', function() {
// NOTE: This test was written for the old behavior of discrete updates,
// where they would be async, but flushed early if another discrete update
// was dispatched.
- // @gate experimental
it('end result of many interactive updates is deterministic', async () => {
container = document.createElement('div');
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
document.body.appendChild(container);
let button;
diff --git a/packages/react-is/src/__tests__/ReactIs-test.js b/packages/react-is/src/__tests__/ReactIs-test.js
index 97c6e61e320f6..b6adc66b00b53 100644
--- a/packages/react-is/src/__tests__/ReactIs-test.js
+++ b/packages/react-is/src/__tests__/ReactIs-test.js
@@ -188,18 +188,10 @@ describe('ReactIs', () => {
it('should identify suspense list', () => {
expect(ReactIs.isValidElementType(React.SuspenseList)).toBe(true);
- expect(ReactIs.typeOf(
)).toBe(
- ReactIs.SuspenseList,
- );
- expect(
- ReactIs.isSuspenseList(
),
- ).toBe(true);
- expect(
- ReactIs.isSuspenseList({type: ReactIs.SuspenseList}),
- ).toBe(false);
- expect(ReactIs.isSuspenseList('React.SuspenseList')).toBe(
- false,
- );
+ expect(ReactIs.typeOf(
)).toBe(ReactIs.SuspenseList);
+ expect(ReactIs.isSuspenseList(
)).toBe(true);
+ expect(ReactIs.isSuspenseList({type: ReactIs.SuspenseList})).toBe(false);
+ expect(ReactIs.isSuspenseList('React.SuspenseList')).toBe(false);
expect(ReactIs.isSuspenseList(
)).toBe(false);
});
diff --git a/packages/react-reconciler/src/__tests__/ReactCache-test.js b/packages/react-reconciler/src/__tests__/ReactCache-test.js
index ef14b6588e4bb..33f4353649cab 100644
--- a/packages/react-reconciler/src/__tests__/ReactCache-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactCache-test.js
@@ -22,7 +22,7 @@ describe('ReactCache', () => {
Suspense = React.Suspense;
getCacheForType = React.unstable_getCacheForType;
useCacheRefresh = React.unstable_useCacheRefresh;
- startTransition = React.unstable_startTransition;
+ startTransition = React.startTransition;
useState = React.useState;
caches = [];
diff --git a/packages/react-reconciler/src/__tests__/ReactContextPropagation-test.js b/packages/react-reconciler/src/__tests__/ReactContextPropagation-test.js
index 7d72ea717d767..b84389228c7af 100644
--- a/packages/react-reconciler/src/__tests__/ReactContextPropagation-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactContextPropagation-test.js
@@ -19,7 +19,7 @@ describe('ReactLazyContextPropagation', () => {
useState = React.useState;
useContext = React.useContext;
Suspense = React.Suspense;
- SuspenseList = React.unstable_SuspenseList;
+ SuspenseList = React.SuspenseList;
getCacheForType = React.unstable_getCacheForType;
diff --git a/packages/react-reconciler/src/__tests__/ReactDisableSchedulerTimeoutBasedOnReactExpirationTime-test.internal.js b/packages/react-reconciler/src/__tests__/ReactDisableSchedulerTimeoutBasedOnReactExpirationTime-test.internal.js
index 599aabda72357..333196767b6e7 100644
--- a/packages/react-reconciler/src/__tests__/ReactDisableSchedulerTimeoutBasedOnReactExpirationTime-test.internal.js
+++ b/packages/react-reconciler/src/__tests__/ReactDisableSchedulerTimeoutBasedOnReactExpirationTime-test.internal.js
@@ -65,7 +65,7 @@ describe('ReactSuspenseList', () => {
expect(Scheduler).toFlushAndYield([]);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render(
);
});
} else {
diff --git a/packages/react-reconciler/src/__tests__/ReactExpiration-test.js b/packages/react-reconciler/src/__tests__/ReactExpiration-test.js
index 885ee46e1477d..627c06a82b537 100644
--- a/packages/react-reconciler/src/__tests__/ReactExpiration-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactExpiration-test.js
@@ -25,7 +25,7 @@ describe('ReactExpiration', () => {
React = require('react');
ReactNoop = require('react-noop-renderer');
Scheduler = require('scheduler');
- startTransition = React.unstable_startTransition;
+ startTransition = React.startTransition;
useState = React.useState;
useEffect = React.useEffect;
@@ -118,7 +118,7 @@ describe('ReactExpiration', () => {
// @gate experimental || !enableSyncDefaultUpdates
it('increases priority of updates as time progresses', () => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
);
});
} else {
@@ -166,7 +166,7 @@ describe('ReactExpiration', () => {
// First, show what happens for updates in two separate events.
// Schedule an update.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
);
});
} else {
@@ -228,7 +228,7 @@ describe('ReactExpiration', () => {
// First, show what happens for updates in two separate events.
// Schedule an update.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
);
});
} else {
@@ -307,7 +307,7 @@ describe('ReactExpiration', () => {
// Initial mount
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
);
});
} else {
@@ -326,7 +326,7 @@ describe('ReactExpiration', () => {
// Partial update
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
subscribers.forEach(s => s.setState({text: '1'}));
});
} else {
@@ -363,7 +363,7 @@ describe('ReactExpiration', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render(
);
});
} else {
@@ -398,7 +398,7 @@ describe('ReactExpiration', () => {
);
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render(
);
});
} else {
@@ -433,7 +433,7 @@ describe('ReactExpiration', () => {
ReactNoop = require('react-noop-renderer');
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render('Hi');
});
} else {
@@ -463,7 +463,7 @@ describe('ReactExpiration', () => {
Scheduler.unstable_advanceTime(10000);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render('Hi');
});
} else {
@@ -513,7 +513,7 @@ describe('ReactExpiration', () => {
// First demonstrate what happens when there's no starvation
await ReactNoop.act(async () => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
updateNormalPri();
});
} else {
@@ -537,7 +537,7 @@ describe('ReactExpiration', () => {
// Do the same thing, but starve the first update
await ReactNoop.act(async () => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
updateNormalPri();
});
} else {
@@ -701,7 +701,7 @@ describe('ReactExpiration', () => {
await ReactNoop.act(async () => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render(
);
});
} else {
diff --git a/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js b/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js
index a3df1effd7b35..e650f02c379bf 100644
--- a/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js
@@ -14,7 +14,7 @@ describe('ReactFlushSync', () => {
Scheduler = require('scheduler');
useState = React.useState;
useEffect = React.useEffect;
- startTransition = React.unstable_startTransition;
+ startTransition = React.startTransition;
});
function Text({text}) {
@@ -39,7 +39,7 @@ describe('ReactFlushSync', () => {
const root = ReactNoop.createRoot();
await ReactNoop.act(async () => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render(
);
});
} else {
diff --git a/packages/react-reconciler/src/__tests__/ReactHooksWithNoopRenderer-test.js b/packages/react-reconciler/src/__tests__/ReactHooksWithNoopRenderer-test.js
index 6758d9d4dc178..2530f2b8f9af1 100644
--- a/packages/react-reconciler/src/__tests__/ReactHooksWithNoopRenderer-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactHooksWithNoopRenderer-test.js
@@ -52,8 +52,8 @@ describe('ReactHooksWithNoopRenderer', () => {
useImperativeHandle = React.useImperativeHandle;
forwardRef = React.forwardRef;
memo = React.memo;
- useTransition = React.unstable_useTransition;
- useDeferredValue = React.unstable_useDeferredValue;
+ useTransition = React.useTransition;
+ useDeferredValue = React.useDeferredValue;
Suspense = React.Suspense;
act = ReactNoop.act;
ContinuousEventPriority = require('react-reconciler/constants')
@@ -166,7 +166,7 @@ describe('ReactHooksWithNoopRenderer', () => {
// Schedule some updates
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
// TODO: Batched updates need to be inside startTransition?
ReactNoop.batchedUpdates(() => {
counter.current.updateCount(1);
@@ -691,7 +691,6 @@ describe('ReactHooksWithNoopRenderer', () => {
expect(ReactNoop.getChildren()).toEqual([span(22)]);
});
- // @gate experimental || !enableSyncDefaultUpdates
it('discards render phase updates if something suspends', async () => {
const thenable = {then() {}};
function Foo({signal}) {
@@ -728,7 +727,7 @@ describe('ReactHooksWithNoopRenderer', () => {
expect(root).toMatchRenderedOutput(
);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render(
);
});
} else {
@@ -739,7 +738,7 @@ describe('ReactHooksWithNoopRenderer', () => {
// Rendering again should suspend again.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render(
);
});
} else {
@@ -748,7 +747,6 @@ describe('ReactHooksWithNoopRenderer', () => {
expect(Scheduler).toFlushAndYield(['Suspend!']);
});
- // @gate experimental || !enableSyncDefaultUpdates
it('discards render phase updates if something suspends, but not other updates in the same component', async () => {
const thenable = {then() {}};
function Foo({signal}) {
@@ -792,7 +790,7 @@ describe('ReactHooksWithNoopRenderer', () => {
await ReactNoop.act(async () => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render(
);
setLabel('B');
});
@@ -806,7 +804,7 @@ describe('ReactHooksWithNoopRenderer', () => {
// Rendering again should suspend again.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render(
);
});
} else {
@@ -817,7 +815,7 @@ describe('ReactHooksWithNoopRenderer', () => {
// Flip the signal back to "cancel" the update. However, the update to
// label should still proceed. It shouldn't have been dropped.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render(
);
});
} else {
@@ -870,7 +868,7 @@ describe('ReactHooksWithNoopRenderer', () => {
const [counter, setCounter] = useState(0);
if (counter === 0) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
setCounter(c => c + 1);
});
}
@@ -1315,7 +1313,6 @@ describe('ReactHooksWithNoopRenderer', () => {
});
});
- // @gate experimental || !enableSyncDefaultUpdates
it('does not warn about state updates for unmounted components with pending passive unmounts for alternates', () => {
let setParentState = null;
const setChildStates = [];
@@ -1383,7 +1380,7 @@ describe('ReactHooksWithNoopRenderer', () => {
// Schedule another update for children, and partially process it.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
setChildStates.forEach(setChildState => setChildState(2));
});
} else {
@@ -1707,7 +1704,7 @@ describe('ReactHooksWithNoopRenderer', () => {
// Rendering again should flush the previous commit's effects
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
, () =>
Scheduler.unstable_yieldValue('Sync effect'),
);
@@ -3694,9 +3691,8 @@ describe('ReactHooksWithNoopRenderer', () => {
]);
});
- // @gate experimental
it('regression: SuspenseList causes unmounts to be dropped on deletion', async () => {
- const SuspenseList = React.unstable_SuspenseList;
+ const SuspenseList = React.SuspenseList;
function Row({label}) {
useEffect(() => {
diff --git a/packages/react-reconciler/src/__tests__/ReactIncremental-test.js b/packages/react-reconciler/src/__tests__/ReactIncremental-test.js
index efcb4d7288875..7238d054e1a40 100644
--- a/packages/react-reconciler/src/__tests__/ReactIncremental-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactIncremental-test.js
@@ -67,7 +67,7 @@ describe('ReactIncremental', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
, () =>
Scheduler.unstable_yieldValue('callback'),
);
@@ -165,7 +165,7 @@ describe('ReactIncremental', () => {
expect(Scheduler).toFlushAndYield(['Foo', 'Bar', 'Bar']);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
);
});
} else {
@@ -178,7 +178,7 @@ describe('ReactIncremental', () => {
ReactNoop.flushSync(() => ReactNoop.render(null));
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
);
});
} else {
@@ -219,7 +219,7 @@ describe('ReactIncremental', () => {
expect(Scheduler).toFlushWithoutYielding();
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
inst.setState(
() => {
Scheduler.unstable_yieldValue('setState1');
@@ -244,7 +244,7 @@ describe('ReactIncremental', () => {
// This will abort the previous work and restart
ReactNoop.flushSync(() => ReactNoop.render(
));
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
inst.setState(
() => {
Scheduler.unstable_yieldValue('setState2');
@@ -1883,7 +1883,7 @@ describe('ReactIncremental', () => {
'ShowBoth {"locale":"de"}',
]);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
@@ -2033,7 +2033,7 @@ describe('ReactIncremental', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
@@ -2752,7 +2752,7 @@ describe('ReactIncremental', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -2779,7 +2779,7 @@ describe('ReactIncremental', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -2807,7 +2807,7 @@ describe('ReactIncremental', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
diff --git a/packages/react-reconciler/src/__tests__/ReactIncrementalErrorHandling-test.internal.js b/packages/react-reconciler/src/__tests__/ReactIncrementalErrorHandling-test.internal.js
index d26a433b6fa58..4d5a2aeeb7df5 100644
--- a/packages/react-reconciler/src/__tests__/ReactIncrementalErrorHandling-test.internal.js
+++ b/packages/react-reconciler/src/__tests__/ReactIncrementalErrorHandling-test.internal.js
@@ -92,7 +92,7 @@ describe('ReactIncrementalErrorHandling', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
@@ -205,7 +205,7 @@ describe('ReactIncrementalErrorHandling', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
@@ -285,12 +285,12 @@ describe('ReactIncrementalErrorHandling', () => {
Scheduler.unstable_yieldValue('commit');
}
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(, onCommit);
});
expect(Scheduler).toFlushAndYieldThrough(['error']);
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
// This update is in a separate batch
ReactNoop.render(, onCommit);
});
@@ -333,14 +333,14 @@ describe('ReactIncrementalErrorHandling', () => {
Scheduler.unstable_yieldValue('commit');
}
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(, onCommit);
});
expect(Scheduler).toFlushAndYieldThrough(['error']);
expect(ReactNoop).toMatchRenderedOutput(null);
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
// This update is in a separate batch
ReactNoop.render(, onCommit);
});
@@ -401,7 +401,7 @@ describe('ReactIncrementalErrorHandling', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(, () =>
Scheduler.unstable_yieldValue('commit'),
);
@@ -454,7 +454,7 @@ describe('ReactIncrementalErrorHandling', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -592,7 +592,7 @@ describe('ReactIncrementalErrorHandling', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
@@ -776,7 +776,7 @@ describe('ReactIncrementalErrorHandling', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
@@ -1853,7 +1853,7 @@ describe('ReactIncrementalErrorHandling', () => {
await ReactNoop.act(async () => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render();
});
} else {
@@ -1866,7 +1866,7 @@ describe('ReactIncrementalErrorHandling', () => {
// Interleaved update. When the root completes, instead of throwing the
// error, it should try rendering again. This update will cause it to
// recover gracefully.
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render('Everything is fine.');
});
});
@@ -1902,7 +1902,7 @@ describe('ReactIncrementalErrorHandling', () => {
await ReactNoop.act(async () => {
// Schedule a default pri and a low pri update on the root.
root.render();
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render();
});
diff --git a/packages/react-reconciler/src/__tests__/ReactIncrementalReflection-test.js b/packages/react-reconciler/src/__tests__/ReactIncrementalReflection-test.js
index def901c153a9e..4f3bcb5e96781 100644
--- a/packages/react-reconciler/src/__tests__/ReactIncrementalReflection-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactIncrementalReflection-test.js
@@ -65,7 +65,7 @@ describe('ReactIncrementalReflection', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -120,7 +120,7 @@ describe('ReactIncrementalReflection', () => {
expect(instances[0]._isMounted()).toBe(true);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -210,7 +210,7 @@ describe('ReactIncrementalReflection', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -250,7 +250,7 @@ describe('ReactIncrementalReflection', () => {
// The next step will render a new host node but won't get committed yet.
// We expect this to mutate the original Fiber.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -277,7 +277,7 @@ describe('ReactIncrementalReflection', () => {
// Render to null but don't commit it yet.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
diff --git a/packages/react-reconciler/src/__tests__/ReactIncrementalScheduling-test.js b/packages/react-reconciler/src/__tests__/ReactIncrementalScheduling-test.js
index 3126957b2318a..2dcc4e99b88ff 100644
--- a/packages/react-reconciler/src/__tests__/ReactIncrementalScheduling-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactIncrementalScheduling-test.js
@@ -109,7 +109,7 @@ describe('ReactIncrementalScheduling', () => {
// Schedule deferred work in the reverse order
ReactNoop.act(() => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.renderToRootWithID(, 'c');
ReactNoop.renderToRootWithID(, 'b');
});
@@ -126,7 +126,7 @@ describe('ReactIncrementalScheduling', () => {
// Schedule last bit of work, it will get processed the last
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.renderToRootWithID(, 'a');
});
} else {
@@ -186,7 +186,7 @@ describe('ReactIncrementalScheduling', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -206,7 +206,7 @@ describe('ReactIncrementalScheduling', () => {
]);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
instance.setState({tick: 2});
});
} else {
@@ -284,7 +284,7 @@ describe('ReactIncrementalScheduling', () => {
// Increment the tick to 2. This will trigger an update inside cDU. Flush
// the first update without flushing the second one.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
instance.setState({tick: 2});
});
@@ -334,7 +334,7 @@ describe('ReactIncrementalScheduling', () => {
}
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
diff --git a/packages/react-reconciler/src/__tests__/ReactIncrementalSideEffects-test.js b/packages/react-reconciler/src/__tests__/ReactIncrementalSideEffects-test.js
index fd819eeb32b46..bbf9a76f2859d 100644
--- a/packages/react-reconciler/src/__tests__/ReactIncrementalSideEffects-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactIncrementalSideEffects-test.js
@@ -411,7 +411,7 @@ describe('ReactIncrementalSideEffects', () => {
]);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -647,7 +647,7 @@ describe('ReactIncrementalSideEffects', () => {
return ;
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -662,7 +662,7 @@ describe('ReactIncrementalSideEffects', () => {
expect(ReactNoop.getChildrenAsJSX()).toEqual();
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -675,7 +675,7 @@ describe('ReactIncrementalSideEffects', () => {
// new props
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
diff --git a/packages/react-reconciler/src/__tests__/ReactIncrementalUpdates-test.js b/packages/react-reconciler/src/__tests__/ReactIncrementalUpdates-test.js
index a3fcf9dc7011d..ae489663b6131 100644
--- a/packages/react-reconciler/src/__tests__/ReactIncrementalUpdates-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactIncrementalUpdates-test.js
@@ -162,7 +162,7 @@ describe('ReactIncrementalUpdates', () => {
// Schedule some async updates
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
instance.setState(createUpdate('a'));
instance.setState(createUpdate('b'));
instance.setState(createUpdate('c'));
@@ -184,7 +184,7 @@ describe('ReactIncrementalUpdates', () => {
instance.setState(createUpdate('e'));
instance.setState(createUpdate('f'));
});
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
instance.setState(createUpdate('g'));
});
@@ -260,7 +260,7 @@ describe('ReactIncrementalUpdates', () => {
// Schedule some async updates
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
instance.setState(createUpdate('a'));
instance.setState(createUpdate('b'));
instance.setState(createUpdate('c'));
@@ -285,7 +285,7 @@ describe('ReactIncrementalUpdates', () => {
// reaching into the updater.
instance.updater.enqueueReplaceState(instance, createUpdate('f'));
});
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
instance.setState(createUpdate('g'));
});
@@ -561,7 +561,7 @@ describe('ReactIncrementalUpdates', () => {
ReactNoop.act(() => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -577,7 +577,7 @@ describe('ReactIncrementalUpdates', () => {
Scheduler.unstable_advanceTime(10000);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
setCount(2);
});
} else {
@@ -603,7 +603,7 @@ describe('ReactIncrementalUpdates', () => {
Scheduler.unstable_advanceTime(10000);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -621,7 +621,7 @@ describe('ReactIncrementalUpdates', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -634,7 +634,7 @@ describe('ReactIncrementalUpdates', () => {
Scheduler.unstable_advanceTime(10000);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -678,7 +678,7 @@ describe('ReactIncrementalUpdates', () => {
await ReactNoop.act(async () => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
pushToLog('A');
});
} else {
@@ -740,7 +740,7 @@ describe('ReactIncrementalUpdates', () => {
await ReactNoop.act(async () => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
pushToLog('A');
});
} else {
diff --git a/packages/react-reconciler/src/__tests__/ReactInterleavedUpdates-test.js b/packages/react-reconciler/src/__tests__/ReactInterleavedUpdates-test.js
index 271fe1ffb7c35..37640d8bdef24 100644
--- a/packages/react-reconciler/src/__tests__/ReactInterleavedUpdates-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactInterleavedUpdates-test.js
@@ -12,7 +12,7 @@ describe('ReactInterleavedUpdates', () => {
React = require('react');
ReactNoop = require('react-noop-renderer');
Scheduler = require('scheduler');
- startTransition = React.unstable_startTransition;
+ startTransition = React.startTransition;
useState = React.useState;
useEffect = React.useEffect;
});
@@ -57,7 +57,7 @@ describe('ReactInterleavedUpdates', () => {
await ReactNoop.act(async () => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
updateChildren(1);
});
} else {
@@ -69,7 +69,7 @@ describe('ReactInterleavedUpdates', () => {
// In an interleaved event, schedule an update on each of the children.
// Including the two that haven't rendered yet.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
updateChildren(2);
});
} else {
diff --git a/packages/react-reconciler/src/__tests__/ReactLazy-test.internal.js b/packages/react-reconciler/src/__tests__/ReactLazy-test.internal.js
index 215c83db2e25d..b062ad8ab94be 100644
--- a/packages/react-reconciler/src/__tests__/ReactLazy-test.internal.js
+++ b/packages/react-reconciler/src/__tests__/ReactLazy-test.internal.js
@@ -1475,7 +1475,6 @@ describe('ReactLazy', () => {
});
// @gate enableLazyElements
- // @gate experimental || !enableSyncDefaultUpdates
it('mount and reorder lazy elements', async () => {
class Child extends React.Component {
componentDidMount() {
@@ -1536,7 +1535,7 @@ describe('ReactLazy', () => {
// Swap the position of A and B
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.update();
});
} else {
diff --git a/packages/react-reconciler/src/__tests__/ReactNewContext-test.js b/packages/react-reconciler/src/__tests__/ReactNewContext-test.js
index f81a2131e0b9b..60db80402fb5e 100644
--- a/packages/react-reconciler/src/__tests__/ReactNewContext-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactNewContext-test.js
@@ -828,7 +828,6 @@ describe('ReactNewContext', () => {
);
});
- // @gate experimental || !enableSyncDefaultUpdates
it('warns if multiple renderers concurrently render the same context', () => {
spyOnDev(console, 'error');
const Context = React.createContext(0);
@@ -848,7 +847,7 @@ describe('ReactNewContext', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
diff --git a/packages/react-reconciler/src/__tests__/ReactSchedulerIntegration-test.js b/packages/react-reconciler/src/__tests__/ReactSchedulerIntegration-test.js
index 3c09935a5b7cc..ba2a3b094d0c6 100644
--- a/packages/react-reconciler/src/__tests__/ReactSchedulerIntegration-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactSchedulerIntegration-test.js
@@ -28,7 +28,7 @@ describe('ReactSchedulerIntegration', () => {
NormalPriority = Scheduler.unstable_NormalPriority;
IdlePriority = Scheduler.unstable_IdlePriority;
runWithPriority = Scheduler.unstable_runWithPriority;
- startTransition = React.unstable_startTransition;
+ startTransition = React.startTransition;
});
// Note: This is based on a similar component we use in www. We can delete
@@ -88,7 +88,6 @@ describe('ReactSchedulerIntegration', () => {
]);
});
- // @gate experimental || !enableSyncDefaultUpdates
it('requests a paint after committing', () => {
const scheduleCallback = Scheduler.unstable_scheduleCallback;
@@ -102,7 +101,7 @@ describe('ReactSchedulerIntegration', () => {
// Schedule a React render. React will request a paint after committing it.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render('Update');
});
} else {
@@ -203,7 +202,7 @@ describe(
React = require('react');
ReactNoop = require('react-noop-renderer');
Scheduler = require('scheduler');
- startTransition = React.unstable_startTransition;
+ startTransition = React.startTransition;
});
afterEach(() => {
diff --git a/packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js b/packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js
index e0fcab7a77cc0..b754b298a4437 100644
--- a/packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js
+++ b/packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js
@@ -96,7 +96,6 @@ describe('ReactSuspense', () => {
}
}
- // @gate experimental || !enableSyncDefaultUpdates
it('suspends rendering and continues later', () => {
function Bar(props) {
Scheduler.unstable_yieldValue('Bar');
@@ -128,7 +127,7 @@ describe('ReactSuspense', () => {
// Navigate the shell to now render the child content.
// This should suspend.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.update();
});
} else {
@@ -201,7 +200,6 @@ describe('ReactSuspense', () => {
expect(root).toMatchRenderedOutput('AB');
});
- // @gate experimental || !enableSyncDefaultUpdates
it('interrupts current render if promise resolves before current render phase', () => {
let didResolve = false;
const listeners = [];
@@ -244,7 +242,7 @@ describe('ReactSuspense', () => {
// The update will suspend.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.update(
<>
}>
@@ -331,7 +329,7 @@ describe('ReactSuspense', () => {
// Schedule another update. This will have lower priority because it's
// a transition.
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.update();
});
diff --git a/packages/react-reconciler/src/__tests__/ReactSuspenseList-test.js b/packages/react-reconciler/src/__tests__/ReactSuspenseList-test.js
index dfac720d4b255..f50b3a6a7e440 100644
--- a/packages/react-reconciler/src/__tests__/ReactSuspenseList-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactSuspenseList-test.js
@@ -14,7 +14,7 @@ describe('ReactSuspenseList', () => {
Scheduler = require('scheduler');
Profiler = React.Profiler;
Suspense = React.Suspense;
- SuspenseList = React.unstable_SuspenseList;
+ SuspenseList = React.SuspenseList;
});
function Text(props) {
@@ -40,7 +40,6 @@ describe('ReactSuspenseList', () => {
return Component;
}
- // @gate experimental
it('warns if an unsupported revealOrder option is used', () => {
function Foo() {
return (
@@ -60,7 +59,6 @@ describe('ReactSuspenseList', () => {
]);
});
- // @gate experimental
it('warns if a upper case revealOrder option is used', () => {
function Foo() {
return (
@@ -80,7 +78,6 @@ describe('ReactSuspenseList', () => {
]);
});
- // @gate experimental
it('warns if a misspelled revealOrder option is used', () => {
function Foo() {
return (
@@ -101,7 +98,6 @@ describe('ReactSuspenseList', () => {
]);
});
- // @gate experimental
it('warns if a single element is passed to a "forwards" list', () => {
function Foo({children}) {
return {children};
@@ -134,7 +130,6 @@ describe('ReactSuspenseList', () => {
]);
});
- // @gate experimental
it('warns if a single fragment is passed to a "backwards" list', () => {
function Foo() {
return (
@@ -155,7 +150,6 @@ describe('ReactSuspenseList', () => {
]);
});
- // @gate experimental
it('warns if a nested array is passed to a "forwards" list', () => {
function Foo({items}) {
return (
@@ -183,7 +177,6 @@ describe('ReactSuspenseList', () => {
]);
});
- // @gate experimental
it('shows content independently by default', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -250,7 +243,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('shows content independently in legacy mode regardless of option', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -321,7 +313,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('displays all "together"', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -391,7 +382,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('displays all "together" even when nested as siblings', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -477,7 +467,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('displays all "together" in nested SuspenseLists', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -539,7 +528,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('displays all "together" in nested SuspenseLists where the inner is default', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -599,7 +587,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('displays all "together" during an update', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -684,7 +671,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('avoided boundaries can be coordinate with SuspenseList', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -783,7 +769,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('displays each items in "forwards" order', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -849,7 +834,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('displays each items in "backwards" order', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -915,7 +899,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('displays added row at the top "together" and the bottom in "forwards" order', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -1070,7 +1053,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('displays added row at the top "together" and the bottom in "backwards" order', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -1255,7 +1237,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('switches to rendering fallbacks if the tail takes long CPU time', async () => {
function Foo() {
return (
@@ -1275,7 +1256,7 @@ describe('ReactSuspenseList', () => {
// This render is only CPU bound. Nothing suspends.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -1324,7 +1305,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('only shows one loading state at a time for "collapsed" tail insertions', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -1394,7 +1374,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('warns if an unsupported tail option is used', () => {
function Foo() {
return (
@@ -1415,7 +1394,6 @@ describe('ReactSuspenseList', () => {
]);
});
- // @gate experimental
it('warns if a tail option is used with "together"', () => {
function Foo() {
return (
@@ -1436,7 +1414,6 @@ describe('ReactSuspenseList', () => {
]);
});
- // @gate experimental
it('renders one "collapsed" fallback even if CPU time elapsed', async () => {
function Foo() {
return (
@@ -1459,7 +1436,7 @@ describe('ReactSuspenseList', () => {
// This render is only CPU bound. Nothing suspends.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -1509,7 +1486,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('adding to the middle does not collapse insertions (forwards)', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -1652,7 +1628,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('adding to the middle does not collapse insertions (backwards)', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -1800,7 +1775,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('adding to the middle of committed tail does not collapse insertions', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -1958,7 +1932,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('only shows no initial loading state "hidden" tail insertions', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -2022,7 +1995,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('eventually resolves a nested forwards suspense list', async () => {
const B = createAsyncText('B');
@@ -2085,7 +2057,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('eventually resolves a nested forwards suspense list with a hidden tail', async () => {
const B = createAsyncText('B');
@@ -2132,7 +2103,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('eventually resolves two nested forwards suspense lists with a hidden tail', async () => {
const B = createAsyncText('B');
@@ -2200,7 +2170,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('can do unrelated adjacent updates', async () => {
let updateAdjacent;
function Adjacent() {
@@ -2247,7 +2216,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('is able to re-suspend the last rows during an update with hidden', async () => {
const AsyncB = createAsyncText('B');
@@ -2336,7 +2304,6 @@ describe('ReactSuspenseList', () => {
expect(previousInst).toBe(setAsyncB);
});
- // @gate experimental
it('is able to re-suspend the last rows during an update with hidden', async () => {
const AsyncB = createAsyncText('B');
@@ -2425,7 +2392,6 @@ describe('ReactSuspenseList', () => {
expect(previousInst).toBe(setAsyncB);
});
- // @gate experimental
it('is able to interrupt a partially rendered tree and continue later', async () => {
const AsyncA = createAsyncText('A');
@@ -2462,7 +2428,7 @@ describe('ReactSuspenseList', () => {
await ReactNoop.act(async () => {
// Add a few items at the end.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
updateLowPri(true);
});
} else {
@@ -2504,7 +2470,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('can resume class components when revealed together', async () => {
const A = createAsyncText('A');
const B = createAsyncText('B');
@@ -2567,7 +2532,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('should be able to progressively show CPU expensive rows with two pass rendering', async () => {
function TwoPass({text}) {
const [pass, setPass] = React.useState(0);
@@ -2605,7 +2569,7 @@ describe('ReactSuspenseList', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -2638,7 +2602,6 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental
it('should be able to progressively show rows with two pass rendering and visible', async () => {
function TwoPass({text}) {
const [pass, setPass] = React.useState(0);
@@ -2678,7 +2641,7 @@ describe('ReactSuspenseList', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -2720,7 +2683,7 @@ describe('ReactSuspenseList', () => {
);
});
- // @gate experimental && enableProfilerTimer
+ // @gate enableProfilerTimer
it('counts the actual duration when profiling a SuspenseList', async () => {
// Order of parameters: id, phase, actualDuration, treeBaseDuration
const onRender = jest.fn();
diff --git a/packages/react-reconciler/src/__tests__/ReactSuspenseWithNoopRenderer-test.js b/packages/react-reconciler/src/__tests__/ReactSuspenseWithNoopRenderer-test.js
index 668299b282b9b..54eb1683e0e2e 100644
--- a/packages/react-reconciler/src/__tests__/ReactSuspenseWithNoopRenderer-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactSuspenseWithNoopRenderer-test.js
@@ -212,7 +212,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -284,7 +284,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// The update will suspend.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -354,7 +354,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(Scheduler).toFlushAndYield([]);
// B suspends. Continue rendering the remaining siblings.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
}>
@@ -401,7 +401,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// TODO: Delete this feature flag.
// @gate !replayFailedUnitOfWorkWithInvokeGuardedCallback || !__DEV__
// @gate enableCache
- // @gate experimental || !enableSyncDefaultUpdates
+ // @gate !enableSyncDefaultUpdates
it('retries on error', async () => {
class ErrorBoundary extends React.Component {
state = {error: null};
@@ -437,7 +437,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(ReactNoop.getChildren()).toEqual([]);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -567,7 +567,6 @@ describe('ReactSuspenseWithNoopRenderer', () => {
});
// @gate enableCache
- // @gate experimental || !enableSyncDefaultUpdates
it('keeps working on lower priority work after being pinged', async () => {
// Advance the virtual time so that we're close to the edge of a bucket.
ReactNoop.expire(149);
@@ -586,7 +585,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(ReactNoop.getChildren()).toEqual([]);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -599,7 +598,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// but not enough to expire the suspense timeout.
ReactNoop.expire(120);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -630,7 +629,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// Default pri
ReactNoop.render();
// Low pri
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
@@ -647,7 +646,6 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// times model. Might not make sense in the new model.
// TODO: This test doesn't over what it was originally designed to test.
// Either rewrite or delete.
- // @gate experimental || !enableSyncDefaultUpdates
it('tries each subsequent level after suspending', async () => {
const root = ReactNoop.createRoot();
@@ -683,7 +681,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// Schedule an update at several distinct expiration times
await ReactNoop.act(async () => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render();
});
} else {
@@ -694,7 +692,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
interrupt();
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render();
});
} else {
@@ -705,7 +703,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
interrupt();
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render();
});
} else {
@@ -928,7 +926,6 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(ReactNoop.getChildren()).toEqual([span('Async'), span('Sync')]);
});
- // @gate experimental
it('does not expire for transitions', async () => {
ReactNoop.render(
@@ -937,7 +934,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
);
expect(Scheduler).toFlushAndYield([]);
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
}>
@@ -984,7 +981,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(Scheduler).toFlushAndYield([]);
expect(ReactNoop.getChildren()).toEqual([]);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
<>
}>
@@ -1051,7 +1048,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(Scheduler).toFlushAndYield([]);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
}>
@@ -1075,7 +1072,6 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(ReactNoop.getChildren()).toEqual([span('Async')]);
});
- // @gate experimental
// @gate enableCache
it('starts working on an update even if its priority falls between two suspended levels', async () => {
function App(props) {
@@ -1096,7 +1092,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(Scheduler).toFlushAndYield(['S']);
// Schedule an update, and suspend for up to 5 seconds.
- React.unstable_startTransition(() => ReactNoop.render());
+ React.startTransition(() => ReactNoop.render());
// The update should suspend.
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
expect(ReactNoop.getChildren()).toEqual([span('S')]);
@@ -1108,7 +1104,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(ReactNoop.getChildren()).toEqual([span('S')]);
// Schedule another low priority update.
- React.unstable_startTransition(() => ReactNoop.render());
+ React.startTransition(() => ReactNoop.render());
// This update should also suspend.
expect(Scheduler).toFlushAndYield(['Suspend! [B]', 'Loading...']);
expect(ReactNoop.getChildren()).toEqual([span('S')]);
@@ -1857,7 +1853,6 @@ describe('ReactSuspenseWithNoopRenderer', () => {
});
// @gate enableCache
- // @gate experimental || !enableSyncDefaultUpdates
it('suspends for longer if something took a long (CPU bound) time to render', async () => {
function Foo({renderContent}) {
Scheduler.unstable_yieldValue('Foo');
@@ -1872,7 +1867,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(Scheduler).toFlushAndYield(['Foo']);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -2044,7 +2039,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(Scheduler).toFlushAndYield(['Foo']);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -2365,7 +2360,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(ReactNoop.getChildren()).toEqual([span('A')]);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
} else {
@@ -2445,7 +2440,6 @@ describe('ReactSuspenseWithNoopRenderer', () => {
});
describe('startTransition', () => {
- // @gate experimental
// @gate enableCache
it('top level render', async () => {
function App({page}) {
@@ -2457,7 +2451,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
}
// Initial render.
- React.unstable_startTransition(() => ReactNoop.render());
+ React.startTransition(() => ReactNoop.render());
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
// Only a short time is needed to unsuspend the initial loading state.
@@ -2471,7 +2465,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(ReactNoop.getChildren()).toEqual([span('A')]);
// Start transition.
- React.unstable_startTransition(() => ReactNoop.render());
+ React.startTransition(() => ReactNoop.render());
expect(Scheduler).toFlushAndYield(['Suspend! [B]', 'Loading...']);
Scheduler.unstable_advanceTime(100000);
@@ -2485,7 +2479,6 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(ReactNoop.getChildren()).toEqual([span('B')]);
});
- // @gate experimental
// @gate enableCache
it('hooks', async () => {
let transitionToPage;
@@ -2507,7 +2500,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// Initial render.
await ReactNoop.act(async () => {
- React.unstable_startTransition(() => transitionToPage('A'));
+ React.startTransition(() => transitionToPage('A'));
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
// Only a short time is needed to unsuspend the initial loading state.
@@ -2523,7 +2516,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// Start transition.
await ReactNoop.act(async () => {
- React.unstable_startTransition(() => transitionToPage('B'));
+ React.startTransition(() => transitionToPage('B'));
expect(Scheduler).toFlushAndYield(['Suspend! [B]', 'Loading...']);
Scheduler.unstable_advanceTime(100000);
@@ -2538,7 +2531,6 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(ReactNoop.getChildren()).toEqual([span('B')]);
});
- // @gate experimental
// @gate enableCache
it('classes', async () => {
let transitionToPage;
@@ -2563,7 +2555,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// Initial render.
await ReactNoop.act(async () => {
- React.unstable_startTransition(() => transitionToPage('A'));
+ React.startTransition(() => transitionToPage('A'));
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
// Only a short time is needed to unsuspend the initial loading state.
@@ -2579,7 +2571,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// Start transition.
await ReactNoop.act(async () => {
- React.unstable_startTransition(() => transitionToPage('B'));
+ React.startTransition(() => transitionToPage('B'));
expect(Scheduler).toFlushAndYield(['Suspend! [B]', 'Loading...']);
Scheduler.unstable_advanceTime(100000);
@@ -2596,7 +2588,6 @@ describe('ReactSuspenseWithNoopRenderer', () => {
});
describe('delays transitions when using React.startTranistion', () => {
- // @gate experimental
// @gate enableCache
it('top level render', async () => {
function App({page}) {
@@ -2608,7 +2599,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
}
// Initial render.
- React.unstable_startTransition(() => ReactNoop.render());
+ React.startTransition(() => ReactNoop.render());
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
// Only a short time is needed to unsuspend the initial loading state.
@@ -2622,7 +2613,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(ReactNoop.getChildren()).toEqual([span('A')]);
// Start transition.
- React.unstable_startTransition(() => ReactNoop.render());
+ React.startTransition(() => ReactNoop.render());
expect(Scheduler).toFlushAndYield(['Suspend! [B]', 'Loading...']);
Scheduler.unstable_advanceTime(2999);
@@ -2637,7 +2628,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(ReactNoop.getChildren()).toEqual([span('B')]);
// Start a long (infinite) transition.
- React.unstable_startTransition(() => ReactNoop.render());
+ React.startTransition(() => ReactNoop.render());
expect(Scheduler).toFlushAndYield(['Suspend! [C]', 'Loading...']);
// Even after lots of time has passed, we have still not yet flushed the
@@ -2647,7 +2638,6 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(ReactNoop.getChildren()).toEqual([span('B')]);
});
- // @gate experimental
// @gate enableCache
it('hooks', async () => {
let transitionToPage;
@@ -2669,7 +2659,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// Initial render.
await ReactNoop.act(async () => {
- React.unstable_startTransition(() => transitionToPage('A'));
+ React.startTransition(() => transitionToPage('A'));
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
// Only a short time is needed to unsuspend the initial loading state.
@@ -2685,7 +2675,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// Start transition.
await ReactNoop.act(async () => {
- React.unstable_startTransition(() => transitionToPage('B'));
+ React.startTransition(() => transitionToPage('B'));
expect(Scheduler).toFlushAndYield(['Suspend! [B]', 'Loading...']);
@@ -2703,7 +2693,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// Start a long (infinite) transition.
await ReactNoop.act(async () => {
- React.unstable_startTransition(() => transitionToPage('C'));
+ React.startTransition(() => transitionToPage('C'));
expect(Scheduler).toFlushAndYield(['Suspend! [C]', 'Loading...']);
@@ -2715,7 +2705,6 @@ describe('ReactSuspenseWithNoopRenderer', () => {
});
});
- // @gate experimental
// @gate enableCache
it('classes', async () => {
let transitionToPage;
@@ -2740,7 +2729,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// Initial render.
await ReactNoop.act(async () => {
- React.unstable_startTransition(() => transitionToPage('A'));
+ React.startTransition(() => transitionToPage('A'));
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
// Only a short time is needed to unsuspend the initial loading state.
@@ -2756,7 +2745,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// Start transition.
await ReactNoop.act(async () => {
- React.unstable_startTransition(() => transitionToPage('B'));
+ React.startTransition(() => transitionToPage('B'));
expect(Scheduler).toFlushAndYield(['Suspend! [B]', 'Loading...']);
Scheduler.unstable_advanceTime(2999);
@@ -2773,7 +2762,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// Start a long (infinite) transition.
await ReactNoop.act(async () => {
- React.unstable_startTransition(() => transitionToPage('C'));
+ React.startTransition(() => transitionToPage('C'));
expect(Scheduler).toFlushAndYield(['Suspend! [C]', 'Loading...']);
@@ -2786,7 +2775,6 @@ describe('ReactSuspenseWithNoopRenderer', () => {
});
});
- // @gate experimental
// @gate enableCache
it('do not show placeholder when updating an avoided boundary with startTransition', async () => {
function App({page}) {
@@ -2810,7 +2798,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(ReactNoop.getChildren()).toEqual([span('Hi!'), span('A')]);
// Start transition.
- React.unstable_startTransition(() => ReactNoop.render());
+ React.startTransition(() => ReactNoop.render());
expect(Scheduler).toFlushAndYield(['Hi!', 'Suspend! [B]', 'Loading B...']);
@@ -2831,7 +2819,6 @@ describe('ReactSuspenseWithNoopRenderer', () => {
);
});
- // @gate experimental
// @gate enableCache
it('do not show placeholder when mounting an avoided boundary with startTransition', async () => {
function App({page}) {
@@ -2857,7 +2844,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(ReactNoop.getChildren()).toEqual([span('Hi!'), span('A')]);
// Start transition.
- React.unstable_startTransition(() => ReactNoop.render());
+ React.startTransition(() => ReactNoop.render());
expect(Scheduler).toFlushAndYield(['Hi!', 'Suspend! [B]', 'Loading B...']);
@@ -2913,7 +2900,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// Update. Since showing a fallback would hide content that's already
// visible, it should suspend for a JND without committing.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render();
});
} else {
@@ -2926,7 +2913,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// Update again. This should also suspend for a JND.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render();
});
} else {
@@ -2992,7 +2979,6 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(root).toMatchRenderedOutput();
});
- // @gate experimental
// @gate enableCache
it('should not render hidden content while suspended on higher pri', async () => {
function Offscreen() {
@@ -3021,7 +3007,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(ReactNoop).toMatchRenderedOutput();
// Start transition.
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
@@ -3043,7 +3029,6 @@ describe('ReactSuspenseWithNoopRenderer', () => {
);
});
- // @gate experimental
// @gate enableCache
it('should be able to unblock higher pri content before suspended hidden', async () => {
function Offscreen() {
@@ -3074,7 +3059,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
expect(Scheduler).toFlushAndYieldThrough(['Suspend! [A]']);
// Start transition.
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
@@ -3272,7 +3257,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
// update even though the primary tree is suspended.
await ReactNoop.act(async () => {
setAppText('C');
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
setFallbackText('Still loading...');
});
});
@@ -3705,11 +3690,10 @@ describe('ReactSuspenseWithNoopRenderer', () => {
);
});
- // @gate experimental
// @gate enableCache
// @gate !enableSyncDefaultUpdates
it('regression: ping at high priority causes update to be dropped', async () => {
- const {useState, unstable_useTransition: useTransition} = React;
+ const {useState, useTransition} = React;
let setTextA;
function A() {
@@ -3818,15 +3802,14 @@ describe('ReactSuspenseWithNoopRenderer', () => {
});
// Regression: https://github.com/facebook/react/issues/18486
- // @gate experimental
// @gate enableCache
it('does not get stuck in pending state with render phase updates', async () => {
let setTextWithShortTransition;
let setTextWithLongTransition;
function App() {
- const [isPending1, startShortTransition] = React.unstable_useTransition();
- const [isPending2, startLongTransition] = React.unstable_useTransition();
+ const [isPending1, startShortTransition] = React.useTransition();
+ const [isPending2, startLongTransition] = React.useTransition();
const isPending = isPending1 || isPending2;
const [text, setText] = React.useState('');
const [mirror, setMirror] = React.useState('');
diff --git a/packages/react-reconciler/src/__tests__/ReactTransition-test.js b/packages/react-reconciler/src/__tests__/ReactTransition-test.js
index 71c40cefebe8a..12d8db8548b1c 100644
--- a/packages/react-reconciler/src/__tests__/ReactTransition-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactTransition-test.js
@@ -32,9 +32,9 @@ describe('ReactTransition', () => {
Scheduler = require('scheduler');
useState = React.useState;
useLayoutEffect = React.useLayoutEffect;
- useTransition = React.unstable_useTransition;
+ useTransition = React.useTransition;
Suspense = React.Suspense;
- startTransition = React.unstable_startTransition;
+ startTransition = React.startTransition;
getCacheForType = React.unstable_getCacheForType;
act = ReactNoop.act;
@@ -158,7 +158,6 @@ describe('ReactTransition', () => {
}
}
- // @gate experimental
// @gate enableCache
test('isPending works even if called from outside an input event', async () => {
let start;
@@ -200,7 +199,6 @@ describe('ReactTransition', () => {
expect(root).toMatchRenderedOutput('Async');
});
- // @gate experimental
// @gate enableCache
test(
'when multiple transitions update the same queue, only the most recent ' +
@@ -320,7 +318,6 @@ describe('ReactTransition', () => {
);
// Same as previous test, but for class update queue.
- // @gate experimental
// @gate enableCache
test(
'when multiple transitions update the same queue, only the most recent ' +
@@ -445,7 +442,6 @@ describe('ReactTransition', () => {
},
);
- // @gate experimental
// @gate enableCache
test(
'when multiple transitions update overlapping queues, all the transitions ' +
@@ -551,7 +547,6 @@ describe('ReactTransition', () => {
},
);
- // @gate experimental
// @gate enableCache
test('interrupt a refresh transition if a new transition is scheduled', async () => {
const root = ReactNoop.createRoot();
@@ -607,7 +602,6 @@ describe('ReactTransition', () => {
expect(root).toMatchRenderedOutput('Updated');
});
- // @gate experimental
// @gate enableCache
test(
"interrupt a refresh transition when something suspends and we've " +
@@ -669,7 +663,7 @@ describe('ReactTransition', () => {
expect(Scheduler).toFlushAndYieldThrough(['A']);
// Now schedule a second transition. We won't interrupt the first one.
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
setShouldHideInParent(true);
});
// Continue rendering the first transition.
@@ -710,7 +704,6 @@ describe('ReactTransition', () => {
},
);
- // @gate experimental
// @gate enableCache
test(
'interrupt a refresh transition when something suspends and a parent ' +
@@ -776,7 +769,6 @@ describe('ReactTransition', () => {
},
);
- // @gate experimental
// @gate enableCache
it('should render normal pri updates scheduled after transitions before transitions', async () => {
let updateTransitionPri;
@@ -833,7 +825,6 @@ describe('ReactTransition', () => {
expect(root).toMatchRenderedOutput('Transition pri: 1, Normal pri: 1');
});
- // @gate experimental
// @gate enableCache
it('should render normal pri updates before transition suspense retries', async () => {
let updateTransitionPri;
@@ -898,7 +889,6 @@ describe('ReactTransition', () => {
expect(root).toMatchRenderedOutput('Async, Normal pri: 1');
});
- // @gate experimental
// @gate enableCache
it('should not interrupt transitions with normal pri updates', async () => {
let updateNormalPri;
diff --git a/packages/react-reconciler/src/__tests__/ReactUpdatePriority-test.js b/packages/react-reconciler/src/__tests__/ReactUpdatePriority-test.js
index 116cc4c4d8e00..918dd97983366 100644
--- a/packages/react-reconciler/src/__tests__/ReactUpdatePriority-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactUpdatePriority-test.js
@@ -15,7 +15,7 @@ describe('ReactUpdatePriority', () => {
Scheduler = require('scheduler');
ContinuousEventPriority = require('react-reconciler/constants')
.ContinuousEventPriority;
- startTransition = React.unstable_startTransition;
+ startTransition = React.startTransition;
useState = React.useState;
useEffect = React.useEffect;
});
@@ -84,7 +84,6 @@ describe('ReactUpdatePriority', () => {
expect(Scheduler).toHaveYielded(['Idle: 2, Default: 2']);
});
- // @gate experimental
test('continuous updates should interrupt transisions', async () => {
const root = ReactNoop.createRoot();
diff --git a/packages/react-reconciler/src/__tests__/ReactUpdaters-test.internal.js b/packages/react-reconciler/src/__tests__/ReactUpdaters-test.internal.js
index 248223e349464..181b243c5cf65 100644
--- a/packages/react-reconciler/src/__tests__/ReactUpdaters-test.internal.js
+++ b/packages/react-reconciler/src/__tests__/ReactUpdaters-test.internal.js
@@ -153,7 +153,6 @@ describe('updaters', () => {
expect(allSchedulerTypes).toEqual([[null], [SchedulingComponent]]);
});
- // @gate experimental
it('should cover cascading updates', async () => {
let triggerActiveCascade = null;
let triggerPassiveCascade = null;
@@ -183,7 +182,7 @@ describe('updaters', () => {
return count;
};
- const root = ReactDOM.unstable_createRoot(document.createElement('div'));
+ const root = ReactDOM.createRoot(document.createElement('div'));
await ReactTestUtils.act(async () => {
root.render();
expect(Scheduler).toFlushAndYieldThrough([
@@ -292,7 +291,6 @@ describe('updaters', () => {
done();
});
- // @gate experimental
it('should cover error handling', async () => {
let triggerError = null;
@@ -329,7 +327,7 @@ describe('updaters', () => {
throw new Error('Hello');
};
- const root = ReactDOM.unstable_createRoot(document.createElement('div'));
+ const root = ReactDOM.createRoot(document.createElement('div'));
await ReactTestUtils.act(async () => {
root.render();
});
@@ -349,7 +347,6 @@ describe('updaters', () => {
Scheduler.unstable_flushAll();
});
- // @gate experimental
it('should distinguish between updaters in the case of interleaved work', async () => {
const {
FunctionComponent,
@@ -368,7 +365,7 @@ describe('updaters', () => {
const LowPriorityUpdater = () => {
const [count, setCount] = React.useState(0);
triggerLowPriorityUpdate = () => {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
setCount(prevCount => prevCount + 1);
});
};
@@ -380,7 +377,7 @@ describe('updaters', () => {
return null;
};
- const root = ReactDOM.unstable_createRoot(document.createElement('div'));
+ const root = ReactDOM.createRoot(document.createElement('div'));
root.render(
diff --git a/packages/react-reconciler/src/__tests__/SchedulingProfiler-test.internal.js b/packages/react-reconciler/src/__tests__/SchedulingProfiler-test.internal.js
index 4240b363330cd..77e7726a18a1d 100644
--- a/packages/react-reconciler/src/__tests__/SchedulingProfiler-test.internal.js
+++ b/packages/react-reconciler/src/__tests__/SchedulingProfiler-test.internal.js
@@ -149,7 +149,6 @@ describe('SchedulingProfiler', () => {
});
// @gate enableSchedulingProfiler
- // @gate experimental || !enableSyncDefaultUpdates
it('should mark render yields', async () => {
function Bar() {
Scheduler.unstable_yieldValue('Bar');
@@ -162,7 +161,7 @@ describe('SchedulingProfiler', () => {
}
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render();
});
diff --git a/packages/react-reconciler/src/__tests__/useMutableSource-test.internal.js b/packages/react-reconciler/src/__tests__/useMutableSource-test.internal.js
index 5cc884d57fa59..a54bd46c84fde 100644
--- a/packages/react-reconciler/src/__tests__/useMutableSource-test.internal.js
+++ b/packages/react-reconciler/src/__tests__/useMutableSource-test.internal.js
@@ -31,8 +31,8 @@ function loadModules() {
ReactNoop = require('react-noop-renderer');
Scheduler = require('scheduler');
act = ReactNoop.act;
- createMutableSource = React.unstable_createMutableSource;
- useMutableSource = React.unstable_useMutableSource;
+ createMutableSource = React.createMutableSource;
+ useMutableSource = React.useMutableSource;
}
describe('useMutableSource', () => {
@@ -206,14 +206,13 @@ describe('useMutableSource', () => {
});
});
- // @gate experimental
it('should restart work if a new source is mutated during render', () => {
const source = createSource('one');
const mutableSource = createMutableSource(source, param => param.version);
act(() => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
<>
{
});
});
- // @gate experimental
it('should re-use previously read snapshot value when reading is unsafe', () => {
const source = createSource('one');
const mutableSource = createMutableSource(source, param => param.version);
@@ -452,7 +450,7 @@ describe('useMutableSource', () => {
// Changing values should schedule an update with React.
// Start working on this update but don't finish it.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
source.value = 'two';
});
} else {
@@ -694,7 +692,6 @@ describe('useMutableSource', () => {
});
});
- // @gate experimental
it('should detect tearing in part of the store not yet subscribed to', () => {
const source = createComplexSource('a:one', 'b:one');
const mutableSource = createMutableSource(source, param => param.version);
@@ -722,7 +719,7 @@ describe('useMutableSource', () => {
// Because the store has not changed yet, there are no pending updates,
// so it is considered safe to read from when we start this render.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
<>
{
});
});
- // @gate experimental
it('should recover from a mutation during yield when other work is scheduled', () => {
const source = createSource('one');
const mutableSource = createMutableSource(source, param => param.version);
@@ -863,7 +859,7 @@ describe('useMutableSource', () => {
act(() => {
// Start a render that uses the mutable source.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
<>
{
await act(async () => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render(
<>
@@ -1563,7 +1559,7 @@ describe('useMutableSource', () => {
// read during render will happen to match the latest value. But it should
// still entangle the updates to prevent the previous update (a1) from
// rendering by itself.
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
mutateA('a0');
mutateB('b0');
});
@@ -1680,7 +1676,7 @@ describe('useMutableSource', () => {
await act(async () => {
// Switch the parent and the child to read using the same config
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render();
});
} else {
@@ -1692,7 +1688,7 @@ describe('useMutableSource', () => {
// Mutate the config. This is at lower priority so that 1) to make sure
// it doesn't happen to get batched with the in-progress render, and 2)
// so it doesn't interrupt the in-progress render.
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
source.valueB = '3';
});
@@ -1802,7 +1798,7 @@ describe('useMutableSource', () => {
expect(source.listenerCount).toBe(1);
// Mutate -> schedule update for ComponentA
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
source.value = 'two';
});
@@ -1971,7 +1967,7 @@ describe('useMutableSource', () => {
act(() => {
// Start a render that uses the mutable source.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
<>
{
act(() => {
// Start a render that uses the mutable source.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactNoop.render(
<>
{
Scheduler = require('scheduler');
act = require('react-dom/test-utils').unstable_concurrentAct;
- createMutableSource = React.unstable_createMutableSource;
- useMutableSource = React.unstable_useMutableSource;
+ createMutableSource = React.createMutableSource;
+ useMutableSource = React.useMutableSource;
});
function dispatchAndSetCurrentEvent(el, event) {
@@ -140,7 +140,6 @@ describe('useMutableSourceHydration', () => {
return {`${label}:${snapshot}`}
;
}
- // @gate experimental
it('should render and hydrate', () => {
const source = createSource('one');
const mutableSource = createMutableSource(source, param => param.version);
@@ -164,7 +163,7 @@ describe('useMutableSourceHydration', () => {
expect(Scheduler).toHaveYielded(['only:one']);
expect(source.listenerCount).toBe(0);
- const root = ReactDOM.unstable_createRoot(container, {
+ const root = ReactDOM.createRoot(container, {
hydrate: true,
hydrationOptions: {
mutableSources: [mutableSource],
@@ -177,7 +176,6 @@ describe('useMutableSourceHydration', () => {
expect(source.listenerCount).toBe(1);
});
- // @gate experimental
it('should detect a tear before hydrating a component', () => {
const source = createSource('one');
const mutableSource = createMutableSource(source, param => param.version);
@@ -201,7 +199,7 @@ describe('useMutableSourceHydration', () => {
expect(Scheduler).toHaveYielded(['only:one']);
expect(source.listenerCount).toBe(0);
- const root = ReactDOM.unstable_createRoot(container, {
+ const root = ReactDOM.createRoot(container, {
hydrate: true,
hydrationOptions: {
mutableSources: [mutableSource],
@@ -222,7 +220,6 @@ describe('useMutableSourceHydration', () => {
expect(source.listenerCount).toBe(1);
});
- // @gate experimental
it('should detect a tear between hydrating components', () => {
const source = createSource('one');
const mutableSource = createMutableSource(source, param => param.version);
@@ -254,7 +251,7 @@ describe('useMutableSourceHydration', () => {
expect(Scheduler).toHaveYielded(['a:one', 'b:one']);
expect(source.listenerCount).toBe(0);
- const root = ReactDOM.unstable_createRoot(container, {
+ const root = ReactDOM.createRoot(container, {
hydrate: true,
hydrationOptions: {
mutableSources: [mutableSource],
@@ -263,7 +260,7 @@ describe('useMutableSourceHydration', () => {
expect(() => {
act(() => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render();
});
} else {
@@ -281,7 +278,6 @@ describe('useMutableSourceHydration', () => {
expect(source.listenerCount).toBe(2);
});
- // @gate experimental
it('should detect a tear between hydrating components reading from different parts of a source', () => {
const source = createComplexSource('a:one', 'b:one');
const mutableSource = createMutableSource(source, param => param.version);
@@ -314,7 +310,7 @@ describe('useMutableSourceHydration', () => {
container.innerHTML = htmlString;
expect(Scheduler).toHaveYielded(['0:a:one', '1:b:one']);
- const root = ReactDOM.unstable_createRoot(container, {
+ const root = ReactDOM.createRoot(container, {
hydrate: true,
hydrationOptions: {
mutableSources: [mutableSource],
@@ -323,7 +319,7 @@ describe('useMutableSourceHydration', () => {
expect(() => {
act(() => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render(
<>
{
expect(Scheduler).toHaveYielded(['0:a:one', '1:b:two']);
});
- // @gate experimental
// @gate !enableSyncDefaultUpdates
it('should detect a tear during a higher priority interruption', () => {
const source = createSource('one');
@@ -405,7 +400,7 @@ describe('useMutableSourceHydration', () => {
expect(Scheduler).toHaveYielded([1, 'a:one']);
expect(source.listenerCount).toBe(0);
- const root = ReactDOM.unstable_createRoot(container, {
+ const root = ReactDOM.createRoot(container, {
hydrate: true,
hydrationOptions: {
mutableSources: [mutableSource],
@@ -415,7 +410,7 @@ describe('useMutableSourceHydration', () => {
expect(() => {
act(() => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.render();
});
} else {
diff --git a/packages/react-refresh/src/__tests__/ReactFresh-test.js b/packages/react-refresh/src/__tests__/ReactFresh-test.js
index 1f83a84d83dc2..b1af94c2a54f3 100644
--- a/packages/react-refresh/src/__tests__/ReactFresh-test.js
+++ b/packages/react-refresh/src/__tests__/ReactFresh-test.js
@@ -2409,8 +2409,9 @@ describe('ReactFresh', () => {
}
});
+ // @gate experimental
it('can hot reload offscreen components', async () => {
- if (__DEV__ && __EXPERIMENTAL__) {
+ if (__DEV__) {
const AppV1 = prepare(() => {
function Hello() {
React.useLayoutEffect(() => {
@@ -2437,7 +2438,7 @@ describe('ReactFresh', () => {
};
});
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
root.render();
expect(Scheduler).toFlushAndYieldThrough(['App#layout']);
const el = container.firstChild;
diff --git a/packages/react-server-dom-relay/src/__tests__/ReactFlightDOMRelay-test.internal.js b/packages/react-server-dom-relay/src/__tests__/ReactFlightDOMRelay-test.internal.js
index e63a357b31da8..64a3d7645f173 100644
--- a/packages/react-server-dom-relay/src/__tests__/ReactFlightDOMRelay-test.internal.js
+++ b/packages/react-server-dom-relay/src/__tests__/ReactFlightDOMRelay-test.internal.js
@@ -72,7 +72,6 @@ describe('ReactFlightDOMRelay', () => {
});
});
- // @gate experimental
it('can render a client component using a module reference and render there', () => {
function UserClient(props) {
return (
@@ -105,7 +104,6 @@ describe('ReactFlightDOMRelay', () => {
expect(container.innerHTML).toEqual('Hello, Seb Smith');
});
- // @gate experimental
it('can reasonably handle different element types', () => {
const {
forwardRef,
diff --git a/packages/react-server-dom-webpack/src/__tests__/ReactFlightDOM-test.js b/packages/react-server-dom-webpack/src/__tests__/ReactFlightDOM-test.js
index a768b0cf0bb64..020c06a1fef3b 100644
--- a/packages/react-server-dom-webpack/src/__tests__/ReactFlightDOM-test.js
+++ b/packages/react-server-dom-webpack/src/__tests__/ReactFlightDOM-test.js
@@ -128,7 +128,6 @@ describe('ReactFlightDOM', () => {
});
});
- // @gate experimental
it('should resolve the root', async () => {
const {Suspense} = React;
@@ -171,7 +170,7 @@ describe('ReactFlightDOM', () => {
const response = ReactServerDOMReader.createFromReadableStream(readable);
const container = document.createElement('div');
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
await act(async () => {
root.render();
});
@@ -180,7 +179,6 @@ describe('ReactFlightDOM', () => {
);
});
- // @gate experimental
it('should not get confused by $', async () => {
const {Suspense} = React;
@@ -210,14 +208,13 @@ describe('ReactFlightDOM', () => {
const response = ReactServerDOMReader.createFromReadableStream(readable);
const container = document.createElement('div');
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
await act(async () => {
root.render();
});
expect(container.innerHTML).toBe('$1
');
});
- // @gate experimental
it('should not get confused by @', async () => {
const {Suspense} = React;
@@ -247,14 +244,13 @@ describe('ReactFlightDOM', () => {
const response = ReactServerDOMReader.createFromReadableStream(readable);
const container = document.createElement('div');
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
await act(async () => {
root.render();
});
expect(container.innerHTML).toBe('@div
');
});
- // @gate experimental
it('should progressively reveal server components', async () => {
let reportedErrors = [];
const {Suspense} = React;
@@ -383,7 +379,7 @@ describe('ReactFlightDOM', () => {
const response = ReactServerDOMReader.createFromReadableStream(readable);
const container = document.createElement('div');
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
await act(async () => {
root.render(
(loading)}>
@@ -454,7 +450,6 @@ describe('ReactFlightDOM', () => {
expect(reportedErrors).toEqual([]);
});
- // @gate experimental
it('should preserve state of client components on refetch', async () => {
const {Suspense} = React;
@@ -483,7 +478,7 @@ describe('ReactFlightDOM', () => {
}
const container = document.createElement('div');
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
const stream1 = getTestStream();
ReactServerDOMWriter.pipeToNodeWritable(
diff --git a/packages/react-test-renderer/src/__tests__/ReactTestRendererAsync-test.js b/packages/react-test-renderer/src/__tests__/ReactTestRendererAsync-test.js
index 1a4554573afd1..31bb670cea946 100644
--- a/packages/react-test-renderer/src/__tests__/ReactTestRendererAsync-test.js
+++ b/packages/react-test-renderer/src/__tests__/ReactTestRendererAsync-test.js
@@ -91,7 +91,7 @@ describe('ReactTestRendererAsync', () => {
let renderer;
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
renderer = ReactTestRenderer.create(, {
unstable_isConcurrent: true,
});
@@ -138,7 +138,7 @@ describe('ReactTestRendererAsync', () => {
let renderer;
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
renderer = ReactTestRenderer.create(, {
unstable_isConcurrent: true,
});
diff --git a/packages/react/src/__tests__/ReactProfiler-test.internal.js b/packages/react/src/__tests__/ReactProfiler-test.internal.js
index bac44d736e35f..3607d3eac7822 100644
--- a/packages/react/src/__tests__/ReactProfiler-test.internal.js
+++ b/packages/react/src/__tests__/ReactProfiler-test.internal.js
@@ -196,7 +196,7 @@ describe(`onRender`, () => {
};
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactTestRenderer.create(
@@ -690,7 +690,6 @@ describe(`onRender`, () => {
expect(onRender.mock.calls[2][1]).toBe('update');
});
- // @gate experimental
it('is properly distinguish updates and nested-updates when there is more than sync remaining work', () => {
loadModules({
useNoopRenderer: true,
@@ -709,7 +708,7 @@ describe(`onRender`, () => {
const onRender = jest.fn();
// Schedule low-priority work.
- React.unstable_startTransition(() =>
+ React.startTransition(() =>
ReactNoop.render(
@@ -748,7 +747,7 @@ describe(`onRender`, () => {
// Render partially, but run out of time before completing.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactTestRenderer.create(
@@ -796,7 +795,7 @@ describe(`onRender`, () => {
// Render partially, but don't finish.
// This partial render should take 5ms of simulated time.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
ReactTestRenderer.create(
@@ -863,7 +862,7 @@ describe(`onRender`, () => {
// This partial render should take 10ms of simulated time.
let renderer;
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
renderer = ReactTestRenderer.create(
@@ -951,7 +950,7 @@ describe(`onRender`, () => {
// Render a partially update, but don't finish.
// This partial render should take 3ms of simulated time.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
renderer.update(
@@ -1076,7 +1075,7 @@ describe(`onRender`, () => {
// Render a partially update, but don't finish.
// This partial render will take 10ms of actual render time.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
first.setState({renderTime: 10});
});
} else {
diff --git a/packages/react/src/__tests__/ReactProfilerDevToolsIntegration-test.internal.js b/packages/react/src/__tests__/ReactProfilerDevToolsIntegration-test.internal.js
index d1b5bd9b44a9a..b8be0438d0375 100644
--- a/packages/react/src/__tests__/ReactProfilerDevToolsIntegration-test.internal.js
+++ b/packages/react/src/__tests__/ReactProfilerDevToolsIntegration-test.internal.js
@@ -157,7 +157,7 @@ describe('ReactProfiler DevTools integration', () => {
Scheduler.unstable_advanceTime(10000);
// Schedule an update.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
root.update();
});
} else {
diff --git a/packages/react/src/__tests__/ReactStrictMode-test.internal.js b/packages/react/src/__tests__/ReactStrictMode-test.internal.js
index b1fb0bcc270ae..62d63f48cd0d8 100644
--- a/packages/react/src/__tests__/ReactStrictMode-test.internal.js
+++ b/packages/react/src/__tests__/ReactStrictMode-test.internal.js
@@ -49,7 +49,6 @@ describe('ReactStrictMode', () => {
return null;
}
- // @gate experimental
it('should default to not strict', () => {
act(() => {
const container = document.createElement('div');
@@ -65,7 +64,6 @@ describe('ReactStrictMode', () => {
});
if (__DEV__) {
- // @gate experimental
it('should support enabling strict mode via createRoot option', () => {
act(() => {
const container = document.createElement('div');
@@ -87,7 +85,6 @@ describe('ReactStrictMode', () => {
]);
});
- // @gate experimental
it('should include legacy + strict effects mode', () => {
act(() => {
const container = document.createElement('div');
@@ -111,7 +108,6 @@ describe('ReactStrictMode', () => {
]);
});
- // @gate experimental
it('should allow level to be increased with nesting', () => {
act(() => {
const container = document.createElement('div');
diff --git a/packages/react/src/__tests__/ReactStrictMode-test.js b/packages/react/src/__tests__/ReactStrictMode-test.js
index c6d1f7ee72e6e..a41f2ef2ccc75 100644
--- a/packages/react/src/__tests__/ReactStrictMode-test.js
+++ b/packages/react/src/__tests__/ReactStrictMode-test.js
@@ -362,7 +362,6 @@ describe('Concurrent Mode', () => {
Scheduler = require('scheduler');
});
- // @gate experimental
it('should warn about unsafe legacy lifecycle methods anywhere in a StrictMode tree', () => {
function StrictRoot() {
return (
@@ -405,7 +404,7 @@ describe('Concurrent Mode', () => {
}
const container = document.createElement('div');
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
root.render();
expect(() => Scheduler.unstable_flushAll()).toErrorDev(
[
@@ -436,7 +435,6 @@ Please update the following components: App`,
Scheduler.unstable_flushAll();
});
- // @gate experimental
it('should coalesce warnings by lifecycle name', () => {
function StrictRoot() {
return (
@@ -468,7 +466,7 @@ Please update the following components: App`,
}
const container = document.createElement('div');
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
root.render();
expect(() => {
@@ -526,7 +524,6 @@ Please update the following components: Parent`,
Scheduler.unstable_flushAll();
});
- // @gate experimental
it('should warn about components not present during the initial render', () => {
function StrictRoot({foo}) {
return {foo ? : };
@@ -545,7 +542,7 @@ Please update the following components: Parent`,
}
const container = document.createElement('div');
- const root = ReactDOM.unstable_createRoot(container);
+ const root = ReactDOM.createRoot(container);
root.render();
expect(() =>
Scheduler.unstable_flushAll(),
diff --git a/packages/use-subscription/src/__tests__/useSubscription-test.js b/packages/use-subscription/src/__tests__/useSubscription-test.js
index cfb082dfd2f65..01a94df3651a4 100644
--- a/packages/use-subscription/src/__tests__/useSubscription-test.js
+++ b/packages/use-subscription/src/__tests__/useSubscription-test.js
@@ -333,7 +333,7 @@ describe('useSubscription', () => {
// Start React update, but don't finish
act(() => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
renderer.update();
});
} else {
@@ -442,7 +442,7 @@ describe('useSubscription', () => {
// Start React update, but don't finish
act(() => {
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
renderer.update();
});
} else {
@@ -625,7 +625,7 @@ describe('useSubscription', () => {
// This update will not be eagerly evaluated,
// but useSubscription() should eagerly close over the updated value to avoid tearing.
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
mutate('C');
});
} else {
@@ -633,7 +633,7 @@ describe('useSubscription', () => {
}
expect(Scheduler).toFlushAndYieldThrough(['render:first:C']);
if (gate(flags => flags.enableSyncDefaultUpdates)) {
- React.unstable_startTransition(() => {
+ React.startTransition(() => {
mutate('D');
});
} else {