Skip to content

Commit 29fea9f

Browse files
acdliteacdlite
committed
Remove withSuspenseConfig
Removes `withSuspenseConfig` and migrates relevant tests to `startTransition` instead. We only had one caller in www, which I've removed.
1 parent 4f5fb56 commit 29fea9f

File tree

12 files changed

+40
-195
lines changed

12 files changed

+40
-195
lines changed

‎fixtures/ssr/src/components/Chrome.js

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -28,12 +28,9 @@ export default class Chrome extends Component {
2828
<div>
2929
<ThemeToggleButton
3030
onChange={theme => {
31-
React.unstable_withSuspenseConfig(
32-
() => {
33-
this.setState({theme});
34-
},
35-
{timeoutMs: 6000}
36-
);
31+
React.startTransition(() => {
32+
this.setState({theme});
33+
});
3734
}}
3835
/>
3936
</div>

‎packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -913,9 +913,8 @@ describe('ReactDOMServerPartialHydration', () => {
913913
expect(container.textContent).toBe('Hello');
914914

915915
// Render an update with a long timeout.
916-
React.unstable_withSuspenseConfig(
917-
() => root.render(<App text="Hi" className="hi" />),
918-
{timeoutMs: 5000},
916+
React.unstable_startTransition(() =>
917+
root.render(<App text="Hi" className="hi" />),
919918
);
920919

921920
// This shouldn't force the fallback yet.

‎packages/react-dom/src/__tests__/ReactTestUtilsAct-test.js

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -771,14 +771,11 @@ function runActTests(label, render, unmount, rerender) {
771771
expect(document.querySelector('[data-test-id=spinner]')).toBeNull();
772772

773773
// trigger a suspendy update with a delay
774-
React.unstable_withSuspenseConfig(
775-
() => {
776-
act(() => {
777-
rerender(<App suspend={true} />);
778-
});
779-
},
780-
{timeout: 5000},
781-
);
774+
React.unstable_startTransition(() => {
775+
act(() => {
776+
rerender(<App suspend={true} />);
777+
});
778+
});
782779

783780
if (label === 'concurrent mode') {
784781
// In Concurrent Mode, refresh transitions delay indefinitely.

‎packages/react-dom/src/events/plugins/__tests__/SimpleEventPlugin-test.js

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -389,14 +389,11 @@ describe('SimpleEventPlugin', function() {
389389
<button
390390
ref={el => (button = el)}
391391
onClick={() => {
392-
React.unstable_withSuspenseConfig(
393-
() => {
394-
this.setState(state => ({
395-
lowPriCount: state.lowPriCount + 1,
396-
}));
397-
},
398-
{timeoutMs: 5000},
399-
);
392+
React.unstable_startTransition(() => {
393+
this.setState(state => ({
394+
lowPriCount: state.lowPriCount + 1,
395+
}));
396+
});
400397
}}>
401398
{text}
402399
</button>

‎packages/react-reconciler/src/__tests__/ReactSuspense-test.internal.js

Lines changed: 6 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -363,12 +363,9 @@ describe('ReactSuspense', () => {
363363

364364
// Schedule another update. This will have lower priority because it's
365365
// a transition.
366-
React.unstable_withSuspenseConfig(
367-
() => {
368-
root.update(<App shouldSuspend={false} step={2} />);
369-
},
370-
{timeoutMs: 10000},
371-
);
366+
React.unstable_startTransition(() => {
367+
root.update(<App shouldSuspend={false} step={2} />);
368+
});
372369

373370
// Interrupt to trigger a restart.
374371
interrupt();
@@ -465,12 +462,9 @@ describe('ReactSuspense', () => {
465462

466463
// Schedule another update. This will have lower priority because it's
467464
// a transition.
468-
React.unstable_withSuspenseConfig(
469-
() => {
470-
setShouldHideInParent(true);
471-
},
472-
{timeoutMs: 10000},
473-
);
465+
React.unstable_startTransition(() => {
466+
setShouldHideInParent(true);
467+
});
474468

475469
expect(Scheduler).toFlushAndYieldThrough([
476470
// Should have restarted the first update, because of the interruption

‎packages/react-reconciler/src/__tests__/ReactSuspenseWithNoopRenderer-test.js

Lines changed: 19 additions & 127 deletions
Original file line numberDiff line numberDiff line change
@@ -959,12 +959,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
959959
expect(Scheduler).toFlushAndYield(['S']);
960960

961961
// Schedule an update, and suspend for up to 5 seconds.
962-
React.unstable_withSuspenseConfig(
963-
() => ReactNoop.render(<App text="A" />),
964-
{
965-
timeoutMs: 5000,
966-
},
967-
);
962+
React.unstable_startTransition(() => ReactNoop.render(<App text="A" />));
968963
// The update should suspend.
969964
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
970965
expect(ReactNoop.getChildren()).toEqual([span('S')]);
@@ -976,12 +971,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
976971
expect(ReactNoop.getChildren()).toEqual([span('S')]);
977972

978973
// Schedule another low priority update.
979-
React.unstable_withSuspenseConfig(
980-
() => ReactNoop.render(<App text="B" />),
981-
{
982-
timeoutMs: 10000,
983-
},
984-
);
974+
React.unstable_startTransition(() => ReactNoop.render(<App text="B" />));
985975
// This update should also suspend.
986976
expect(Scheduler).toFlushAndYield(['Suspend! [B]', 'Loading...']);
987977
expect(ReactNoop.getChildren()).toEqual([span('S')]);
@@ -2282,7 +2272,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
22822272
ReactNoop.render(<Foo renderContent={1} />);
22832273

22842274
// Took a long time to render. This is to ensure we get a long suspense time.
2285-
// Could also use something like withSuspenseConfig to simulate this.
2275+
// Could also use something like startTransition to simulate this.
22862276
Scheduler.unstable_advanceTime(1500);
22872277
await advanceTimers(1500);
22882278

@@ -2330,10 +2320,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
23302320
}
23312321

23322322
// Initial render.
2333-
React.unstable_withSuspenseConfig(
2334-
() => ReactNoop.render(<App page="A" />),
2335-
SUSPENSE_CONFIG,
2336-
);
2323+
React.unstable_startTransition(() => ReactNoop.render(<App page="A" />));
23372324

23382325
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
23392326
// Only a short time is needed to unsuspend the initial loading state.
@@ -2349,10 +2336,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
23492336
expect(ReactNoop.getChildren()).toEqual([span('A')]);
23502337

23512338
// Start transition.
2352-
React.unstable_withSuspenseConfig(
2353-
() => ReactNoop.render(<App page="B" />),
2354-
SUSPENSE_CONFIG,
2355-
);
2339+
React.unstable_startTransition(() => ReactNoop.render(<App page="B" />));
23562340

23572341
expect(Scheduler).toFlushAndYield(['Suspend! [B]', 'Loading...']);
23582342
Scheduler.unstable_advanceTime(100000);
@@ -2389,10 +2373,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
23892373

23902374
// Initial render.
23912375
await ReactNoop.act(async () => {
2392-
React.unstable_withSuspenseConfig(
2393-
() => transitionToPage('A'),
2394-
SUSPENSE_CONFIG,
2395-
);
2376+
React.unstable_startTransition(() => transitionToPage('A'));
23962377

23972378
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
23982379
// Only a short time is needed to unsuspend the initial loading state.
@@ -2409,10 +2390,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
24092390

24102391
// Start transition.
24112392
await ReactNoop.act(async () => {
2412-
React.unstable_withSuspenseConfig(
2413-
() => transitionToPage('B'),
2414-
SUSPENSE_CONFIG,
2415-
);
2393+
React.unstable_startTransition(() => transitionToPage('B'));
24162394

24172395
expect(Scheduler).toFlushAndYield(['Suspend! [B]', 'Loading...']);
24182396
Scheduler.unstable_advanceTime(100000);
@@ -2452,10 +2430,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
24522430

24532431
// Initial render.
24542432
await ReactNoop.act(async () => {
2455-
React.unstable_withSuspenseConfig(
2456-
() => transitionToPage('A'),
2457-
SUSPENSE_CONFIG,
2458-
);
2433+
React.unstable_startTransition(() => transitionToPage('A'));
24592434

24602435
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
24612436
// Only a short time is needed to unsuspend the initial loading state.
@@ -2472,10 +2447,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
24722447

24732448
// Start transition.
24742449
await ReactNoop.act(async () => {
2475-
React.unstable_withSuspenseConfig(
2476-
() => transitionToPage('B'),
2477-
SUSPENSE_CONFIG,
2478-
);
2450+
React.unstable_startTransition(() => transitionToPage('B'));
24792451

24802452
expect(Scheduler).toFlushAndYield(['Suspend! [B]', 'Loading...']);
24812453
Scheduler.unstable_advanceTime(100000);
@@ -2689,75 +2661,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
26892661
});
26902662

26912663
// @gate experimental
2692-
it('disables suspense config when nothing is passed to withSuspenseConfig', async () => {
2693-
function App({page}) {
2694-
return (
2695-
<Suspense fallback={<Text text="Loading..." />}>
2696-
<AsyncText text={page} ms={2000} />
2697-
</Suspense>
2698-
);
2699-
}
2700-
2701-
// Initial render.
2702-
ReactNoop.render(<App page="A" />);
2703-
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
2704-
Scheduler.unstable_advanceTime(2000);
2705-
await advanceTimers(2000);
2706-
expect(Scheduler).toHaveYielded(['Promise resolved [A]']);
2707-
expect(Scheduler).toFlushAndYield(['A']);
2708-
expect(ReactNoop.getChildren()).toEqual([span('A')]);
2709-
2710-
// Start transition.
2711-
React.unstable_withSuspenseConfig(
2712-
() => {
2713-
// When we schedule an inner transition without a suspense config
2714-
// so it should only suspend for a short time.
2715-
React.unstable_withSuspenseConfig(() =>
2716-
ReactNoop.render(<App page="B" />),
2717-
);
2718-
},
2719-
{timeoutMs: 2000},
2720-
);
2721-
2722-
expect(Scheduler).toFlushAndYield(['Suspend! [B]', 'Loading...']);
2723-
// Suspended
2724-
expect(ReactNoop.getChildren()).toEqual([span('A')]);
2725-
Scheduler.unstable_advanceTime(500);
2726-
await advanceTimers(500);
2727-
// Committed loading state.
2728-
expect(ReactNoop.getChildren()).toEqual([
2729-
hiddenSpan('A'),
2730-
span('Loading...'),
2731-
]);
2732-
2733-
Scheduler.unstable_advanceTime(2000);
2734-
await advanceTimers(2000);
2735-
expect(Scheduler).toHaveYielded(['Promise resolved [B]']);
2736-
expect(Scheduler).toFlushAndYield(['B']);
2737-
expect(ReactNoop.getChildren()).toEqual([span('B')]);
2738-
2739-
React.unstable_withSuspenseConfig(
2740-
() => {
2741-
// First we schedule an inner unrelated update.
2742-
React.unstable_withSuspenseConfig(() =>
2743-
ReactNoop.render(<App page="B" unrelated={true} />),
2744-
);
2745-
// Then we schedule another transition to a slow page,
2746-
// but at this scope we should suspend for longer.
2747-
Scheduler.unstable_next(() => ReactNoop.render(<App page="C" />));
2748-
},
2749-
{timeoutMs: 60000},
2750-
);
2751-
expect(Scheduler).toFlushAndYield(['B', 'Suspend! [C]', 'Loading...']);
2752-
expect(ReactNoop.getChildren()).toEqual([span('B')]);
2753-
// Event after a large amount of time, we never show a loading state.
2754-
Scheduler.unstable_advanceTime(60000);
2755-
await advanceTimers(60000);
2756-
expect(ReactNoop.getChildren()).toEqual([span('B')]);
2757-
});
2758-
2759-
// @gate experimental
2760-
it('withSuspenseConfig delay applies when we use an updated avoided boundary', async () => {
2664+
it('do not show placeholder when updating an avoided boundary with startTransition', async () => {
27612665
function App({page}) {
27622666
return (
27632667
<Suspense fallback={<Text text="Loading..." />}>
@@ -2780,10 +2684,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
27802684
expect(ReactNoop.getChildren()).toEqual([span('Hi!'), span('A')]);
27812685

27822686
// Start transition.
2783-
React.unstable_withSuspenseConfig(
2784-
() => ReactNoop.render(<App page="B" />),
2785-
{timeoutMs: 2000},
2786-
);
2687+
React.unstable_startTransition(() => ReactNoop.render(<App page="B" />));
27872688

27882689
expect(Scheduler).toFlushAndYield(['Hi!', 'Suspend! [B]', 'Loading B...']);
27892690

@@ -2806,7 +2707,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
28062707
});
28072708

28082709
// @gate experimental
2809-
it('withSuspenseConfig delay applies when we use a newly created avoided boundary', async () => {
2710+
it('do not show placeholder when mounting an avoided boundary with startTransition', async () => {
28102711
function App({page}) {
28112712
return (
28122713
<Suspense fallback={<Text text="Loading..." />}>
@@ -2830,10 +2731,7 @@ describe('ReactSuspenseWithNoopRenderer', () => {
28302731
expect(ReactNoop.getChildren()).toEqual([span('Hi!'), span('A')]);
28312732

28322733
// Start transition.
2833-
React.unstable_withSuspenseConfig(
2834-
() => ReactNoop.render(<App page="B" />),
2835-
{timeoutMs: 2000},
2836-
);
2734+
React.unstable_startTransition(() => ReactNoop.render(<App page="B" />));
28372735

28382736
expect(Scheduler).toFlushAndYield(['Hi!', 'Suspend! [B]', 'Loading B...']);
28392737

@@ -2992,12 +2890,9 @@ describe('ReactSuspenseWithNoopRenderer', () => {
29922890
expect(ReactNoop).toMatchRenderedOutput(<div hidden={true} />);
29932891

29942892
// Start transition.
2995-
React.unstable_withSuspenseConfig(
2996-
() => {
2997-
ReactNoop.render(<App showContent={true} />);
2998-
},
2999-
{timeoutMs: 2500},
3000-
);
2893+
React.unstable_startTransition(() => {
2894+
ReactNoop.render(<App showContent={true} />);
2895+
});
30012896

30022897
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
30032898
Scheduler.unstable_advanceTime(2000);
@@ -3049,12 +2944,9 @@ describe('ReactSuspenseWithNoopRenderer', () => {
30492944
expect(Scheduler).toFlushAndYieldThrough(['Suspend! [A]']);
30502945

30512946
// Start transition.
3052-
React.unstable_withSuspenseConfig(
3053-
() => {
3054-
ReactNoop.render(<App showContent={true} />);
3055-
},
3056-
{timeoutMs: 5000},
3057-
);
2947+
React.unstable_startTransition(() => {
2948+
ReactNoop.render(<App showContent={true} />);
2949+
});
30582950

30592951
expect(Scheduler).toFlushAndYield(['Suspend! [A]', 'Loading...']);
30602952
Scheduler.unstable_advanceTime(2000);

‎packages/react/index.classic.fb.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,6 @@ export {
5050
startTransition as unstable_startTransition,
5151
SuspenseList,
5252
SuspenseList as unstable_SuspenseList,
53-
unstable_withSuspenseConfig,
5453
// enableBlocksAPI
5554
block,
5655
block as unstable_block,

‎packages/react/index.experimental.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,6 @@ export {
4444
useDeferredValue as unstable_useDeferredValue,
4545
startTransition as unstable_startTransition,
4646
SuspenseList as unstable_SuspenseList,
47-
unstable_withSuspenseConfig,
4847
// enableBlocksAPI
4948
block as unstable_block,
5049
unstable_useOpaqueIdentifier,

‎packages/react/index.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,6 @@ export {
7878
useDeferredValue as unstable_useDeferredValue,
7979
SuspenseList,
8080
SuspenseList as unstable_SuspenseList,
81-
unstable_withSuspenseConfig,
8281
block,
8382
block as unstable_block,
8483
unstable_LegacyHidden,

‎packages/react/index.modern.fb.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,6 @@ export {
4949
startTransition as unstable_startTransition,
5050
SuspenseList,
5151
SuspenseList as unstable_SuspenseList,
52-
unstable_withSuspenseConfig,
5352
// enableBlocksAPI
5453
block,
5554
block as unstable_block,

0 commit comments

Comments
 (0)