From 1528c5ccdf5c61a08adab31116156df6503e26ce Mon Sep 17 00:00:00 2001 From: Andrew Clark Date: Mon, 6 Mar 2023 11:09:07 -0500 Subject: [PATCH] SchedulerMock.unstable_yieldValue -> SchedulerMock.log (#26312) (This only affects our own internal repo; it's not a public API.) I think most of us agree this is a less confusing name. It's possible someone will confuse it with `console.log`. If that becomes a problem we can warn in dev or something. --- .../ReactInternalTestUtils.js | 12 +- .../__tests__/ReactInternalTestUtils-test.js | 160 ++++++ packages/jest-react/src/JestReact.js | 2 +- .../__tests__/ReactCacheOld-test.internal.js | 24 +- .../src/__tests__/ReactFlight-test.js | 8 +- .../src/__tests__/TimelineProfiler-test.js | 88 ++- .../src/__tests__/preprocessData-test.js | 28 +- .../src/__tests__/setupTests.js | 4 - .../src/__tests__/ReactDOMFiberAsync-test.js | 2 +- .../src/__tests__/ReactDOMFizzServer-test.js | 98 ++-- .../ReactDOMFizzShellHydration-test.js | 8 +- ...actDOMFizzSuppressHydrationWarning-test.js | 24 +- .../ReactDOMImageLoad-test.internal.js | 34 +- .../ReactDOMNativeEventHeuristic-test.js | 4 +- .../__tests__/ReactDOMNestedEvents-test.js | 4 +- .../src/__tests__/ReactDOMRoot-test.js | 4 +- .../ReactDOMServerIntegrationHooks-test.js | 42 +- ...ctDOMServerIntegrationSpecialTypes-test.js | 20 +- ...DOMServerPartialHydration-test.internal.js | 66 +-- ...MServerSelectiveHydration-test.internal.js | 194 ++++--- .../ReactErrorBoundaries-test.internal.js | 452 ++++++--------- .../src/__tests__/ReactTestUtilsAct-test.js | 14 +- ...ReactTestUtilsActUnmockedScheduler-test.js | 18 +- .../src/__tests__/ReactUpdates-test.js | 16 +- .../__tests__/ReactWrongReturnPointer-test.js | 10 +- .../DOMPluginEventSystem-test.internal.js | 2 +- .../__tests__/ChangeEventPlugin-test.js | 10 +- .../__tests__/SimpleEventPlugin-test.js | 6 +- .../src/createReactNoop.js | 2 +- .../src/ReactFiberDevToolsHook.js | 6 +- packages/react-reconciler/src/Scheduler.js | 2 +- .../src/__tests__/ReactActWarnings-test.js | 10 +- .../__tests__/ReactBatching-test.internal.js | 12 +- .../src/__tests__/ReactCPUSuspense-test.js | 10 +- .../src/__tests__/ReactCache-test.js | 14 +- .../ReactClassSetStateCallback-test.js | 14 +- .../ReactConcurrentErrorRecovery-test.js | 10 +- .../__tests__/ReactContextPropagation-test.js | 12 +- .../src/__tests__/ReactDeferredValue-test.js | 2 +- ...asedOnReactExpirationTime-test.internal.js | 8 +- .../src/__tests__/ReactEffectOrdering-test.js | 8 +- .../src/__tests__/ReactExpiration-test.js | 36 +- .../src/__tests__/ReactFlushSync-test.js | 12 +- .../src/__tests__/ReactHooks-test.internal.js | 50 +- .../ReactHooksWithNoopRenderer-test.js | 534 ++++++++---------- .../src/__tests__/ReactIncremental-test.js | 366 +++++------- ...tIncrementalErrorHandling-test.internal.js | 172 +++--- .../ReactIncrementalErrorLogging-test.js | 6 +- .../ReactIncrementalReflection-test.js | 45 +- .../ReactIncrementalScheduling-test.js | 32 +- .../ReactIncrementalSideEffects-test.js | 30 +- .../ReactIncrementalTriangle-test.js | 2 +- .../__tests__/ReactIncrementalUpdates-test.js | 40 +- .../__tests__/ReactInterleavedUpdates-test.js | 2 +- .../src/__tests__/ReactLazy-test.internal.js | 90 ++- .../src/__tests__/ReactMemo-test.js | 12 +- .../src/__tests__/ReactNewContext-test.js | 78 +-- .../__tests__/ReactNoopRendererAct-test.js | 4 +- .../src/__tests__/ReactOffscreen-test.js | 104 ++-- .../__tests__/ReactOffscreenSuspense-test.js | 14 +- .../ReactSchedulerIntegration-test.js | 30 +- .../ReactSubtreeFlagsWarning-test.js | 10 +- .../__tests__/ReactSuspense-test.internal.js | 136 ++--- .../ReactSuspenseEffectsSemantics-test.js | 274 ++++----- .../ReactSuspenseEffectsSemanticsDOM-test.js | 46 +- .../__tests__/ReactSuspenseFallback-test.js | 10 +- .../ReactSuspenseFuzz-test.internal.js | 12 +- .../src/__tests__/ReactSuspenseList-test.js | 16 +- .../ReactSuspensePlaceholder-test.internal.js | 24 +- .../ReactSuspenseWithNoopRenderer-test.js | 142 +++-- .../src/__tests__/ReactThenable-test.js | 22 +- .../src/__tests__/ReactTransition-test.js | 20 +- .../__tests__/ReactTransitionTracing-test.js | 232 ++++---- .../src/__tests__/ReactUpdatePriority-test.js | 4 +- .../__tests__/ReactUpdaters-test.internal.js | 12 +- .../src/__tests__/StrictEffectsMode-test.js | 96 ++-- ...StrictEffectsModeDefaults-test.internal.js | 111 ++-- .../src/__tests__/useEffectEvent-test.js | 20 +- .../useMutableSource-test.internal.js | 84 ++- .../useMutableSourceHydration-test.js | 8 +- .../src/__tests__/useRef-test.internal.js | 4 +- .../__tests__/useSyncExternalStore-test.js | 4 +- .../src/__tests__/ReactFresh-test.js | 8 +- .../__tests__/ReactTestRendererAct-test.js | 4 +- .../__tests__/ReactTestRendererAsync-test.js | 136 +---- .../__tests__/ReactProfiler-test.internal.js | 52 +- ...ofilerDevToolsIntegration-test.internal.js | 2 +- .../src/__tests__/forwardRef-test.internal.js | 26 +- .../src/__tests__/SchedulerMock-test.js | 252 ++++----- .../src/__tests__/SchedulerProfiling-test.js | 42 +- packages/scheduler/src/forks/SchedulerMock.js | 8 +- packages/shared/forks/Scheduler.umd.js | 4 +- .../src/__tests__/useSubscription-test.js | 20 +- .../useSyncExternalStoreNative-test.js | 2 +- .../useSyncExternalStoreShared-test.js | 18 +- .../useSyncExternalStoreShimServer-test.js | 2 +- scripts/jest/matchers/reactTestMatchers.js | 13 +- .../jest/matchers/schedulerTestMatchers.js | 96 ---- scripts/release/snapshot-test.snapshot | 80 +-- 99 files changed, 2286 insertions(+), 2889 deletions(-) create mode 100644 packages/internal-test-utils/__tests__/ReactInternalTestUtils-test.js delete mode 100644 scripts/jest/matchers/schedulerTestMatchers.js diff --git a/packages/internal-test-utils/ReactInternalTestUtils.js b/packages/internal-test-utils/ReactInternalTestUtils.js index 2677312d4b2af..77c67b15600a8 100644 --- a/packages/internal-test-utils/ReactInternalTestUtils.js +++ b/packages/internal-test-utils/ReactInternalTestUtils.js @@ -13,7 +13,7 @@ import {equals} from '@jest/expect-utils'; import enqueueTask from './enqueueTask'; function assertYieldsWereCleared(Scheduler) { - const actualYields = Scheduler.unstable_clearYields(); + const actualYields = Scheduler.unstable_clearLog(); if (actualYields.length !== 0) { const error = Error( 'The event log is not empty. Call assertLog(...) first.', @@ -45,14 +45,14 @@ export async function waitFor(expectedLog) { SchedulerMock.unstable_flushNumberOfYields( expectedLog.length - actualLog.length, ); - actualLog.push(...SchedulerMock.unstable_clearYields()); + actualLog.push(...SchedulerMock.unstable_clearLog()); if (expectedLog.length > actualLog.length) { // Continue flushing until we've logged the expected number of items. } else { // Once we've reached the expected sequence, wait one more microtask to // flush any remaining synchronous work. await waitForMicrotasks(); - actualLog.push(...SchedulerMock.unstable_clearYields()); + actualLog.push(...SchedulerMock.unstable_clearLog()); break; } } else { @@ -91,7 +91,7 @@ export async function waitForAll(expectedLog) { SchedulerMock.unstable_flushAllWithoutAsserting(); } while (true); - const actualLog = SchedulerMock.unstable_clearYields(); + const actualLog = SchedulerMock.unstable_clearLog(); if (equals(actualLog, expectedLog)) { return; } @@ -166,7 +166,7 @@ export async function waitForPaint(expectedLog) { await waitForMicrotasks(); } - const actualLog = SchedulerMock.unstable_clearYields(); + const actualLog = SchedulerMock.unstable_clearLog(); if (equals(actualLog, expectedLog)) { return; } @@ -180,7 +180,7 @@ ${diff(expectedLog, actualLog)} } export function assertLog(expectedLog) { - const actualLog = SchedulerMock.unstable_clearYields(); + const actualLog = SchedulerMock.unstable_clearLog(); if (equals(actualLog, expectedLog)) { return; } diff --git a/packages/internal-test-utils/__tests__/ReactInternalTestUtils-test.js b/packages/internal-test-utils/__tests__/ReactInternalTestUtils-test.js new file mode 100644 index 0000000000000..f05a46e3a71a1 --- /dev/null +++ b/packages/internal-test-utils/__tests__/ReactInternalTestUtils-test.js @@ -0,0 +1,160 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @emails react-core + * @jest-environment node + */ + +'use strict'; + +const React = require('react'); +const {startTransition, useDeferredValue} = React; +const ReactNoop = require('react-noop-renderer'); +const { + waitFor, + waitForAll, + waitForPaint, + waitForThrow, + assertLog, +} = require('internal-test-utils'); +const act = require('jest-react').act; +const Scheduler = require('scheduler/unstable_mock'); + +describe('ReactInternalTestUtils', () => { + test('waitFor', async () => { + const Yield = ({id}) => { + Scheduler.log(id); + return id; + }; + + const root = ReactNoop.createRoot(); + startTransition(() => { + root.render( +
+ + + +
+ ); + }); + + await waitFor(['foo', 'bar']); + expect(root).toMatchRenderedOutput(null); + await waitFor(['baz']); + expect(root).toMatchRenderedOutput(null); + await waitForAll([]); + expect(root).toMatchRenderedOutput(
foobarbaz
); + }); + + test('waitForAll', async () => { + const Yield = ({id}) => { + Scheduler.log(id); + return id; + }; + + const root = ReactNoop.createRoot(); + startTransition(() => { + root.render( +
+ + + +
+ ); + }); + + await waitForAll(['foo', 'bar', 'baz']); + expect(root).toMatchRenderedOutput(
foobarbaz
); + }); + + test('waitForThrow', async () => { + const Yield = ({id}) => { + Scheduler.log(id); + return id; + }; + + function BadRender() { + throw new Error('Oh no!'); + } + + function App() { + return ( +
+ + + + + +
+ ); + } + + const root = ReactNoop.createRoot(); + root.render(); + + await waitForThrow('Oh no!'); + assertLog([ + 'A', + 'B', + 'C', + 'D', + // React will try one more time before giving up. + 'A', + 'B', + 'C', + 'D', + ]); + }); + + test('waitForPaint', async () => { + function App({prop}) { + const deferred = useDeferredValue(prop); + const text = `Urgent: ${prop}, Deferred: ${deferred}`; + Scheduler.log(text); + return text; + } + + const root = ReactNoop.createRoot(); + root.render(); + + await waitForAll(['Urgent: A, Deferred: A']); + expect(root).toMatchRenderedOutput('Urgent: A, Deferred: A'); + + // This update will result in two separate paints: an urgent one, and a + // deferred one. + root.render(); + // Urgent paint + await waitForPaint(['Urgent: B, Deferred: A']); + expect(root).toMatchRenderedOutput('Urgent: B, Deferred: A'); + + // Deferred paint + await waitForPaint(['Urgent: B, Deferred: B']); + expect(root).toMatchRenderedOutput('Urgent: B, Deferred: B'); + }); + + test('assertLog', async () => { + const Yield = ({id}) => { + Scheduler.log(id); + return id; + }; + + function App() { + return ( +
+ + + +
+ ); + } + + const root = ReactNoop.createRoot(); + await act(async () => { + root.render(); + }); + assertLog(['A', 'B', 'C']); + }); +}); diff --git a/packages/jest-react/src/JestReact.js b/packages/jest-react/src/JestReact.js index a46dc8d2ac1bc..1d43861165037 100644 --- a/packages/jest-react/src/JestReact.js +++ b/packages/jest-react/src/JestReact.js @@ -29,7 +29,7 @@ function captureAssertion(fn) { function assertYieldsWereCleared(root) { const Scheduler = root._Scheduler; - const actualYields = Scheduler.unstable_clearYields(); + const actualYields = Scheduler.unstable_clearLog(); if (actualYields.length !== 0) { const error = Error( 'Log of yielded values is not empty. ' + diff --git a/packages/react-cache/src/__tests__/ReactCacheOld-test.internal.js b/packages/react-cache/src/__tests__/ReactCacheOld-test.internal.js index b2db6c5d34e55..aa25cacc26fc9 100644 --- a/packages/react-cache/src/__tests__/ReactCacheOld-test.internal.js +++ b/packages/react-cache/src/__tests__/ReactCacheOld-test.internal.js @@ -54,16 +54,12 @@ describe('ReactCache', () => { listeners = [{resolve, reject}]; setTimeout(() => { if (textResourceShouldFail) { - Scheduler.unstable_yieldValue( - `Promise rejected [${text}]`, - ); + Scheduler.log(`Promise rejected [${text}]`); status = 'rejected'; value = new Error('Failed to load: ' + text); listeners.forEach(listener => listener.reject(value)); } else { - Scheduler.unstable_yieldValue( - `Promise resolved [${text}]`, - ); + Scheduler.log(`Promise resolved [${text}]`); status = 'resolved'; value = text; listeners.forEach(listener => listener.resolve(value)); @@ -93,7 +89,7 @@ describe('ReactCache', () => { }); function Text(props) { - Scheduler.unstable_yieldValue(props.text); + Scheduler.log(props.text); return props.text; } @@ -101,13 +97,13 @@ describe('ReactCache', () => { const text = props.text; try { TextResource.read([props.text, props.ms]); - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return text; } catch (promise) { if (typeof promise.then === 'function') { - Scheduler.unstable_yieldValue(`Suspend! [${text}]`); + Scheduler.log(`Suspend! [${text}]`); } else { - Scheduler.unstable_yieldValue(`Error! [${text}]`); + Scheduler.log(`Error! [${text}]`); } throw promise; } @@ -171,7 +167,7 @@ describe('ReactCache', () => { }); function App() { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); return BadTextResource.read(['Hi', 100]); } @@ -322,13 +318,13 @@ describe('ReactCache', () => { const text = props.text; try { const actualText = BadTextResource.read([props.text, props.ms]); - Scheduler.unstable_yieldValue(actualText); + Scheduler.log(actualText); return actualText; } catch (promise) { if (typeof promise.then === 'function') { - Scheduler.unstable_yieldValue(`Suspend! [${text}]`); + Scheduler.log(`Suspend! [${text}]`); } else { - Scheduler.unstable_yieldValue(`Error! [${text}]`); + Scheduler.log(`Error! [${text}]`); } throw promise; } diff --git a/packages/react-client/src/__tests__/ReactFlight-test.js b/packages/react-client/src/__tests__/ReactFlight-test.js index b5ca64d9a2e84..fd6d4eb2e700c 100644 --- a/packages/react-client/src/__tests__/ReactFlight-test.js +++ b/packages/react-client/src/__tests__/ReactFlight-test.js @@ -827,7 +827,7 @@ describe('ReactFlight', () => { } function ClientDoubler({el}) { - Scheduler.unstable_yieldValue('ClientDoubler'); + Scheduler.log('ClientDoubler'); return ( <> {el} @@ -1018,10 +1018,10 @@ describe('ReactFlight', () => { function Bar() { if (!promise.unsuspend) { - Scheduler.unstable_yieldValue('suspended'); + Scheduler.log('suspended'); throw promise; } - Scheduler.unstable_yieldValue('rendered'); + Scheduler.log('rendered'); const context = React.useContext(ServerContext); return context; } @@ -1055,7 +1055,7 @@ describe('ReactFlight', () => { ); function ClientBar() { - Scheduler.unstable_yieldValue('ClientBar'); + Scheduler.log('ClientBar'); const context = React.useContext(ServerContext); return {context}; } diff --git a/packages/react-devtools-shared/src/__tests__/TimelineProfiler-test.js b/packages/react-devtools-shared/src/__tests__/TimelineProfiler-test.js index 65e35c03d3b19..16637bdc091bc 100644 --- a/packages/react-devtools-shared/src/__tests__/TimelineProfiler-test.js +++ b/packages/react-devtools-shared/src/__tests__/TimelineProfiler-test.js @@ -193,12 +193,12 @@ describe('Timeline profiler', () => { it('should mark render yields', async () => { function Bar() { - Scheduler.unstable_yieldValue('Bar'); + Scheduler.log('Bar'); return null; } function Foo() { - Scheduler.unstable_yieldValue('Foo'); + Scheduler.log('Foo'); return ; } @@ -908,37 +908,37 @@ describe('Timeline profiler', () => { it('should mark passive and layout effects', async () => { function ComponentWithEffects() { React.useLayoutEffect(() => { - Scheduler.unstable_yieldValue('layout 1 mount'); + Scheduler.log('layout 1 mount'); return () => { - Scheduler.unstable_yieldValue('layout 1 unmount'); + Scheduler.log('layout 1 unmount'); }; }, []); React.useEffect(() => { - Scheduler.unstable_yieldValue('passive 1 mount'); + Scheduler.log('passive 1 mount'); return () => { - Scheduler.unstable_yieldValue('passive 1 unmount'); + Scheduler.log('passive 1 unmount'); }; }, []); React.useLayoutEffect(() => { - Scheduler.unstable_yieldValue('layout 2 mount'); + Scheduler.log('layout 2 mount'); return () => { - Scheduler.unstable_yieldValue('layout 2 unmount'); + Scheduler.log('layout 2 unmount'); }; }, []); React.useEffect(() => { - Scheduler.unstable_yieldValue('passive 2 mount'); + Scheduler.log('passive 2 mount'); return () => { - Scheduler.unstable_yieldValue('passive 2 unmount'); + Scheduler.log('passive 2 unmount'); }; }, []); React.useEffect(() => { - Scheduler.unstable_yieldValue('passive 3 mount'); + Scheduler.log('passive 3 mount'); return () => { - Scheduler.unstable_yieldValue('passive 3 unmount'); + Scheduler.log('passive 3 unmount'); }; }, []); @@ -1327,12 +1327,12 @@ describe('Timeline profiler', () => { // @reactVersion >=18.0 it('should mark render yields', async () => { function Bar() { - Scheduler.unstable_yieldValue('Bar'); + Scheduler.log('Bar'); return null; } function Foo() { - Scheduler.unstable_yieldValue('Foo'); + Scheduler.log('Foo'); return ; } @@ -1363,7 +1363,7 @@ describe('Timeline profiler', () => { }); function Example() { - Scheduler.unstable_yieldValue(resolved ? 'resolved' : 'suspended'); + Scheduler.log(resolved ? 'resolved' : 'suspended'); if (!resolved) { throw suspensePromise; } @@ -1421,7 +1421,7 @@ describe('Timeline profiler', () => { }); function Example() { - Scheduler.unstable_yieldValue(rejected ? 'rejected' : 'suspended'); + Scheduler.log(rejected ? 'rejected' : 'suspended'); if (!rejected) { throw suspensePromise; } @@ -1479,7 +1479,7 @@ describe('Timeline profiler', () => { }); function Example() { - Scheduler.unstable_yieldValue(resolved ? 'resolved' : 'suspended'); + Scheduler.log(resolved ? 'resolved' : 'suspended'); if (!resolved) { throw suspensePromise; } @@ -1537,7 +1537,7 @@ describe('Timeline profiler', () => { }); function Example() { - Scheduler.unstable_yieldValue(rejected ? 'rejected' : 'suspended'); + Scheduler.log(rejected ? 'rejected' : 'suspended'); if (!rejected) { throw suspensePromise; } @@ -1591,9 +1591,7 @@ describe('Timeline profiler', () => { } render() { Scheduler.unstable_advanceTime(10); - Scheduler.unstable_yieldValue( - this.state.didMount ? 'update' : 'mount', - ); + Scheduler.log(this.state.didMount ? 'update' : 'mount'); return null; } } @@ -1652,7 +1650,7 @@ describe('Timeline profiler', () => { } render() { Scheduler.unstable_advanceTime(10); - Scheduler.unstable_yieldValue(forced ? 'force update' : 'mount'); + Scheduler.log(forced ? 'force update' : 'mount'); return null; } } @@ -1708,7 +1706,7 @@ describe('Timeline profiler', () => { this.setState({didRender: true}); } Scheduler.unstable_advanceTime(10); - Scheduler.unstable_yieldValue( + Scheduler.log( this.state.didRender ? 'second render' : 'first render', ); return null; @@ -1775,7 +1773,7 @@ describe('Timeline profiler', () => { class Example extends React.Component { render() { Scheduler.unstable_advanceTime(10); - Scheduler.unstable_yieldValue(forced ? 'force update' : 'render'); + Scheduler.log(forced ? 'force update' : 'render'); if (!forced) { forced = true; this.forceUpdate(); @@ -1845,7 +1843,7 @@ describe('Timeline profiler', () => { setDidMount(true); }, []); Scheduler.unstable_advanceTime(10); - Scheduler.unstable_yieldValue(didMount ? 'update' : 'mount'); + Scheduler.log(didMount ? 'update' : 'mount'); return didMount; } @@ -1909,7 +1907,7 @@ describe('Timeline profiler', () => { setDidMount(true); }, []); Scheduler.unstable_advanceTime(10); - Scheduler.unstable_yieldValue(didMount ? 'update' : 'mount'); + Scheduler.log(didMount ? 'update' : 'mount'); return didMount; } @@ -1971,7 +1969,7 @@ describe('Timeline profiler', () => { if (!didRender) { setDidRender(true); } - Scheduler.unstable_yieldValue(didRender ? 'update' : 'mount'); + Scheduler.log(didRender ? 'update' : 'mount'); return didRender; } @@ -2024,16 +2022,16 @@ describe('Timeline profiler', () => { render() { Scheduler.unstable_advanceTime(10); if (this.state.error) { - Scheduler.unstable_yieldValue('ErrorBoundary fallback'); + Scheduler.log('ErrorBoundary fallback'); return null; } - Scheduler.unstable_yieldValue('ErrorBoundary render'); + Scheduler.log('ErrorBoundary render'); return this.props.children; } } function ExampleThatThrows() { - Scheduler.unstable_yieldValue('ExampleThatThrows'); + Scheduler.log('ExampleThatThrows'); throw Error('Expected error'); } @@ -2119,16 +2117,16 @@ describe('Timeline profiler', () => { render() { Scheduler.unstable_advanceTime(10); if (this.state.error) { - Scheduler.unstable_yieldValue('ErrorBoundary fallback'); + Scheduler.log('ErrorBoundary fallback'); return null; } - Scheduler.unstable_yieldValue('ErrorBoundary render'); + Scheduler.log('ErrorBoundary render'); return this.props.children; } } function ExampleThatThrows() { - Scheduler.unstable_yieldValue('ExampleThatThrows'); + Scheduler.log('ExampleThatThrows'); // eslint-disable-next-line no-throw-literal throw 'Expected error'; } @@ -2231,37 +2229,37 @@ describe('Timeline profiler', () => { it('should mark passive and layout effects', async () => { function ComponentWithEffects() { React.useLayoutEffect(() => { - Scheduler.unstable_yieldValue('layout 1 mount'); + Scheduler.log('layout 1 mount'); return () => { - Scheduler.unstable_yieldValue('layout 1 unmount'); + Scheduler.log('layout 1 unmount'); }; }, []); React.useEffect(() => { - Scheduler.unstable_yieldValue('passive 1 mount'); + Scheduler.log('passive 1 mount'); return () => { - Scheduler.unstable_yieldValue('passive 1 unmount'); + Scheduler.log('passive 1 unmount'); }; }, []); React.useLayoutEffect(() => { - Scheduler.unstable_yieldValue('layout 2 mount'); + Scheduler.log('layout 2 mount'); return () => { - Scheduler.unstable_yieldValue('layout 2 unmount'); + Scheduler.log('layout 2 unmount'); }; }, []); React.useEffect(() => { - Scheduler.unstable_yieldValue('passive 2 mount'); + Scheduler.log('passive 2 mount'); return () => { - Scheduler.unstable_yieldValue('passive 2 unmount'); + Scheduler.log('passive 2 unmount'); }; }, []); React.useEffect(() => { - Scheduler.unstable_yieldValue('passive 3 mount'); + Scheduler.log('passive 3 mount'); return () => { - Scheduler.unstable_yieldValue('passive 3 unmount'); + Scheduler.log('passive 3 unmount'); }; }, []); @@ -2464,7 +2462,7 @@ describe('Timeline profiler', () => { it('should generate component stacks for state update', async () => { function CommponentWithChildren({initialRender}) { - Scheduler.unstable_yieldValue('Render ComponentWithChildren'); + Scheduler.log('Render ComponentWithChildren'); return ; } @@ -2473,7 +2471,7 @@ describe('Timeline profiler', () => { if (!didRender) { setDidRender(true); } - Scheduler.unstable_yieldValue('Render Child'); + Scheduler.log('Render Child'); return null; } diff --git a/packages/react-devtools-shared/src/__tests__/preprocessData-test.js b/packages/react-devtools-shared/src/__tests__/preprocessData-test.js index 1f713b51e08b3..5a518c2bf4bfe 100644 --- a/packages/react-devtools-shared/src/__tests__/preprocessData-test.js +++ b/packages/react-devtools-shared/src/__tests__/preprocessData-test.js @@ -1352,7 +1352,7 @@ describe('Timeline profiler', () => { // @reactVersion >= 18.0 it('should not warn when React finishes a previously long (async) update with a short (sync) update inside of an event', async () => { function Yield({id, value}) { - Scheduler.unstable_yieldValue(`${id}:${value}`); + Scheduler.log(`${id}:${value}`); return null; } @@ -1415,9 +1415,7 @@ describe('Timeline profiler', () => { it('should not warn about short nested (state) updates during layout effects', async () => { function Component() { const [didMount, setDidMount] = React.useState(false); - Scheduler.unstable_yieldValue( - `Component ${didMount ? 'update' : 'mount'}`, - ); + Scheduler.log(`Component ${didMount ? 'update' : 'mount'}`); React.useLayoutEffect(() => { setDidMount(true); }, []); @@ -1453,7 +1451,7 @@ describe('Timeline profiler', () => { this.forceUpdate(); } render() { - Scheduler.unstable_yieldValue( + Scheduler.log( `Component ${this._didMount ? 'update' : 'mount'}`, ); return null; @@ -1485,9 +1483,7 @@ describe('Timeline profiler', () => { it.skip('should warn about long nested (state) updates during layout effects', async () => { function Component() { const [didMount, setDidMount] = React.useState(false); - Scheduler.unstable_yieldValue( - `Component ${didMount ? 'update' : 'mount'}`, - ); + Scheduler.log(`Component ${didMount ? 'update' : 'mount'}`); // Fake a long render startTime += 20000; React.useLayoutEffect(() => { @@ -1549,7 +1545,7 @@ describe('Timeline profiler', () => { this.forceUpdate(); } render() { - Scheduler.unstable_yieldValue( + Scheduler.log( `Component ${this._didMount ? 'update' : 'mount'}`, ); return null; @@ -1606,13 +1602,11 @@ describe('Timeline profiler', () => { // eslint-disable-next-line no-unused-vars const [isPending, startTransition] = React.useTransition(); - Scheduler.unstable_yieldValue( - `Component rendered with value ${value}`, - ); + Scheduler.log(`Component rendered with value ${value}`); // Fake a long render if (value !== 0) { - Scheduler.unstable_yieldValue('Long render'); + Scheduler.log('Long render'); startTime += 20000; } @@ -1677,13 +1671,13 @@ describe('Timeline profiler', () => { const [value, setValue] = React.useState(0); const deferredValue = React.useDeferredValue(value); - Scheduler.unstable_yieldValue( + Scheduler.log( `Component rendered with value ${value} and deferredValue ${deferredValue}`, ); // Fake a long render if (deferredValue !== 0) { - Scheduler.unstable_yieldValue('Long render'); + Scheduler.log('Long render'); startTime += 20000; } @@ -1805,7 +1799,7 @@ describe('Timeline profiler', () => { } function Component({shouldSuspend}) { - Scheduler.unstable_yieldValue(`Component ${shouldSuspend}`); + Scheduler.log(`Component ${shouldSuspend}`); if (shouldSuspend) { readValue(123); } @@ -1863,7 +1857,7 @@ describe('Timeline profiler', () => { } function Component({shouldSuspend}) { - Scheduler.unstable_yieldValue(`Component ${shouldSuspend}`); + Scheduler.log(`Component ${shouldSuspend}`); if (shouldSuspend) { readValue(123); } diff --git a/packages/react-devtools-shared/src/__tests__/setupTests.js b/packages/react-devtools-shared/src/__tests__/setupTests.js index 9a21dfa4a7b6d..309690983d6f8 100644 --- a/packages/react-devtools-shared/src/__tests__/setupTests.js +++ b/packages/react-devtools-shared/src/__tests__/setupTests.js @@ -177,7 +177,3 @@ afterEach(() => { // so that we don't disconnect the ReactCurrentDispatcher ref. jest.resetModules(); }); - -expect.extend({ - ...require('../../../../scripts/jest/matchers/schedulerTestMatchers'), -}); diff --git a/packages/react-dom/src/__tests__/ReactDOMFiberAsync-test.js b/packages/react-dom/src/__tests__/ReactDOMFiberAsync-test.js index a349f244ad8c7..5fc2b2b9744a0 100644 --- a/packages/react-dom/src/__tests__/ReactDOMFiberAsync-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMFiberAsync-test.js @@ -600,7 +600,7 @@ describe('ReactDOMFiberAsync', () => { const root = ReactDOMClient.createRoot(container); function Text(props) { - Scheduler.unstable_yieldValue(props.text); + Scheduler.log(props.text); return props.text; } diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js index 77ad903f9d261..b95595a4c4cc4 100644 --- a/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js @@ -2118,7 +2118,7 @@ describe('ReactDOMFizzServer', () => { } function Child({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return text; } @@ -2153,9 +2153,7 @@ describe('ReactDOMFizzServer', () => { ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue( - 'Log recoverable error: ' + error.message, - ); + Scheduler.log('Log recoverable error: ' + error.message); }, }); @@ -2203,7 +2201,7 @@ describe('ReactDOMFizzServer', () => { return () => {}; } function Child({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return text; } function App() { @@ -2238,9 +2236,7 @@ describe('ReactDOMFizzServer', () => { ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue( - 'Log recoverable error: ' + error.message, - ); + Scheduler.log('Log recoverable error: ' + error.message); }, }); @@ -2296,7 +2292,7 @@ describe('ReactDOMFizzServer', () => { getClientSnapshot, getServerSnapshot, ); - Scheduler.unstable_yieldValue(value); + Scheduler.log(value); return value; } @@ -2323,7 +2319,7 @@ describe('ReactDOMFizzServer', () => { isClient = true; ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); @@ -2378,7 +2374,7 @@ describe('ReactDOMFizzServer', () => { getClientSnapshot, getServerSnapshot, ); - Scheduler.unstable_yieldValue(value); + Scheduler.log(value); return value; } @@ -2413,7 +2409,7 @@ describe('ReactDOMFizzServer', () => { isClient = true; ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); @@ -2468,7 +2464,7 @@ describe('ReactDOMFizzServer', () => { if (isClient) { throw new Error('Oops!'); } - Scheduler.unstable_yieldValue('Yay!'); + Scheduler.log('Yay!'); return 'Yay!'; } @@ -2527,7 +2523,7 @@ describe('ReactDOMFizzServer', () => { } else { throw Error('Oops.'); } - Scheduler.unstable_yieldValue('Yay!'); + Scheduler.log('Yay!'); return 'Yay!'; } @@ -2546,7 +2542,7 @@ describe('ReactDOMFizzServer', () => { await act(async () => { const {pipe} = renderToPipeableStream(, { onError(error) { - Scheduler.unstable_yieldValue('[s!] ' + error.message); + Scheduler.log('[s!] ' + error.message); }, }); pipe(writable); @@ -2561,7 +2557,7 @@ describe('ReactDOMFizzServer', () => { isClient = true; ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue('[c!] ' + error.message); + Scheduler.log('[c!] ' + error.message); }, }); // This should not report any errors yet. @@ -2612,7 +2608,7 @@ describe('ReactDOMFizzServer', () => { } else { throw Error('Oops.'); } - Scheduler.unstable_yieldValue('Yay! (' + color + ')'); + Scheduler.log('Yay! (' + color + ')'); return 'Yay! (' + color + ')'; } @@ -2631,7 +2627,7 @@ describe('ReactDOMFizzServer', () => { await act(async () => { const {pipe} = renderToPipeableStream(, { onError(error) { - Scheduler.unstable_yieldValue('[s!] ' + error.message); + Scheduler.log('[s!] ' + error.message); }, }); pipe(writable); @@ -2646,7 +2642,7 @@ describe('ReactDOMFizzServer', () => { isClient = true; const root = ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue('[c!] ' + error.message); + Scheduler.log('[c!] ' + error.message); }, }); // This should not report any errors yet. @@ -2709,7 +2705,7 @@ describe('ReactDOMFizzServer', () => { } else { throw Error('Oops.'); } - Scheduler.unstable_yieldValue(value); + Scheduler.log(value); return value; } @@ -2731,7 +2727,7 @@ describe('ReactDOMFizzServer', () => { , { onError(error) { - Scheduler.unstable_yieldValue('[s!] ' + error.message); + Scheduler.log('[s!] ' + error.message); }, }, ); @@ -2749,7 +2745,7 @@ describe('ReactDOMFizzServer', () => { , { onRecoverableError(error) { - Scheduler.unstable_yieldValue('[c!] ' + error.message); + Scheduler.log('[c!] ' + error.message); }, }, ); @@ -2833,7 +2829,7 @@ describe('ReactDOMFizzServer', () => { if (isClient) { readText(value); } - Scheduler.unstable_yieldValue(value); + Scheduler.log(value); return value; } @@ -2868,7 +2864,7 @@ describe('ReactDOMFizzServer', () => { isClient = true; ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); @@ -2914,15 +2910,15 @@ describe('ReactDOMFizzServer', () => { function A() { if (shouldThrow) { - Scheduler.unstable_yieldValue('Oops!'); + Scheduler.log('Oops!'); throw new Error('Oops!'); } - Scheduler.unstable_yieldValue('A'); + Scheduler.log('A'); return 'A'; } function B() { - Scheduler.unstable_yieldValue('B'); + Scheduler.log('B'); return 'B'; } @@ -2937,9 +2933,7 @@ describe('ReactDOMFizzServer', () => { const root = ReactDOMClient.createRoot(container, { onRecoverableError(error) { - Scheduler.unstable_yieldValue( - 'Logged a recoverable error: ' + error.message, - ); + Scheduler.log('Logged a recoverable error: ' + error.message); }, }); React.startTransition(() => { @@ -2990,7 +2984,7 @@ describe('ReactDOMFizzServer', () => { // useSyncExternalStore in this test is because getServerSnapshot has the // ability to observe whether we're hydrating. useSyncExternalStore(subscribe, getClientSnapshot, getServerSnapshot); - Scheduler.unstable_yieldValue(label); + Scheduler.log(label); return label; } @@ -3018,9 +3012,7 @@ describe('ReactDOMFizzServer', () => { isClient = true; ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue( - 'Logged recoverable error: ' + error.message, - ); + Scheduler.log('Logged recoverable error: ' + error.message); }, }); @@ -3722,9 +3714,7 @@ describe('ReactDOMFizzServer', () => { const [ClientApp, clientResolve] = makeApp(); ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue( - 'Logged recoverable error: ' + error.message, - ); + Scheduler.log('Logged recoverable error: ' + error.message); }, }); Scheduler.unstable_flushAll(); @@ -3801,9 +3791,7 @@ describe('ReactDOMFizzServer', () => { const [ClientApp, clientResolve] = makeApp(); ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue( - 'Logged recoverable error: ' + error.message, - ); + Scheduler.log('Logged recoverable error: ' + error.message); }, }); Scheduler.unstable_flushAll(); @@ -3872,9 +3860,7 @@ describe('ReactDOMFizzServer', () => { ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue( - 'Logged recoverable error: ' + error.message, - ); + Scheduler.log('Logged recoverable error: ' + error.message); }, }); await waitForAll([ @@ -3963,9 +3949,7 @@ describe('ReactDOMFizzServer', () => { ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue( - 'Logged recoverable error: ' + error.message, - ); + Scheduler.log('Logged recoverable error: ' + error.message); }, }); await waitForAll([ @@ -4005,7 +3989,7 @@ describe('ReactDOMFizzServer', () => { function ThrowUntilOnClient({children, message}) { if (isClient && shouldThrow) { - Scheduler.unstable_yieldValue('throwing: ' + message); + Scheduler.log('throwing: ' + message); throw new Error(message); } return children; @@ -4055,9 +4039,7 @@ describe('ReactDOMFizzServer', () => { ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue( - 'Logged recoverable error: ' + error.message, - ); + Scheduler.log('Logged recoverable error: ' + error.message); }, }); await waitForAll([ @@ -4127,7 +4109,7 @@ describe('ReactDOMFizzServer', () => { }; }); } - Scheduler.unstable_yieldValue('suspending'); + Scheduler.log('suspending'); throw promise; } return null; @@ -4135,7 +4117,7 @@ describe('ReactDOMFizzServer', () => { function ThrowUntilOnClient({children, message}) { if (isClient && shouldThrow) { - Scheduler.unstable_yieldValue('throwing: ' + message); + Scheduler.log('throwing: ' + message); throw new Error(message); } return children; @@ -4186,9 +4168,7 @@ describe('ReactDOMFizzServer', () => { ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue( - 'Logged recoverable error: ' + error.message, - ); + Scheduler.log('Logged recoverable error: ' + error.message); }, }); await waitForAll([ @@ -4250,7 +4230,7 @@ describe('ReactDOMFizzServer', () => { }; }); } - Scheduler.unstable_yieldValue('suspending'); + Scheduler.log('suspending'); throw promise; } return null; @@ -4258,7 +4238,7 @@ describe('ReactDOMFizzServer', () => { function ThrowUntilOnClient({children, message}) { if (isClient && shouldThrow) { - Scheduler.unstable_yieldValue('throwing: ' + message); + Scheduler.log('throwing: ' + message); throw new Error(message); } return children; @@ -4309,9 +4289,7 @@ describe('ReactDOMFizzServer', () => { ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue( - 'Logged recoverable error: ' + error.message, - ); + Scheduler.log('Logged recoverable error: ' + error.message); }, }); await waitForAll([ diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzShellHydration-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzShellHydration-test.js index 812946c6e4b03..7d60cb0f33134 100644 --- a/packages/react-dom/src/__tests__/ReactDOMFizzShellHydration-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMFizzShellHydration-test.js @@ -129,7 +129,7 @@ describe('ReactDOMFizzShellHydration', () => { return record.value; } } else { - Scheduler.unstable_yieldValue(`Suspend! [${text}]`); + Scheduler.log(`Suspend! [${text}]`); const thenable = { pings: [], @@ -153,13 +153,13 @@ describe('ReactDOMFizzShellHydration', () => { } function Text({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return text; } function AsyncText({text}) { readText(text); - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return text; } @@ -275,7 +275,7 @@ describe('ReactDOMFizzShellHydration', () => { const root = await clientAct(async () => { return ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); }); diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzSuppressHydrationWarning-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzSuppressHydrationWarning-test.js index eeeb9c6600d6e..28796171aefb0 100644 --- a/packages/react-dom/src/__tests__/ReactDOMFizzSuppressHydrationWarning-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMFizzSuppressHydrationWarning-test.js @@ -156,7 +156,7 @@ describe('ReactDOMFizzServerHydrationWarning', () => { ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { // Don't miss a hydration error. There should be none. - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); await waitForAll([]); @@ -196,7 +196,7 @@ describe('ReactDOMFizzServerHydrationWarning', () => { ); ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); await waitForAll([]); @@ -237,7 +237,7 @@ describe('ReactDOMFizzServerHydrationWarning', () => { ); ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); await expect(async () => { @@ -284,7 +284,7 @@ describe('ReactDOMFizzServerHydrationWarning', () => { ); ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); await waitForAll([]); @@ -320,7 +320,7 @@ describe('ReactDOMFizzServerHydrationWarning', () => { ); ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); await expect(async () => { @@ -368,7 +368,7 @@ describe('ReactDOMFizzServerHydrationWarning', () => { ); ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); await expect(async () => { @@ -419,7 +419,7 @@ describe('ReactDOMFizzServerHydrationWarning', () => { ); ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); await expect(async () => { @@ -468,7 +468,7 @@ describe('ReactDOMFizzServerHydrationWarning', () => { ); ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); await expect(async () => { @@ -522,7 +522,7 @@ describe('ReactDOMFizzServerHydrationWarning', () => { ); ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); await waitForAll([]); @@ -559,7 +559,7 @@ describe('ReactDOMFizzServerHydrationWarning', () => { ); ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); await waitForAll([]); @@ -592,7 +592,7 @@ describe('ReactDOMFizzServerHydrationWarning', () => { ); ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); await expect(async () => { @@ -638,7 +638,7 @@ describe('ReactDOMFizzServerHydrationWarning', () => { ); ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); await expect(async () => { diff --git a/packages/react-dom/src/__tests__/ReactDOMImageLoad-test.internal.js b/packages/react-dom/src/__tests__/ReactDOMImageLoad-test.internal.js index 304e1f5cb65bb..7e38923991fae 100644 --- a/packages/react-dom/src/__tests__/ReactDOMImageLoad-test.internal.js +++ b/packages/react-dom/src/__tests__/ReactDOMImageLoad-test.internal.js @@ -29,12 +29,12 @@ let waitFor; let assertLog; function PhaseMarkers({children}) { - Scheduler.unstable_yieldValue('render start'); + Scheduler.log('render start'); React.useLayoutEffect(() => { - Scheduler.unstable_yieldValue('last layout'); + Scheduler.log('last layout'); }); React.useEffect(() => { - Scheduler.unstable_yieldValue('last passive'); + Scheduler.log('last passive'); }); return children; } @@ -50,7 +50,7 @@ function last(arr) { } function Text(props) { - Scheduler.unstable_yieldValue(props.text); + Scheduler.log(props.text); return props.text; } @@ -58,13 +58,13 @@ function Text(props) { // const text = props.text; // try { // TextResource.read([props.text, props.ms]); -// Scheduler.unstable_yieldValue(text); +// Scheduler.log(text); // return text; // } catch (promise) { // if (typeof promise.then === 'function') { -// Scheduler.unstable_yieldValue(`Suspend! [${text}]`); +// Scheduler.log(`Suspend! [${text}]`); // } else { -// Scheduler.unstable_yieldValue(`Error! [${text}]`); +// Scheduler.log(`Error! [${text}]`); // } // throw promise; // } @@ -72,12 +72,12 @@ function Text(props) { function Img({src: maybeSrc, onLoad, useImageLoader, ref}) { const src = maybeSrc || 'default'; - Scheduler.unstable_yieldValue('Img ' + src); + Scheduler.log('Img ' + src); return ; } function Yield() { - Scheduler.unstable_yieldValue('Yield'); + Scheduler.log('Yield'); Scheduler.unstable_requestPaint(); return null; } @@ -105,12 +105,12 @@ describe('ReactDOMImageLoad', () => { onLoadSpy = jest.fn(reactEvent => { const src = reactEvent.target.getAttribute('src'); - Scheduler.unstable_yieldValue('onLoadSpy [' + src + ']'); + Scheduler.log('onLoadSpy [' + src + ']'); }); actualLoadSpy = jest.fn(nativeEvent => { const src = nativeEvent.target.getAttribute('src'); - Scheduler.unstable_yieldValue('actualLoadSpy [' + src + ']'); + Scheduler.log('actualLoadSpy [' + src + ']'); nativeEvent.__originalDispatch = false; }); @@ -127,14 +127,14 @@ describe('ReactDOMImageLoad', () => { // listeners = [{resolve, reject}]; // setTimeout(() => { // if (textResourceShouldFail) { - // Scheduler.unstable_yieldValue( + // Scheduler.log( // `Promise rejected [${text}]`, // ); // status = 'rejected'; // value = new Error('Failed to load: ' + text); // listeners.forEach(listener => listener.reject(value)); // } else { - // Scheduler.unstable_yieldValue( + // Scheduler.log( // `Promise resolved [${text}]`, // ); // status = 'resolved'; @@ -185,7 +185,7 @@ describe('ReactDOMImageLoad', () => { return this.getAttribute('src'); }, set(value) { - Scheduler.unstable_yieldValue('load triggered'); + Scheduler.log('load triggered'); this.__needsDispatch = true; this.setAttribute('src', value); }, @@ -438,7 +438,7 @@ describe('ReactDOMImageLoad', () => { // it('captures the load event if it happens in a suspended subtree and replays it between layout and passive effects on resumption', async function() { // function SuspendingWithImage() { - // Scheduler.unstable_yieldValue('SuspendingWithImage'); + // Scheduler.log('SuspendingWithImage'); // return ( // }> // @@ -511,9 +511,9 @@ describe('ReactDOMImageLoad', () => { } function YieldingWithImage({src}) { - Scheduler.unstable_yieldValue('YieldingWithImage'); + Scheduler.log('YieldingWithImage'); React.useEffect(() => { - Scheduler.unstable_yieldValue('Committed'); + Scheduler.log('Committed'); }); return ( <> diff --git a/packages/react-dom/src/__tests__/ReactDOMNativeEventHeuristic-test.js b/packages/react-dom/src/__tests__/ReactDOMNativeEventHeuristic-test.js index 609eca887dde2..ead8b54eb519b 100644 --- a/packages/react-dom/src/__tests__/ReactDOMNativeEventHeuristic-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMNativeEventHeuristic-test.js @@ -287,7 +287,7 @@ describe('ReactDOMNativeEventHeuristic-test', () => { const target = React.createRef(null); function Foo({hovered}) { const hoverString = hovered ? 'hovered' : 'not hovered'; - Scheduler.unstable_yieldValue(hoverString); + Scheduler.log(hoverString); return
{hoverString}
; } @@ -367,7 +367,7 @@ describe('ReactDOMNativeEventHeuristic-test', () => { ReactDOM.unstable_batchedUpdates(() => { setCount(count + 1); }); - Scheduler.unstable_yieldValue( + Scheduler.log( container.textContent + ' [after batchedUpdates]', ); }; diff --git a/packages/react-dom/src/__tests__/ReactDOMNestedEvents-test.js b/packages/react-dom/src/__tests__/ReactDOMNestedEvents-test.js index ee6abf41da8d7..e34e2f7a6789f 100644 --- a/packages/react-dom/src/__tests__/ReactDOMNestedEvents-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMNestedEvents-test.js @@ -41,9 +41,7 @@ describe('ReactDOMNestedEvents', () => { // The update triggered by the focus event should not have flushed yet. // Nor the click update. They would have if we had wrapped the focus // call in `flushSync`, though. - Scheduler.unstable_yieldValue( - 'Value right after focus call: ' + el.innerHTML, - ); + Scheduler.log('Value right after focus call: ' + el.innerHTML); }; const onFocus = () => { setIsFocused(true); diff --git a/packages/react-dom/src/__tests__/ReactDOMRoot-test.js b/packages/react-dom/src/__tests__/ReactDOMRoot-test.js index 6d1db3fdee419..c8f67f580eb7b 100644 --- a/packages/react-dom/src/__tests__/ReactDOMRoot-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMRoot-test.js @@ -258,7 +258,7 @@ describe('ReactDOMRoot', () => { it('callback passed to legacy hydrate() API', () => { container.innerHTML = '
Hi
'; ReactDOM.hydrate(
Hi
, container, () => { - Scheduler.unstable_yieldValue('callback'); + Scheduler.log('callback'); }); expect(container.textContent).toEqual('Hi'); assertLog(['callback']); @@ -394,7 +394,7 @@ describe('ReactDOMRoot', () => { }); function Foo({value}) { - Scheduler.unstable_yieldValue(value); + Scheduler.log(value); return
{value}
; } diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationHooks-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationHooks-test.js index 96f64b70dbbf6..08f0b1a8a7de8 100644 --- a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationHooks-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationHooks-test.js @@ -32,7 +32,7 @@ let useDebugValue; let forwardRef; let yieldedValues; let yieldValue; -let clearYields; +let clearLog; function initModules() { // Reset warning cache. @@ -59,7 +59,7 @@ function initModules() { yieldValue = value => { yieldedValues.push(value); }; - clearYields = () => { + clearLog = () => { const ret = yieldedValues; yieldedValues = []; return ret; @@ -207,7 +207,7 @@ describe('ReactDOMServerHooks', () => { const domNode = await render(); - expect(clearYields()).toEqual(['Render: 0', 0]); + expect(clearLog()).toEqual(['Render: 0', 0]); expect(domNode.tagName).toEqual('SPAN'); expect(domNode.textContent).toEqual('0'); }); @@ -224,7 +224,7 @@ describe('ReactDOMServerHooks', () => { const domNode = await render(); - expect(clearYields()).toEqual(['Render: 1', 1]); + expect(clearLog()).toEqual(['Render: 1', 1]); expect(domNode.tagName).toEqual('SPAN'); expect(domNode.textContent).toEqual('1'); }); @@ -246,7 +246,7 @@ describe('ReactDOMServerHooks', () => { const domNode = await render(); - expect(clearYields()).toEqual([ + expect(clearLog()).toEqual([ 'Render: 0', 'Render: 1', 'Render: 2', @@ -299,7 +299,7 @@ describe('ReactDOMServerHooks', () => { const domNode = await render(); - expect(clearYields()).toEqual([ + expect(clearLog()).toEqual([ // The count should increase by alternating amounts of 10 and 1 // until we reach 21. 'Render: 0', @@ -326,7 +326,7 @@ describe('ReactDOMServerHooks', () => { } const domNode = await render(); - expect(clearYields()).toEqual(["Capitalize 'hello'", 'HELLO']); + expect(clearLog()).toEqual(["Capitalize 'hello'", 'HELLO']); expect(domNode.tagName).toEqual('SPAN'); expect(domNode.textContent).toEqual('HELLO'); }); @@ -343,7 +343,7 @@ describe('ReactDOMServerHooks', () => { } const domNode = await render(); - expect(clearYields()).toEqual(['compute A', 'A']); + expect(clearLog()).toEqual(['compute A', 'A']); expect(domNode.tagName).toEqual('SPAN'); expect(domNode.textContent).toEqual('A'); }); @@ -365,7 +365,7 @@ describe('ReactDOMServerHooks', () => { } const domNode = await render(); - expect(clearYields()).toEqual([ + expect(clearLog()).toEqual([ "Capitalize 'hello'", "Capitalize 'hello, world.'", 'HELLO, WORLD.', @@ -399,7 +399,7 @@ describe('ReactDOMServerHooks', () => { } const domNode = await render(); - expect(clearYields()).toEqual([ + expect(clearLog()).toEqual([ "Capitalize 'hello'", 0, 1, @@ -470,7 +470,7 @@ describe('ReactDOMServerHooks', () => { } const domNode = await render(); - expect(clearYields()).toEqual([0, 1, 2, 3]); + expect(clearLog()).toEqual([0, 1, 2, 3]); expect(domNode.textContent).toEqual('Count: 3'); }, ); @@ -500,7 +500,7 @@ describe('ReactDOMServerHooks', () => { } const domNode = await render(); - expect(clearYields()).toEqual([0, 1, 2, 3]); + expect(clearLog()).toEqual([0, 1, 2, 3]); expect(domNode.textContent).toEqual('Count: 3'); }, ); @@ -517,7 +517,7 @@ describe('ReactDOMServerHooks', () => { } const domNode = await render(); - yields.push(clearYields()); + yields.push(clearLog()); expect(domNode.tagName).toEqual('SPAN'); expect(domNode.textContent).toEqual('Count: 0'); }); @@ -542,7 +542,7 @@ describe('ReactDOMServerHooks', () => { return ; } const domNode = await render(); - expect(clearYields()).toEqual(['Count: 0']); + expect(clearLog()).toEqual(['Count: 0']); expect(domNode.tagName).toEqual('SPAN'); expect(domNode.textContent).toEqual('Count: 0'); }); @@ -555,7 +555,7 @@ describe('ReactDOMServerHooks', () => { return ; } const domNode = await render(); - expect(clearYields()).toEqual(['Count: 5']); + expect(clearLog()).toEqual(['Count: 5']); expect(domNode.tagName).toEqual('SPAN'); expect(domNode.textContent).toEqual('Count: 5'); }); @@ -578,7 +578,7 @@ describe('ReactDOMServerHooks', () => { } const domNode = await render(); - const [first, second, third, fourth, result] = clearYields(); + const [first, second, third, fourth, result] = clearLog(); expect(first).toBe(second); expect(second).toBe(third); expect(third).not.toBe(fourth); @@ -603,7 +603,7 @@ describe('ReactDOMServerHooks', () => { const domNode = await serverRender( , ); - expect(clearYields()).toEqual(['Count: 0']); + expect(clearLog()).toEqual(['Count: 0']); expect(domNode.tagName).toEqual('SPAN'); expect(domNode.textContent).toEqual('Count: 0'); }); @@ -618,7 +618,7 @@ describe('ReactDOMServerHooks', () => { return ; } const domNode = await serverRender(, 1); - expect(clearYields()).toEqual(['Count: 0']); + expect(clearLog()).toEqual(['Count: 0']); expect(domNode.tagName).toEqual('SPAN'); expect(domNode.textContent).toEqual('Count: 0'); }); @@ -634,7 +634,7 @@ describe('ReactDOMServerHooks', () => { return ; } const domNode = await serverRender(, 1); - expect(clearYields()).toEqual(['Count: 0']); + expect(clearLog()).toEqual(['Count: 0']); expect(domNode.tagName).toEqual('SPAN'); expect(domNode.textContent).toEqual('Count: 0'); }); @@ -738,7 +738,7 @@ describe('ReactDOMServerHooks', () => { } const domNode = await render(); - expect(clearYields()).toEqual(['Foo: 1, Bar: 3', 'Baz: 5']); + expect(clearLog()).toEqual(['Foo: 1, Bar: 3', 'Baz: 5']); expect(domNode.childNodes.length).toBe(2); expect(domNode.firstChild.tagName).toEqual('SPAN'); expect(domNode.firstChild.textContent).toEqual('Foo: 1, Bar: 3'); @@ -834,7 +834,7 @@ describe('ReactDOMServerHooks', () => { } const domNode = await render(); - expect(clearYields()).toEqual(['Foo: 1, Bar: 3', 'Baz: 5']); + expect(clearLog()).toEqual(['Foo: 1, Bar: 3', 'Baz: 5']); expect(domNode.childNodes.length).toBe(2); expect(domNode.firstChild.tagName).toEqual('SPAN'); expect(domNode.firstChild.textContent).toEqual('Foo: 1, Bar: 3'); diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationSpecialTypes-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationSpecialTypes-test.js index 6b4fb74ee100f..f3a8b869ad818 100644 --- a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationSpecialTypes-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationSpecialTypes-test.js @@ -19,8 +19,8 @@ let ReactTestUtils; let forwardRef; let memo; let yieldedValues; -let unstable_yieldValue; -let clearYields; +let log; +let clearLog; function initModules() { // Reset warning cache. @@ -33,10 +33,10 @@ function initModules() { memo = React.memo; yieldedValues = []; - unstable_yieldValue = value => { + log = value => { yieldedValues.push(value); }; - clearYields = () => { + clearLog = () => { const ret = yieldedValues; yieldedValues = []; return ret; @@ -93,7 +93,7 @@ describe('ReactDOMServerIntegration', () => { }); function Text({text}) { - unstable_yieldValue(text); + log(text); return {text}; } @@ -115,27 +115,25 @@ describe('ReactDOMServerIntegration', () => { ref.current = 0; await render(); - expect(clearYields()).toEqual(['Count: 0']); + expect(clearLog()).toEqual(['Count: 0']); }); itRenders('with comparator', async render => { const MemoCounter = memo(Counter, (oldProps, newProps) => false); await render(); - expect(clearYields()).toEqual(['Count: 0']); + expect(clearLog()).toEqual(['Count: 0']); }); itRenders( 'comparator functions are not invoked on the server', async render => { const MemoCounter = React.memo(Counter, (oldProps, newProps) => { - unstable_yieldValue( - `Old count: ${oldProps.count}, New count: ${newProps.count}`, - ); + log(`Old count: ${oldProps.count}, New count: ${newProps.count}`); return oldProps.count === newProps.count; }); await render(); - expect(clearYields()).toEqual(['Count: 0']); + expect(clearLog()).toEqual(['Count: 0']); }, ); }); diff --git a/packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js b/packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js index 7148c8163262e..e4d9e5806396a 100644 --- a/packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js +++ b/packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js @@ -234,7 +234,7 @@ describe('ReactDOMServerPartialHydration', () => { suspend = true; ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); Scheduler.unstable_flushAll(); @@ -271,15 +271,15 @@ describe('ReactDOMServerPartialHydration', () => { }); function Child() { if (suspend) { - Scheduler.unstable_yieldValue('Suspend'); + Scheduler.log('Suspend'); throw promise; } else { - Scheduler.unstable_yieldValue('Hello'); + Scheduler.log('Hello'); return 'Hello'; } } function Component({shouldMismatch}) { - Scheduler.unstable_yieldValue('Component'); + Scheduler.log('Component'); if (shouldMismatch && client) { return
Mismatch
; } @@ -311,7 +311,7 @@ describe('ReactDOMServerPartialHydration', () => { ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); await waitForAll([ @@ -435,7 +435,7 @@ describe('ReactDOMServerPartialHydration', () => { deleted.push(node); }, onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); await waitForAll([]); @@ -513,7 +513,7 @@ describe('ReactDOMServerPartialHydration', () => { act(() => { ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); }); @@ -639,7 +639,7 @@ describe('ReactDOMServerPartialHydration', () => { act(() => { ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); }); @@ -1086,7 +1086,7 @@ describe('ReactDOMServerPartialHydration', () => { , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }, ); @@ -1165,7 +1165,7 @@ describe('ReactDOMServerPartialHydration', () => { , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }, ); @@ -1242,7 +1242,7 @@ describe('ReactDOMServerPartialHydration', () => { , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }, ); @@ -1367,7 +1367,7 @@ describe('ReactDOMServerPartialHydration', () => { function Child() { const [state, setState] = React.useState('Hello'); updateText = setState; - Scheduler.unstable_yieldValue('Child'); + Scheduler.log('Child'); if (suspend) { throw promise; } else { @@ -1376,7 +1376,7 @@ describe('ReactDOMServerPartialHydration', () => { } function Sibling() { - Scheduler.unstable_yieldValue('Sibling'); + Scheduler.log('Sibling'); return null; } @@ -1559,7 +1559,7 @@ describe('ReactDOMServerPartialHydration', () => { , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }, ); @@ -1635,7 +1635,7 @@ describe('ReactDOMServerPartialHydration', () => { suspend = false; ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); if (__DEV__) { @@ -1708,7 +1708,7 @@ describe('ReactDOMServerPartialHydration', () => { suspend = false; ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); if (__DEV__) { @@ -1786,7 +1786,7 @@ describe('ReactDOMServerPartialHydration', () => { suspend = false; ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); if (__DEV__) { @@ -1994,12 +1994,12 @@ describe('ReactDOMServerPartialHydration', () => { } function Before() { - Scheduler.unstable_yieldValue('Before'); + Scheduler.log('Before'); return null; } function After() { - Scheduler.unstable_yieldValue('After'); + Scheduler.log('After'); return null; } @@ -2106,7 +2106,7 @@ describe('ReactDOMServerPartialHydration', () => { ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); @@ -2182,7 +2182,7 @@ describe('ReactDOMServerPartialHydration', () => { suspend = false; ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); if (__DEV__) { @@ -2299,7 +2299,7 @@ describe('ReactDOMServerPartialHydration', () => { , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }, ); @@ -2980,15 +2980,15 @@ describe('ReactDOMServerPartialHydration', () => { if (suspend) { throw promise; } else { - Scheduler.unstable_yieldValue('Child'); + Scheduler.log('Child'); return 'Hello'; } } function Sibling() { - Scheduler.unstable_yieldValue('Sibling'); + Scheduler.log('Sibling'); React.useLayoutEffect(() => { - Scheduler.unstable_yieldValue('Commit Sibling'); + Scheduler.log('Commit Sibling'); }); return 'World'; } @@ -3175,9 +3175,7 @@ describe('ReactDOMServerPartialHydration', () => { ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue( - 'Log recoverable error: ' + error.message, - ); + Scheduler.log('Log recoverable error: ' + error.message); }, }); @@ -3280,12 +3278,12 @@ describe('ReactDOMServerPartialHydration', () => { const visibleRef = React.createRef(); function HiddenChild() { - Scheduler.unstable_yieldValue('HiddenChild'); + Scheduler.log('HiddenChild'); return Hidden; } function App() { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); return ( <> Visible @@ -3422,9 +3420,7 @@ describe('ReactDOMServerPartialHydration', () => { act(() => { ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue( - 'Log recoverable error: ' + error.message, - ); + Scheduler.log('Log recoverable error: ' + error.message); }, }); }); @@ -3474,7 +3470,7 @@ describe('ReactDOMServerPartialHydration', () => { act(() => { ReactDOMClient.hydrateRoot(container, , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }); }); @@ -3518,7 +3514,7 @@ describe('ReactDOMServerPartialHydration', () => { , { onRecoverableError(error) { - Scheduler.unstable_yieldValue(error.message); + Scheduler.log(error.message); }, }, ); diff --git a/packages/react-dom/src/__tests__/ReactDOMServerSelectiveHydration-test.internal.js b/packages/react-dom/src/__tests__/ReactDOMServerSelectiveHydration-test.internal.js index c57c5b450d977..dcc99a570358e 100644 --- a/packages/react-dom/src/__tests__/ReactDOMServerSelectiveHydration-test.internal.js +++ b/packages/react-dom/src/__tests__/ReactDOMServerSelectiveHydration-test.internal.js @@ -154,12 +154,12 @@ describe('ReactDOMServerSelectiveHydration', () => { it('hydrates the target boundary synchronously during a click', async () => { function Child({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return ( { e.preventDefault(); - Scheduler.unstable_yieldValue('Clicked ' + text); + Scheduler.log('Clicked ' + text); }}> {text} @@ -167,7 +167,7 @@ describe('ReactDOMServerSelectiveHydration', () => { } function App() { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); return (
@@ -222,12 +222,12 @@ describe('ReactDOMServerSelectiveHydration', () => { if ((text === 'A' || text === 'D') && suspend) { throw promise; } - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return ( { e.preventDefault(); - Scheduler.unstable_yieldValue('Clicked ' + text); + Scheduler.log('Clicked ' + text); }}> {text} @@ -235,7 +235,7 @@ describe('ReactDOMServerSelectiveHydration', () => { } function App() { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); return (
@@ -318,12 +318,12 @@ describe('ReactDOMServerSelectiveHydration', () => { if ((text === 'A' || text === 'D') && suspend) { throw promise; } - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return ( { e.preventDefault(); - Scheduler.unstable_yieldValue('Clicked ' + text); + Scheduler.log('Clicked ' + text); }}> {text} @@ -331,7 +331,7 @@ describe('ReactDOMServerSelectiveHydration', () => { } function App() { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); return (
@@ -429,11 +429,11 @@ describe('ReactDOMServerSelectiveHydration', () => { function Child({text}) { const ref = React.useRef(null); - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); if (!isServerRendering) { React.useLayoutEffect(() => { return setClick(ref.current, () => { - Scheduler.unstable_yieldValue('Clicked ' + text); + Scheduler.log('Clicked ' + text); }); }); } @@ -442,7 +442,7 @@ describe('ReactDOMServerSelectiveHydration', () => { } function App() { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); return (
@@ -502,12 +502,12 @@ describe('ReactDOMServerSelectiveHydration', () => { if ((text === 'A' || text === 'D') && suspend) { throw promise; } - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); if (!isServerRendering) { React.useLayoutEffect(() => { return setClick(ref.current, () => { - Scheduler.unstable_yieldValue('Clicked ' + text); + Scheduler.log('Clicked ' + text); }); }); } @@ -516,7 +516,7 @@ describe('ReactDOMServerSelectiveHydration', () => { } function App() { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); return (
@@ -599,12 +599,12 @@ describe('ReactDOMServerSelectiveHydration', () => { if ((text === 'A' || text === 'D') && suspend) { throw promise; } - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); if (!isServerRendering) { React.useLayoutEffect(() => { return setClick(ref.current, () => { - Scheduler.unstable_yieldValue('Clicked ' + text); + Scheduler.log('Clicked ' + text); }); }); } @@ -612,7 +612,7 @@ describe('ReactDOMServerSelectiveHydration', () => { } function App() { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); return (
@@ -708,16 +708,16 @@ describe('ReactDOMServerSelectiveHydration', () => { if ((text === 'A' || text === 'D') && suspend) { throw promise; } - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return ( { e.preventDefault(); - Scheduler.unstable_yieldValue('Clicked ' + text); + Scheduler.log('Clicked ' + text); }} onMouseEnter={e => { e.preventDefault(); - Scheduler.unstable_yieldValue('Hover ' + text); + Scheduler.log('Hover ' + text); }}> {text} @@ -725,7 +725,7 @@ describe('ReactDOMServerSelectiveHydration', () => { } function App() { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); return (
@@ -819,44 +819,44 @@ describe('ReactDOMServerSelectiveHydration', () => { if ((text === 'A' || text === 'D') && suspend) { throw promise; } - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return ( { e.preventDefault(); - Scheduler.unstable_yieldValue('Capture Clicked ' + text); + Scheduler.log('Capture Clicked ' + text); }} onClick={e => { e.preventDefault(); - Scheduler.unstable_yieldValue('Clicked ' + text); + Scheduler.log('Clicked ' + text); }} onMouseEnter={e => { e.preventDefault(); - Scheduler.unstable_yieldValue('Mouse Enter ' + text); + Scheduler.log('Mouse Enter ' + text); }} onMouseOut={e => { e.preventDefault(); - Scheduler.unstable_yieldValue('Mouse Out ' + text); + Scheduler.log('Mouse Out ' + text); }} onMouseOutCapture={e => { e.preventDefault(); e.stopPropagation(); - Scheduler.unstable_yieldValue('Mouse Out Capture ' + text); + Scheduler.log('Mouse Out Capture ' + text); }} onMouseOverCapture={e => { e.preventDefault(); e.stopPropagation(); - Scheduler.unstable_yieldValue('Mouse Over Capture ' + text); + Scheduler.log('Mouse Over Capture ' + text); }} onMouseOver={e => { e.preventDefault(); - Scheduler.unstable_yieldValue('Mouse Over ' + text); + Scheduler.log('Mouse Over ' + text); }}>
{ e.preventDefault(); - Scheduler.unstable_yieldValue('Mouse Over Capture Inner ' + text); + Scheduler.log('Mouse Over Capture Inner ' + text); }}> {text}
@@ -865,15 +865,15 @@ describe('ReactDOMServerSelectiveHydration', () => { } function App() { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); return (
{ e.preventDefault(); - Scheduler.unstable_yieldValue('Capture Clicked Parent'); + Scheduler.log('Capture Clicked Parent'); }} onMouseOverCapture={e => { - Scheduler.unstable_yieldValue('Mouse Over Capture Parent'); + Scheduler.log('Mouse Over Capture Parent'); }}> @@ -1028,16 +1028,16 @@ describe('ReactDOMServerSelectiveHydration', () => { function Outer() { if (suspendOuter) { - OuterScheduler.unstable_yieldValue('Suspend Outer'); + OuterScheduler.log('Suspend Outer'); throw outerPromise; } - OuterScheduler.unstable_yieldValue('Outer'); + OuterScheduler.log('Outer'); const innerRoot = outerContainer.querySelector('#inner-root'); return (
{ - Scheduler.unstable_yieldValue('Outer Mouse Enter'); + Scheduler.log('Outer Mouse Enter'); }} dangerouslySetInnerHTML={{ __html: innerRoot ? innerRoot.innerHTML : '', @@ -1062,15 +1062,15 @@ describe('ReactDOMServerSelectiveHydration', () => { }); function Inner() { if (suspendInner) { - InnerScheduler.unstable_yieldValue('Suspend Inner'); + InnerScheduler.log('Suspend Inner'); throw innerPromise; } - InnerScheduler.unstable_yieldValue('Inner'); + InnerScheduler.log('Inner'); return (
{ - Scheduler.unstable_yieldValue('Inner Mouse Enter'); + Scheduler.log('Inner Mouse Enter'); }} /> ); @@ -1092,8 +1092,8 @@ describe('ReactDOMServerSelectiveHydration', () => { const innerHTML = ReactDOMServer.renderToString(); innerContainer.innerHTML = innerHTML; - expect(OuterScheduler.unstable_clearYields()).toEqual(['Outer']); - expect(InnerScheduler.unstable_clearYields()).toEqual(['Inner']); + expect(OuterScheduler.unstable_clearLog()).toEqual(['Outer']); + expect(InnerScheduler.unstable_clearLog()).toEqual(['Inner']); suspendOuter = true; suspendInner = true; @@ -1103,8 +1103,8 @@ describe('ReactDOMServerSelectiveHydration', () => { OuterScheduler.unstable_flushAllWithoutAsserting(); InnerScheduler.unstable_flushAllWithoutAsserting(); - expect(OuterScheduler.unstable_clearYields()).toEqual(['Suspend Outer']); - expect(InnerScheduler.unstable_clearYields()).toEqual(['Suspend Inner']); + expect(OuterScheduler.unstable_clearLog()).toEqual(['Suspend Outer']); + expect(InnerScheduler.unstable_clearLog()).toEqual(['Suspend Inner']); innerDiv = document.querySelector('#inner'); @@ -1117,7 +1117,7 @@ describe('ReactDOMServerSelectiveHydration', () => { InnerScheduler.unstable_flushAllWithoutAsserting(); }); - expect(OuterScheduler.unstable_clearYields()).toEqual(['Suspend Outer']); + expect(OuterScheduler.unstable_clearLog()).toEqual(['Suspend Outer']); if ( gate( flags => @@ -1126,12 +1126,10 @@ describe('ReactDOMServerSelectiveHydration', () => { ) { // InnerApp doesn't see the event because OuterApp calls stopPropagation in // capture phase since the event is blocked on suspended component - expect(InnerScheduler.unstable_clearYields()).toEqual([]); + expect(InnerScheduler.unstable_clearLog()).toEqual([]); } else { // no stopPropagation - expect(InnerScheduler.unstable_clearYields()).toEqual([ - 'Suspend Inner', - ]); + expect(InnerScheduler.unstable_clearLog()).toEqual(['Suspend Inner']); } assertLog([]); @@ -1153,15 +1151,15 @@ describe('ReactDOMServerSelectiveHydration', () => { InnerScheduler.unstable_flushAllWithoutAsserting(); }); - expect(OuterScheduler.unstable_clearYields()).toEqual(['Suspend Outer']); + expect(OuterScheduler.unstable_clearLog()).toEqual(['Suspend Outer']); // Inner App renders because it is unblocked - expect(InnerScheduler.unstable_clearYields()).toEqual(['Inner']); + expect(InnerScheduler.unstable_clearLog()).toEqual(['Inner']); // No event is replayed yet assertLog([]); dispatchMouseHoverEvent(innerDiv); - expect(OuterScheduler.unstable_clearYields()).toEqual([]); - expect(InnerScheduler.unstable_clearYields()).toEqual([]); + expect(OuterScheduler.unstable_clearLog()).toEqual([]); + expect(InnerScheduler.unstable_clearLog()).toEqual([]); // No event is replayed yet assertLog([]); @@ -1176,9 +1174,9 @@ describe('ReactDOMServerSelectiveHydration', () => { // Nothing happens to inner app yet. // Its blocked on the outer app replaying the event - expect(InnerScheduler.unstable_clearYields()).toEqual([]); + expect(InnerScheduler.unstable_clearLog()).toEqual([]); // Outer hydrates and schedules Replay - expect(OuterScheduler.unstable_clearYields()).toEqual(['Outer']); + expect(OuterScheduler.unstable_clearLog()).toEqual(['Outer']); // No event is replayed yet assertLog([]); @@ -1207,9 +1205,9 @@ describe('ReactDOMServerSelectiveHydration', () => { }); // Outer resolves and scheduled replay - expect(OuterScheduler.unstable_clearYields()).toEqual(['Outer']); + expect(OuterScheduler.unstable_clearLog()).toEqual(['Outer']); // Inner App is still blocked - expect(InnerScheduler.unstable_clearYields()).toEqual([]); + expect(InnerScheduler.unstable_clearLog()).toEqual([]); // Replay outer event await act(async () => { @@ -1221,12 +1219,12 @@ describe('ReactDOMServerSelectiveHydration', () => { // Inner is still blocked so when Outer replays the event in capture phase // inner ends up caling stopPropagation assertLog([]); - expect(OuterScheduler.unstable_clearYields()).toEqual([]); - expect(InnerScheduler.unstable_clearYields()).toEqual(['Suspend Inner']); + expect(OuterScheduler.unstable_clearLog()).toEqual([]); + expect(InnerScheduler.unstable_clearLog()).toEqual(['Suspend Inner']); dispatchMouseHoverEvent(innerDiv); - expect(OuterScheduler.unstable_clearYields()).toEqual([]); - expect(InnerScheduler.unstable_clearYields()).toEqual([]); + expect(OuterScheduler.unstable_clearLog()).toEqual([]); + expect(InnerScheduler.unstable_clearLog()).toEqual([]); assertLog([]); await act(async () => { @@ -1238,9 +1236,9 @@ describe('ReactDOMServerSelectiveHydration', () => { }); // Inner hydrates - expect(InnerScheduler.unstable_clearYields()).toEqual(['Inner']); + expect(InnerScheduler.unstable_clearLog()).toEqual(['Inner']); // Outer was hydrated earlier - expect(OuterScheduler.unstable_clearYields()).toEqual([]); + expect(OuterScheduler.unstable_clearLog()).toEqual([]); await act(async () => { Scheduler.unstable_flushAllWithoutAsserting(); @@ -1268,11 +1266,11 @@ describe('ReactDOMServerSelectiveHydration', () => { if (suspend) { throw promise; } - Scheduler.unstable_yieldValue('Child'); + Scheduler.log('Child'); return (
{ - Scheduler.unstable_yieldValue('on mouse over'); + Scheduler.log('on mouse over'); }}> Child
@@ -1315,7 +1313,7 @@ describe('ReactDOMServerSelectiveHydration', () => { const container2 = document.createElement('div'); container2.addEventListener('mouseover', () => { - Scheduler.unstable_yieldValue('container2 mouse over'); + Scheduler.log('container2 mouse over'); }); container2.appendChild(childDiv); }, @@ -1338,12 +1336,12 @@ describe('ReactDOMServerSelectiveHydration', () => { if ((text === 'A' || text === 'D') && suspend) { throw promise; } - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return ( { e.preventDefault(); - Scheduler.unstable_yieldValue('Hover ' + text); + Scheduler.log('Hover ' + text); }}> {text} @@ -1351,7 +1349,7 @@ describe('ReactDOMServerSelectiveHydration', () => { } function App() { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); return (
@@ -1417,12 +1415,12 @@ describe('ReactDOMServerSelectiveHydration', () => { it('hydrates the last explicitly hydrated target at higher priority', async () => { function Child({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return {text}; } function App() { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); return (
@@ -1465,7 +1463,7 @@ describe('ReactDOMServerSelectiveHydration', () => { // @gate experimental || www it('hydrates before an update even if hydration moves away from it', async () => { function Child({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return {text}; } const ChildWithBoundary = React.memo(function ({text}) { @@ -1478,9 +1476,9 @@ describe('ReactDOMServerSelectiveHydration', () => { }); function App({a}) { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); React.useEffect(() => { - Scheduler.unstable_yieldValue('Commit'); + Scheduler.log('Commit'); }); return (
@@ -1574,24 +1572,24 @@ describe('ReactDOMServerSelectiveHydration', () => { it('fires capture event handlers and native events if content is hydratable during discrete event', async () => { spyOnDev(console, 'error'); function Child({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); const ref = React.useRef(); React.useLayoutEffect(() => { if (!ref.current) { return; } ref.current.onclick = () => { - Scheduler.unstable_yieldValue('Native Click ' + text); + Scheduler.log('Native Click ' + text); }; }, [text]); return ( { - Scheduler.unstable_yieldValue('Capture Clicked ' + text); + Scheduler.log('Capture Clicked ' + text); }} onClick={e => { - Scheduler.unstable_yieldValue('Clicked ' + text); + Scheduler.log('Clicked ' + text); }}> {text} @@ -1599,7 +1597,7 @@ describe('ReactDOMServerSelectiveHydration', () => { } function App() { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); return (
@@ -1658,7 +1656,7 @@ describe('ReactDOMServerSelectiveHydration', () => { if (suspend) { throw promise; } - Scheduler.unstable_yieldValue('Child'); + Scheduler.log('Child'); return ( { @@ -1673,7 +1671,7 @@ describe('ReactDOMServerSelectiveHydration', () => { const onClick = () => { triggeredParent = true; }; - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); return (
{ @@ -1719,12 +1717,12 @@ describe('ReactDOMServerSelectiveHydration', () => { if (suspend) { throw promise; } - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return ( { e.preventDefault(); - Scheduler.unstable_yieldValue('Clicked ' + text); + Scheduler.log('Clicked ' + text); }}> {text} @@ -1732,7 +1730,7 @@ describe('ReactDOMServerSelectiveHydration', () => { } function App() { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); return (
@@ -1790,11 +1788,11 @@ describe('ReactDOMServerSelectiveHydration', () => { it('can force hydration in response to sync update', async () => { function Child({text}) { - Scheduler.unstable_yieldValue(`Child ${text}`); + Scheduler.log(`Child ${text}`); return (spanRef = ref)}>{text}; } function App({text}) { - Scheduler.unstable_yieldValue(`App ${text}`); + Scheduler.log(`App ${text}`); return (
@@ -1826,11 +1824,11 @@ describe('ReactDOMServerSelectiveHydration', () => { // @gate experimental || www it('can force hydration in response to continuous update', async () => { function Child({text}) { - Scheduler.unstable_yieldValue(`Child ${text}`); + Scheduler.log(`Child ${text}`); return (spanRef = ref)}>{text}; } function App({text}) { - Scheduler.unstable_yieldValue(`App ${text}`); + Scheduler.log(`App ${text}`); return (
@@ -1862,11 +1860,11 @@ describe('ReactDOMServerSelectiveHydration', () => { it('can force hydration in response to default update', async () => { function Child({text}) { - Scheduler.unstable_yieldValue(`Child ${text}`); + Scheduler.log(`Child ${text}`); return (spanRef = ref)}>{text}; } function App({text}) { - Scheduler.unstable_yieldValue(`App ${text}`); + Scheduler.log(`App ${text}`); return (
@@ -1898,12 +1896,12 @@ describe('ReactDOMServerSelectiveHydration', () => { function ContextReader(props) { const value = React.useContext(Context); - Scheduler.unstable_yieldValue(value); + Scheduler.log(value); return null; } function Child({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return {text}; } const ChildWithBoundary = React.memo(function ({text}) { @@ -1915,9 +1913,9 @@ describe('ReactDOMServerSelectiveHydration', () => { }); function App({a}) { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); React.useEffect(() => { - Scheduler.unstable_yieldValue('Commit'); + Scheduler.log('Commit'); }); return ( <> @@ -1956,12 +1954,12 @@ describe('ReactDOMServerSelectiveHydration', () => { function ContextReader(props) { const value = React.useContext(Context); - Scheduler.unstable_yieldValue(value); + Scheduler.log(value); return null; } function Child({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return {text}; } const ChildWithBoundary = React.memo(function ({text}) { @@ -1973,9 +1971,9 @@ describe('ReactDOMServerSelectiveHydration', () => { }); function App({a}) { - Scheduler.unstable_yieldValue('App'); + Scheduler.log('App'); React.useEffect(() => { - Scheduler.unstable_yieldValue('Commit'); + Scheduler.log('Commit'); }); return ( <> diff --git a/packages/react-dom/src/__tests__/ReactErrorBoundaries-test.internal.js b/packages/react-dom/src/__tests__/ReactErrorBoundaries-test.internal.js index 742834ee5d3e1..93e3a04494e43 100644 --- a/packages/react-dom/src/__tests__/ReactErrorBoundaries-test.internal.js +++ b/packages/react-dom/src/__tests__/ReactErrorBoundaries-test.internal.js @@ -55,202 +55,152 @@ describe('ReactErrorBoundaries', () => { BrokenConstructor = class extends React.Component { constructor(props) { super(props); - Scheduler.unstable_yieldValue('BrokenConstructor constructor [!]'); + Scheduler.log('BrokenConstructor constructor [!]'); throw new Error('Hello'); } render() { - Scheduler.unstable_yieldValue('BrokenConstructor render'); + Scheduler.log('BrokenConstructor render'); return
{this.props.children}
; } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue('BrokenConstructor componentWillMount'); + Scheduler.log('BrokenConstructor componentWillMount'); } componentDidMount() { - Scheduler.unstable_yieldValue('BrokenConstructor componentDidMount'); + Scheduler.log('BrokenConstructor componentDidMount'); } UNSAFE_componentWillReceiveProps() { - Scheduler.unstable_yieldValue( - 'BrokenConstructor componentWillReceiveProps', - ); + Scheduler.log('BrokenConstructor componentWillReceiveProps'); } UNSAFE_componentWillUpdate() { - Scheduler.unstable_yieldValue('BrokenConstructor componentWillUpdate'); + Scheduler.log('BrokenConstructor componentWillUpdate'); } componentDidUpdate() { - Scheduler.unstable_yieldValue('BrokenConstructor componentDidUpdate'); + Scheduler.log('BrokenConstructor componentDidUpdate'); } componentWillUnmount() { - Scheduler.unstable_yieldValue('BrokenConstructor componentWillUnmount'); + Scheduler.log('BrokenConstructor componentWillUnmount'); } }; BrokenComponentWillMount = class extends React.Component { constructor(props) { super(props); - Scheduler.unstable_yieldValue('BrokenComponentWillMount constructor'); + Scheduler.log('BrokenComponentWillMount constructor'); } render() { - Scheduler.unstable_yieldValue('BrokenComponentWillMount render'); + Scheduler.log('BrokenComponentWillMount render'); return
{this.props.children}
; } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillMount componentWillMount [!]', - ); + Scheduler.log('BrokenComponentWillMount componentWillMount [!]'); throw new Error('Hello'); } componentDidMount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillMount componentDidMount', - ); + Scheduler.log('BrokenComponentWillMount componentDidMount'); } UNSAFE_componentWillReceiveProps() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillMount componentWillReceiveProps', - ); + Scheduler.log('BrokenComponentWillMount componentWillReceiveProps'); } UNSAFE_componentWillUpdate() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillMount componentWillUpdate', - ); + Scheduler.log('BrokenComponentWillMount componentWillUpdate'); } componentDidUpdate() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillMount componentDidUpdate', - ); + Scheduler.log('BrokenComponentWillMount componentDidUpdate'); } componentWillUnmount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillMount componentWillUnmount', - ); + Scheduler.log('BrokenComponentWillMount componentWillUnmount'); } }; BrokenComponentDidMount = class extends React.Component { constructor(props) { super(props); - Scheduler.unstable_yieldValue('BrokenComponentDidMount constructor'); + Scheduler.log('BrokenComponentDidMount constructor'); } render() { - Scheduler.unstable_yieldValue('BrokenComponentDidMount render'); + Scheduler.log('BrokenComponentDidMount render'); return
{this.props.children}
; } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentDidMount componentWillMount', - ); + Scheduler.log('BrokenComponentDidMount componentWillMount'); } componentDidMount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentDidMount componentDidMount [!]', - ); + Scheduler.log('BrokenComponentDidMount componentDidMount [!]'); throw new Error('Hello'); } UNSAFE_componentWillReceiveProps() { - Scheduler.unstable_yieldValue( - 'BrokenComponentDidMount componentWillReceiveProps', - ); + Scheduler.log('BrokenComponentDidMount componentWillReceiveProps'); } UNSAFE_componentWillUpdate() { - Scheduler.unstable_yieldValue( - 'BrokenComponentDidMount componentWillUpdate', - ); + Scheduler.log('BrokenComponentDidMount componentWillUpdate'); } componentDidUpdate() { - Scheduler.unstable_yieldValue( - 'BrokenComponentDidMount componentDidUpdate', - ); + Scheduler.log('BrokenComponentDidMount componentDidUpdate'); } componentWillUnmount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentDidMount componentWillUnmount', - ); + Scheduler.log('BrokenComponentDidMount componentWillUnmount'); } }; BrokenComponentWillReceiveProps = class extends React.Component { constructor(props) { super(props); - Scheduler.unstable_yieldValue( - 'BrokenComponentWillReceiveProps constructor', - ); + Scheduler.log('BrokenComponentWillReceiveProps constructor'); } render() { - Scheduler.unstable_yieldValue('BrokenComponentWillReceiveProps render'); + Scheduler.log('BrokenComponentWillReceiveProps render'); return
{this.props.children}
; } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillReceiveProps componentWillMount', - ); + Scheduler.log('BrokenComponentWillReceiveProps componentWillMount'); } componentDidMount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillReceiveProps componentDidMount', - ); + Scheduler.log('BrokenComponentWillReceiveProps componentDidMount'); } UNSAFE_componentWillReceiveProps() { - Scheduler.unstable_yieldValue( + Scheduler.log( 'BrokenComponentWillReceiveProps componentWillReceiveProps [!]', ); throw new Error('Hello'); } UNSAFE_componentWillUpdate() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillReceiveProps componentWillUpdate', - ); + Scheduler.log('BrokenComponentWillReceiveProps componentWillUpdate'); } componentDidUpdate() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillReceiveProps componentDidUpdate', - ); + Scheduler.log('BrokenComponentWillReceiveProps componentDidUpdate'); } componentWillUnmount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillReceiveProps componentWillUnmount', - ); + Scheduler.log('BrokenComponentWillReceiveProps componentWillUnmount'); } }; BrokenComponentWillUpdate = class extends React.Component { constructor(props) { super(props); - Scheduler.unstable_yieldValue('BrokenComponentWillUpdate constructor'); + Scheduler.log('BrokenComponentWillUpdate constructor'); } render() { - Scheduler.unstable_yieldValue('BrokenComponentWillUpdate render'); + Scheduler.log('BrokenComponentWillUpdate render'); return
{this.props.children}
; } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillUpdate componentWillMount', - ); + Scheduler.log('BrokenComponentWillUpdate componentWillMount'); } componentDidMount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillUpdate componentDidMount', - ); + Scheduler.log('BrokenComponentWillUpdate componentDidMount'); } UNSAFE_componentWillReceiveProps() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillUpdate componentWillReceiveProps', - ); + Scheduler.log('BrokenComponentWillUpdate componentWillReceiveProps'); } UNSAFE_componentWillUpdate() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillUpdate componentWillUpdate [!]', - ); + Scheduler.log('BrokenComponentWillUpdate componentWillUpdate [!]'); throw new Error('Hello'); } componentDidUpdate() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillUpdate componentDidUpdate', - ); + Scheduler.log('BrokenComponentWillUpdate componentDidUpdate'); } componentWillUnmount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillUpdate componentWillUnmount', - ); + Scheduler.log('BrokenComponentWillUpdate componentWillUnmount'); } }; @@ -260,42 +210,30 @@ describe('ReactErrorBoundaries', () => { }; constructor(props) { super(props); - Scheduler.unstable_yieldValue('BrokenComponentDidUpdate constructor'); + Scheduler.log('BrokenComponentDidUpdate constructor'); } render() { - Scheduler.unstable_yieldValue('BrokenComponentDidUpdate render'); + Scheduler.log('BrokenComponentDidUpdate render'); return
{this.props.children}
; } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentDidUpdate componentWillMount', - ); + Scheduler.log('BrokenComponentDidUpdate componentWillMount'); } componentDidMount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentDidUpdate componentDidMount', - ); + Scheduler.log('BrokenComponentDidUpdate componentDidMount'); } UNSAFE_componentWillReceiveProps() { - Scheduler.unstable_yieldValue( - 'BrokenComponentDidUpdate componentWillReceiveProps', - ); + Scheduler.log('BrokenComponentDidUpdate componentWillReceiveProps'); } UNSAFE_componentWillUpdate() { - Scheduler.unstable_yieldValue( - 'BrokenComponentDidUpdate componentWillUpdate', - ); + Scheduler.log('BrokenComponentDidUpdate componentWillUpdate'); } componentDidUpdate() { - Scheduler.unstable_yieldValue( - 'BrokenComponentDidUpdate componentDidUpdate [!]', - ); + Scheduler.log('BrokenComponentDidUpdate componentDidUpdate [!]'); throw new Error(this.props.errorText); } componentWillUnmount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentDidUpdate componentWillUnmount', - ); + Scheduler.log('BrokenComponentDidUpdate componentWillUnmount'); } }; @@ -305,41 +243,29 @@ describe('ReactErrorBoundaries', () => { }; constructor(props) { super(props); - Scheduler.unstable_yieldValue('BrokenComponentWillUnmount constructor'); + Scheduler.log('BrokenComponentWillUnmount constructor'); } render() { - Scheduler.unstable_yieldValue('BrokenComponentWillUnmount render'); + Scheduler.log('BrokenComponentWillUnmount render'); return
{this.props.children}
; } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillUnmount componentWillMount', - ); + Scheduler.log('BrokenComponentWillUnmount componentWillMount'); } componentDidMount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillUnmount componentDidMount', - ); + Scheduler.log('BrokenComponentWillUnmount componentDidMount'); } UNSAFE_componentWillReceiveProps() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillUnmount componentWillReceiveProps', - ); + Scheduler.log('BrokenComponentWillUnmount componentWillReceiveProps'); } UNSAFE_componentWillUpdate() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillUnmount componentWillUpdate', - ); + Scheduler.log('BrokenComponentWillUnmount componentWillUpdate'); } componentDidUpdate() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillUnmount componentDidUpdate', - ); + Scheduler.log('BrokenComponentWillUnmount componentDidUpdate'); } componentWillUnmount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillUnmount componentWillUnmount [!]', - ); + Scheduler.log('BrokenComponentWillUnmount componentWillUnmount [!]'); throw new Error(this.props.errorText); } }; @@ -348,40 +274,34 @@ describe('ReactErrorBoundaries', () => { constructor(props) { super(props); this.state = {error: null}; - Scheduler.unstable_yieldValue( - 'BrokenComponentWillMountErrorBoundary constructor', - ); + Scheduler.log('BrokenComponentWillMountErrorBoundary constructor'); } render() { if (this.state.error) { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillMountErrorBoundary render error', - ); + Scheduler.log('BrokenComponentWillMountErrorBoundary render error'); return
Caught an error: {this.state.error.message}.
; } - Scheduler.unstable_yieldValue( - 'BrokenComponentWillMountErrorBoundary render success', - ); + Scheduler.log('BrokenComponentWillMountErrorBoundary render success'); return
{this.props.children}
; } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue( + Scheduler.log( 'BrokenComponentWillMountErrorBoundary componentWillMount [!]', ); throw new Error('Hello'); } componentDidMount() { - Scheduler.unstable_yieldValue( + Scheduler.log( 'BrokenComponentWillMountErrorBoundary componentDidMount', ); } componentWillUnmount() { - Scheduler.unstable_yieldValue( + Scheduler.log( 'BrokenComponentWillMountErrorBoundary componentWillUnmount', ); } static getDerivedStateFromError(error) { - Scheduler.unstable_yieldValue( + Scheduler.log( 'BrokenComponentWillMountErrorBoundary static getDerivedStateFromError', ); return {error}; @@ -392,40 +312,34 @@ describe('ReactErrorBoundaries', () => { constructor(props) { super(props); this.state = {error: null}; - Scheduler.unstable_yieldValue( - 'BrokenComponentDidMountErrorBoundary constructor', - ); + Scheduler.log('BrokenComponentDidMountErrorBoundary constructor'); } render() { if (this.state.error) { - Scheduler.unstable_yieldValue( - 'BrokenComponentDidMountErrorBoundary render error', - ); + Scheduler.log('BrokenComponentDidMountErrorBoundary render error'); return
Caught an error: {this.state.error.message}.
; } - Scheduler.unstable_yieldValue( - 'BrokenComponentDidMountErrorBoundary render success', - ); + Scheduler.log('BrokenComponentDidMountErrorBoundary render success'); return
{this.props.children}
; } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue( + Scheduler.log( 'BrokenComponentDidMountErrorBoundary componentWillMount', ); } componentDidMount() { - Scheduler.unstable_yieldValue( + Scheduler.log( 'BrokenComponentDidMountErrorBoundary componentDidMount [!]', ); throw new Error('Hello'); } componentWillUnmount() { - Scheduler.unstable_yieldValue( + Scheduler.log( 'BrokenComponentDidMountErrorBoundary componentWillUnmount', ); } static getDerivedStateFromError(error) { - Scheduler.unstable_yieldValue( + Scheduler.log( 'BrokenComponentDidMountErrorBoundary static getDerivedStateFromError', ); return {error}; @@ -436,37 +350,27 @@ describe('ReactErrorBoundaries', () => { constructor(props) { super(props); this.state = {error: null}; - Scheduler.unstable_yieldValue('BrokenRenderErrorBoundary constructor'); + Scheduler.log('BrokenRenderErrorBoundary constructor'); } render() { if (this.state.error) { - Scheduler.unstable_yieldValue( - 'BrokenRenderErrorBoundary render error [!]', - ); + Scheduler.log('BrokenRenderErrorBoundary render error [!]'); throw new Error('Hello'); } - Scheduler.unstable_yieldValue( - 'BrokenRenderErrorBoundary render success', - ); + Scheduler.log('BrokenRenderErrorBoundary render success'); return
{this.props.children}
; } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue( - 'BrokenRenderErrorBoundary componentWillMount', - ); + Scheduler.log('BrokenRenderErrorBoundary componentWillMount'); } componentDidMount() { - Scheduler.unstable_yieldValue( - 'BrokenRenderErrorBoundary componentDidMount', - ); + Scheduler.log('BrokenRenderErrorBoundary componentDidMount'); } componentWillUnmount() { - Scheduler.unstable_yieldValue( - 'BrokenRenderErrorBoundary componentWillUnmount', - ); + Scheduler.log('BrokenRenderErrorBoundary componentWillUnmount'); } static getDerivedStateFromError(error) { - Scheduler.unstable_yieldValue( + Scheduler.log( 'BrokenRenderErrorBoundary static getDerivedStateFromError', ); return {error}; @@ -476,37 +380,37 @@ describe('ReactErrorBoundaries', () => { BrokenRender = class extends React.Component { constructor(props) { super(props); - Scheduler.unstable_yieldValue('BrokenRender constructor'); + Scheduler.log('BrokenRender constructor'); } render() { - Scheduler.unstable_yieldValue('BrokenRender render [!]'); + Scheduler.log('BrokenRender render [!]'); throw new Error('Hello'); } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue('BrokenRender componentWillMount'); + Scheduler.log('BrokenRender componentWillMount'); } componentDidMount() { - Scheduler.unstable_yieldValue('BrokenRender componentDidMount'); + Scheduler.log('BrokenRender componentDidMount'); } UNSAFE_componentWillReceiveProps() { - Scheduler.unstable_yieldValue('BrokenRender componentWillReceiveProps'); + Scheduler.log('BrokenRender componentWillReceiveProps'); } UNSAFE_componentWillUpdate() { - Scheduler.unstable_yieldValue('BrokenRender componentWillUpdate'); + Scheduler.log('BrokenRender componentWillUpdate'); } componentDidUpdate() { - Scheduler.unstable_yieldValue('BrokenRender componentDidUpdate'); + Scheduler.log('BrokenRender componentDidUpdate'); } componentWillUnmount() { - Scheduler.unstable_yieldValue('BrokenRender componentWillUnmount'); + Scheduler.log('BrokenRender componentWillUnmount'); } }; BrokenUseEffect = ({children}) => { - Scheduler.unstable_yieldValue('BrokenUseEffect render'); + Scheduler.log('BrokenUseEffect render'); React.useEffect(() => { - Scheduler.unstable_yieldValue('BrokenUseEffect useEffect [!]'); + Scheduler.log('BrokenUseEffect useEffect [!]'); throw new Error('Hello'); }); @@ -514,12 +418,10 @@ describe('ReactErrorBoundaries', () => { }; BrokenUseLayoutEffect = ({children}) => { - Scheduler.unstable_yieldValue('BrokenUseLayoutEffect render'); + Scheduler.log('BrokenUseLayoutEffect render'); React.useLayoutEffect(() => { - Scheduler.unstable_yieldValue( - 'BrokenUseLayoutEffect useLayoutEffect [!]', - ); + Scheduler.log('BrokenUseLayoutEffect useLayoutEffect [!]'); throw new Error('Hello'); }); @@ -529,25 +431,23 @@ describe('ReactErrorBoundaries', () => { NoopErrorBoundary = class extends React.Component { constructor(props) { super(props); - Scheduler.unstable_yieldValue('NoopErrorBoundary constructor'); + Scheduler.log('NoopErrorBoundary constructor'); } render() { - Scheduler.unstable_yieldValue('NoopErrorBoundary render'); + Scheduler.log('NoopErrorBoundary render'); return ; } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue('NoopErrorBoundary componentWillMount'); + Scheduler.log('NoopErrorBoundary componentWillMount'); } componentDidMount() { - Scheduler.unstable_yieldValue('NoopErrorBoundary componentDidMount'); + Scheduler.log('NoopErrorBoundary componentDidMount'); } componentWillUnmount() { - Scheduler.unstable_yieldValue('NoopErrorBoundary componentWillUnmount'); + Scheduler.log('NoopErrorBoundary componentWillUnmount'); } static getDerivedStateFromError() { - Scheduler.unstable_yieldValue( - 'NoopErrorBoundary static getDerivedStateFromError', - ); + Scheduler.log('NoopErrorBoundary static getDerivedStateFromError'); } }; @@ -557,41 +457,29 @@ describe('ReactErrorBoundaries', () => { }; constructor(props) { super(props); - Scheduler.unstable_yieldValue(`${this.props.logName} constructor`); + Scheduler.log(`${this.props.logName} constructor`); } render() { - Scheduler.unstable_yieldValue(`${this.props.logName} render`); + Scheduler.log(`${this.props.logName} render`); return
{this.props.children}
; } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue( - `${this.props.logName} componentWillMount`, - ); + Scheduler.log(`${this.props.logName} componentWillMount`); } componentDidMount() { - Scheduler.unstable_yieldValue( - `${this.props.logName} componentDidMount`, - ); + Scheduler.log(`${this.props.logName} componentDidMount`); } UNSAFE_componentWillReceiveProps() { - Scheduler.unstable_yieldValue( - `${this.props.logName} componentWillReceiveProps`, - ); + Scheduler.log(`${this.props.logName} componentWillReceiveProps`); } UNSAFE_componentWillUpdate() { - Scheduler.unstable_yieldValue( - `${this.props.logName} componentWillUpdate`, - ); + Scheduler.log(`${this.props.logName} componentWillUpdate`); } componentDidUpdate() { - Scheduler.unstable_yieldValue( - `${this.props.logName} componentDidUpdate`, - ); + Scheduler.log(`${this.props.logName} componentDidUpdate`); } componentWillUnmount() { - Scheduler.unstable_yieldValue( - `${this.props.logName} componentWillUnmount`, - ); + Scheduler.log(`${this.props.logName} componentWillUnmount`); } }; @@ -599,51 +487,37 @@ describe('ReactErrorBoundaries', () => { constructor(props) { super(props); this.state = {error: null}; - Scheduler.unstable_yieldValue(`${this.props.logName} constructor`); + Scheduler.log(`${this.props.logName} constructor`); } render() { if (this.state.error && !this.props.forceRetry) { - Scheduler.unstable_yieldValue(`${this.props.logName} render error`); + Scheduler.log(`${this.props.logName} render error`); return this.props.renderError(this.state.error, this.props); } - Scheduler.unstable_yieldValue(`${this.props.logName} render success`); + Scheduler.log(`${this.props.logName} render success`); return
{this.props.children}
; } static getDerivedStateFromError(error) { - Scheduler.unstable_yieldValue( - 'ErrorBoundary static getDerivedStateFromError', - ); + Scheduler.log('ErrorBoundary static getDerivedStateFromError'); return {error}; } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue( - `${this.props.logName} componentWillMount`, - ); + Scheduler.log(`${this.props.logName} componentWillMount`); } componentDidMount() { - Scheduler.unstable_yieldValue( - `${this.props.logName} componentDidMount`, - ); + Scheduler.log(`${this.props.logName} componentDidMount`); } UNSAFE_componentWillReceiveProps() { - Scheduler.unstable_yieldValue( - `${this.props.logName} componentWillReceiveProps`, - ); + Scheduler.log(`${this.props.logName} componentWillReceiveProps`); } UNSAFE_componentWillUpdate() { - Scheduler.unstable_yieldValue( - `${this.props.logName} componentWillUpdate`, - ); + Scheduler.log(`${this.props.logName} componentWillUpdate`); } componentDidUpdate() { - Scheduler.unstable_yieldValue( - `${this.props.logName} componentDidUpdate`, - ); + Scheduler.log(`${this.props.logName} componentDidUpdate`); } componentWillUnmount() { - Scheduler.unstable_yieldValue( - `${this.props.logName} componentWillUnmount`, - ); + Scheduler.log(`${this.props.logName} componentWillUnmount`); } }; ErrorBoundary.defaultProps = { @@ -660,27 +534,23 @@ describe('ReactErrorBoundaries', () => { RetryErrorBoundary = class extends React.Component { constructor(props) { super(props); - Scheduler.unstable_yieldValue('RetryErrorBoundary constructor'); + Scheduler.log('RetryErrorBoundary constructor'); } render() { - Scheduler.unstable_yieldValue('RetryErrorBoundary render'); + Scheduler.log('RetryErrorBoundary render'); return ; } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue('RetryErrorBoundary componentWillMount'); + Scheduler.log('RetryErrorBoundary componentWillMount'); } componentDidMount() { - Scheduler.unstable_yieldValue('RetryErrorBoundary componentDidMount'); + Scheduler.log('RetryErrorBoundary componentDidMount'); } componentWillUnmount() { - Scheduler.unstable_yieldValue( - 'RetryErrorBoundary componentWillUnmount', - ); + Scheduler.log('RetryErrorBoundary componentWillUnmount'); } static getDerivedStateFromError(error) { - Scheduler.unstable_yieldValue( - 'RetryErrorBoundary static getDerivedStateFromError [!]', - ); + Scheduler.log('RetryErrorBoundary static getDerivedStateFromError [!]'); // In Fiber, calling setState() (and failing) is treated as a rethrow. return {}; } @@ -689,19 +559,19 @@ describe('ReactErrorBoundaries', () => { ErrorMessage = class extends React.Component { constructor(props) { super(props); - Scheduler.unstable_yieldValue('ErrorMessage constructor'); + Scheduler.log('ErrorMessage constructor'); } UNSAFE_componentWillMount() { - Scheduler.unstable_yieldValue('ErrorMessage componentWillMount'); + Scheduler.log('ErrorMessage componentWillMount'); } componentDidMount() { - Scheduler.unstable_yieldValue('ErrorMessage componentDidMount'); + Scheduler.log('ErrorMessage componentDidMount'); } componentWillUnmount() { - Scheduler.unstable_yieldValue('ErrorMessage componentWillUnmount'); + Scheduler.log('ErrorMessage componentWillUnmount'); } render() { - Scheduler.unstable_yieldValue('ErrorMessage render'); + Scheduler.log('ErrorMessage render'); return
Caught an error: {this.props.message}.
; } }; @@ -1146,10 +1016,10 @@ describe('ReactErrorBoundaries', () => { it('resets callback refs if mounting aborts', () => { function childRef(x) { - Scheduler.unstable_yieldValue('Child ref is set to ' + x); + Scheduler.log('Child ref is set to ' + x); } function errorMessageRef(x) { - Scheduler.unstable_yieldValue('Error message ref is set to ' + x); + Scheduler.log('Error message ref is set to ' + x); } const container = document.createElement('div'); @@ -1246,7 +1116,7 @@ describe('ReactErrorBoundaries', () => { , container, ); - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); ReactDOM.render( @@ -1291,7 +1161,7 @@ describe('ReactErrorBoundaries', () => { container, ); - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); ReactDOM.render( @@ -1338,7 +1208,7 @@ describe('ReactErrorBoundaries', () => { container, ); - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); ReactDOM.render( @@ -1380,7 +1250,7 @@ describe('ReactErrorBoundaries', () => { container, ); - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); ReactDOM.render( @@ -1421,7 +1291,7 @@ describe('ReactErrorBoundaries', () => { container, ); - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); ReactDOM.render( @@ -1460,13 +1330,13 @@ describe('ReactErrorBoundaries', () => { it('keeps refs up-to-date during updates', () => { function child1Ref(x) { - Scheduler.unstable_yieldValue('Child1 ref is set to ' + x); + Scheduler.log('Child1 ref is set to ' + x); } function child2Ref(x) { - Scheduler.unstable_yieldValue('Child2 ref is set to ' + x); + Scheduler.log('Child2 ref is set to ' + x); } function errorMessageRef(x) { - Scheduler.unstable_yieldValue('Error message ref is set to ' + x); + Scheduler.log('Error message ref is set to ' + x); } const container = document.createElement('div'); @@ -1530,7 +1400,7 @@ describe('ReactErrorBoundaries', () => { container, ); - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); ReactDOM.render( @@ -1586,7 +1456,7 @@ describe('ReactErrorBoundaries', () => { container, ); - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); ReactDOM.render( @@ -1655,7 +1525,7 @@ describe('ReactErrorBoundaries', () => { container, ); - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); ReactDOM.render( { expect(container.textContent).toBe('Caught an error: Hello.'); // Force the success path: - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); ReactDOM.render( @@ -1784,7 +1654,7 @@ describe('ReactErrorBoundaries', () => { ReactDOM.render(, container); expect(container.textContent).toBe('Caught an error: Hello.'); - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); ReactDOM.unmountComponentAtNode(container); assertLog(['ErrorBoundary componentWillUnmount']); }); @@ -1802,7 +1672,7 @@ describe('ReactErrorBoundaries', () => { ); expect(container.textContent).toBe('Caught an error: Hello.'); - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); ReactDOM.unmountComponentAtNode(container); assertLog(['ErrorBoundary componentWillUnmount']); }); @@ -1850,7 +1720,7 @@ describe('ReactErrorBoundaries', () => { ); expect(container.textContent).toBe('Caught an error: Hello.'); - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); ReactDOM.unmountComponentAtNode(container); assertLog(['ErrorBoundary componentWillUnmount']); }); @@ -1862,7 +1732,7 @@ describe('ReactErrorBoundaries', () => { render() { if (fail) { - Scheduler.unstable_yieldValue('Stateful render [!]'); + Scheduler.log('Stateful render [!]'); throw new Error('Hello'); } return
{this.props.children}
; @@ -1878,7 +1748,7 @@ describe('ReactErrorBoundaries', () => { container, ); - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); expect(() => { fail = true; statefulInst.forceUpdate(); @@ -1963,7 +1833,7 @@ describe('ReactErrorBoundaries', () => { container, ); - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); ReactDOM.render( @@ -2010,7 +1880,7 @@ describe('ReactErrorBoundaries', () => { ]); expect(container.firstChild.textContent).toBe('Initial value'); - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); }); // verify flushed passive effects and handle the error @@ -2116,7 +1986,7 @@ describe('ReactErrorBoundaries', () => { container, ); - Scheduler.unstable_clearYields(); + Scheduler.unstable_clearLog(); ReactDOM.render( { class LocalErrorBoundary extends React.Component { state = {error: null}; static getDerivedStateFromError(error) { - Scheduler.unstable_yieldValue( - `ErrorBoundary static getDerivedStateFromError`, - ); + Scheduler.log(`ErrorBoundary static getDerivedStateFromError`); return {error}; } render() { const {children, id, fallbackID} = this.props; const {error} = this.state; if (error) { - Scheduler.unstable_yieldValue(`${id} render error`); + Scheduler.log(`${id} render error`); return ; } - Scheduler.unstable_yieldValue(`${id} render success`); + Scheduler.log(`${id} render success`); return children || null; } } @@ -2509,21 +2377,19 @@ describe('ReactErrorBoundaries', () => { class Component extends React.Component { render() { const {id} = this.props; - Scheduler.unstable_yieldValue('Component render ' + id); + Scheduler.log('Component render ' + id); return id; } } class LocalBrokenComponentWillUnmount extends React.Component { componentWillUnmount() { - Scheduler.unstable_yieldValue( - 'BrokenComponentWillUnmount componentWillUnmount', - ); + Scheduler.log('BrokenComponentWillUnmount componentWillUnmount'); throw Error('Expected'); } render() { - Scheduler.unstable_yieldValue('BrokenComponentWillUnmount render'); + Scheduler.log('BrokenComponentWillUnmount render'); return 'broken'; } } @@ -2573,19 +2439,17 @@ describe('ReactErrorBoundaries', () => { class LocalErrorBoundary extends React.Component { state = {error: null}; static getDerivedStateFromError(error) { - Scheduler.unstable_yieldValue( - `ErrorBoundary static getDerivedStateFromError`, - ); + Scheduler.log(`ErrorBoundary static getDerivedStateFromError`); return {error}; } render() { const {children, id, fallbackID} = this.props; const {error} = this.state; if (error) { - Scheduler.unstable_yieldValue(`${id} render error`); + Scheduler.log(`${id} render error`); return ; } - Scheduler.unstable_yieldValue(`${id} render success`); + Scheduler.log(`${id} render success`); return children || null; } } @@ -2593,21 +2457,21 @@ describe('ReactErrorBoundaries', () => { class Component extends React.Component { render() { const {id} = this.props; - Scheduler.unstable_yieldValue('Component render ' + id); + Scheduler.log('Component render ' + id); return id; } } class LocalBrokenCallbackRef extends React.Component { _ref = ref => { - Scheduler.unstable_yieldValue('LocalBrokenCallbackRef ref ' + !!ref); + Scheduler.log('LocalBrokenCallbackRef ref ' + !!ref); if (ref === null) { throw Error('Expected'); } }; render() { - Scheduler.unstable_yieldValue('LocalBrokenCallbackRef render'); + Scheduler.log('LocalBrokenCallbackRef render'); return
ref
; } } diff --git a/packages/react-dom/src/__tests__/ReactTestUtilsAct-test.js b/packages/react-dom/src/__tests__/ReactTestUtilsAct-test.js index 81a9f4570b7f3..e7f75a41e44bf 100644 --- a/packages/react-dom/src/__tests__/ReactTestUtilsAct-test.js +++ b/packages/react-dom/src/__tests__/ReactTestUtilsAct-test.js @@ -141,7 +141,7 @@ function runActTests(label, render, unmount, rerender) { it('can use act to flush effects', () => { function App() { React.useEffect(() => { - Scheduler.unstable_yieldValue(100); + Scheduler.log(100); }); return null; } @@ -158,7 +158,7 @@ function runActTests(label, render, unmount, rerender) { function App() { const [ctr, setCtr] = React.useState(0); React.useEffect(() => { - Scheduler.unstable_yieldValue(ctr); + Scheduler.log(ctr); }); return ( ; } 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 4255f13f8ad78..7eea8f9c98970 100644 --- a/packages/react-dom/src/events/plugins/__tests__/ChangeEventPlugin-test.js +++ b/packages/react-dom/src/events/plugins/__tests__/ChangeEventPlugin-test.js @@ -512,7 +512,7 @@ describe('ChangeEventPlugin', () => { state = {value: 'initial'}; onChange = event => this.setState({value: event.target.value}); render() { - Scheduler.unstable_yieldValue(`render: ${this.state.value}`); + Scheduler.log(`render: ${this.state.value}`); const controlledValue = this.state.value === 'changed' ? 'changed [!]' : this.state.value; return ( @@ -556,7 +556,7 @@ describe('ChangeEventPlugin', () => { this.setState({checked: event.target.checked}); }; render() { - Scheduler.unstable_yieldValue(`render: ${this.state.checked}`); + Scheduler.log(`render: ${this.state.checked}`); const controlledValue = this.props.reverse ? !this.state.checked : this.state.checked; @@ -609,7 +609,7 @@ describe('ChangeEventPlugin', () => { state = {value: 'initial'}; onChange = event => this.setState({value: event.target.value}); render() { - Scheduler.unstable_yieldValue(`render: ${this.state.value}`); + Scheduler.log(`render: ${this.state.value}`); const controlledValue = this.state.value === 'changed' ? 'changed [!]' : this.state.value; return ( @@ -651,7 +651,7 @@ describe('ChangeEventPlugin', () => { state = {value: 'initial'}; onChange = event => this.setState({value: event.target.value}); render() { - Scheduler.unstable_yieldValue(`render: ${this.state.value}`); + Scheduler.log(`render: ${this.state.value}`); const controlledValue = this.state.value === 'changed' ? 'changed [!]' : this.state.value; return ( @@ -700,7 +700,7 @@ describe('ChangeEventPlugin', () => { this.setState({value: ''}); }; render() { - Scheduler.unstable_yieldValue(`render: ${this.state.value}`); + Scheduler.log(`render: ${this.state.value}`); const controlledValue = this.state.value === 'changed' ? 'changed [!]' : this.state.value; return ( 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 ac0096d7251f1..c6f0fbd333f3b 100644 --- a/packages/react-dom/src/events/plugins/__tests__/SimpleEventPlugin-test.js +++ b/packages/react-dom/src/events/plugins/__tests__/SimpleEventPlugin-test.js @@ -200,7 +200,7 @@ describe('SimpleEventPlugin', function () { count: state.count + 1, })); componentDidUpdate() { - Scheduler.unstable_yieldValue(`didUpdate - Count: ${this.state.count}`); + Scheduler.log(`didUpdate - Count: ${this.state.count}`); } render() { return ( @@ -263,12 +263,12 @@ describe('SimpleEventPlugin', function () { state = {disabled: false}; onClick = () => { // Perform some side-effect - Scheduler.unstable_yieldValue('Side-effect'); + Scheduler.log('Side-effect'); // Disable the button this.setState({disabled: true}); }; render() { - Scheduler.unstable_yieldValue( + Scheduler.log( `render button: ${this.state.disabled ? 'disabled' : 'enabled'}`, ); return ( diff --git a/packages/react-noop-renderer/src/createReactNoop.js b/packages/react-noop-renderer/src/createReactNoop.js index c8ce26b4f6dc0..3ea1836ce2055 100644 --- a/packages/react-noop-renderer/src/createReactNoop.js +++ b/packages/react-noop-renderer/src/createReactNoop.js @@ -980,7 +980,7 @@ function createReactNoop(reconciler: Function, useMutation: boolean) { flushNextYield(): Array { Scheduler.unstable_flushNumberOfYields(1); - return Scheduler.unstable_clearYields(); + return Scheduler.unstable_clearLog(); }, flushWithHostCounters(fn: () => void): diff --git a/packages/react-reconciler/src/ReactFiberDevToolsHook.js b/packages/react-reconciler/src/ReactFiberDevToolsHook.js index 9594508cf0dde..f10806af18803 100644 --- a/packages/react-reconciler/src/ReactFiberDevToolsHook.js +++ b/packages/react-reconciler/src/ReactFiberDevToolsHook.js @@ -35,7 +35,7 @@ import { UserBlockingPriority as UserBlockingSchedulerPriority, NormalPriority as NormalSchedulerPriority, IdlePriority as IdleSchedulerPriority, - unstable_yieldValue, + log, unstable_setDisableYieldValue, } from './Scheduler'; import {setSuppressWarning} from 'shared/consoleWithStackDev'; @@ -201,8 +201,8 @@ export function onCommitUnmount(fiber: Fiber) { export function setIsStrictModeForDevtools(newIsStrictMode: boolean) { if (consoleManagedByDevToolsDuringStrictMode) { - if (typeof unstable_yieldValue === 'function') { - // We're in a test because Scheduler.unstable_yieldValue only exists + if (typeof log === 'function') { + // We're in a test because Scheduler.log only exists // in SchedulerMock. To reduce the noise in strict mode tests, // suppress warnings and disable scheduler yielding during the double render unstable_setDisableYieldValue(newIsStrictMode); diff --git a/packages/react-reconciler/src/Scheduler.js b/packages/react-reconciler/src/Scheduler.js index fe448fd4758d9..76dbad84d28b3 100644 --- a/packages/react-reconciler/src/Scheduler.js +++ b/packages/react-reconciler/src/Scheduler.js @@ -29,6 +29,6 @@ export type SchedulerCallback = (isSync: boolean) => SchedulerCallback | null; // this doesn't actually exist on the scheduler, but it *does* // on scheduler/unstable_mock, which we'll need for internal testing -export const unstable_yieldValue = Scheduler.unstable_yieldValue; +export const log = Scheduler.log; export const unstable_setDisableYieldValue = Scheduler.unstable_setDisableYieldValue; diff --git a/packages/react-reconciler/src/__tests__/ReactActWarnings-test.js b/packages/react-reconciler/src/__tests__/ReactActWarnings-test.js index 15248976ca1bf..4cf0fd4d3bd12 100644 --- a/packages/react-reconciler/src/__tests__/ReactActWarnings-test.js +++ b/packages/react-reconciler/src/__tests__/ReactActWarnings-test.js @@ -87,16 +87,16 @@ describe('act warnings', () => { if (record !== undefined) { switch (record.status) { case 'pending': - Scheduler.unstable_yieldValue(`Suspend! [${text}]`); + Scheduler.log(`Suspend! [${text}]`); throw record.value; case 'rejected': - Scheduler.unstable_yieldValue(`Error! [${text}]`); + Scheduler.log(`Error! [${text}]`); throw record.value; case 'resolved': return textCache.version; } } else { - Scheduler.unstable_yieldValue(`Suspend! [${text}]`); + Scheduler.log(`Suspend! [${text}]`); const thenable = { pings: [], @@ -120,13 +120,13 @@ describe('act warnings', () => { } function Text({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return text; } function AsyncText({text}) { readText(text); - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return text; } diff --git a/packages/react-reconciler/src/__tests__/ReactBatching-test.internal.js b/packages/react-reconciler/src/__tests__/ReactBatching-test.internal.js index 8d7bb3e75668c..d66634830fce7 100644 --- a/packages/react-reconciler/src/__tests__/ReactBatching-test.internal.js +++ b/packages/react-reconciler/src/__tests__/ReactBatching-test.internal.js @@ -28,7 +28,7 @@ describe('ReactBlockingMode', () => { ([text, ms = 0]) => { return new Promise((resolve, reject) => setTimeout(() => { - Scheduler.unstable_yieldValue(`Promise resolved [${text}]`); + Scheduler.log(`Promise resolved [${text}]`); resolve(text); }, ms), ); @@ -38,7 +38,7 @@ describe('ReactBlockingMode', () => { }); function Text(props) { - Scheduler.unstable_yieldValue(props.text); + Scheduler.log(props.text); return props.text; } @@ -46,13 +46,13 @@ describe('ReactBlockingMode', () => { const text = props.text; try { TextResource.read([props.text, props.ms]); - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return props.text; } catch (promise) { if (typeof promise.then === 'function') { - Scheduler.unstable_yieldValue(`Suspend! [${text}]`); + Scheduler.log(`Suspend! [${text}]`); } else { - Scheduler.unstable_yieldValue(`Error! [${text}]`); + Scheduler.log(`Error! [${text}]`); } throw promise; } @@ -81,7 +81,7 @@ describe('ReactBlockingMode', () => { function App() { useLayoutEffect(() => { - Scheduler.unstable_yieldValue('Layout effect'); + Scheduler.log('Layout effect'); }); return ; } diff --git a/packages/react-reconciler/src/__tests__/ReactCPUSuspense-test.js b/packages/react-reconciler/src/__tests__/ReactCPUSuspense-test.js index 3444f3f2a406a..2d2c522a0f980 100644 --- a/packages/react-reconciler/src/__tests__/ReactCPUSuspense-test.js +++ b/packages/react-reconciler/src/__tests__/ReactCPUSuspense-test.js @@ -77,7 +77,7 @@ describe('ReactSuspenseWithNoopRenderer', () => { // const record = textCache.get(text); // if (record !== undefined) { // if (record.status === 'pending') { - // Scheduler.unstable_yieldValue(`Promise rejected [${text}]`); + // Scheduler.log(`Promise rejected [${text}]`); // record.ping(); // record.status = 'rejected'; // clearTimeout(record.promise._timer); @@ -95,7 +95,7 @@ describe('ReactSuspenseWithNoopRenderer', () => { }); function Text(props) { - Scheduler.unstable_yieldValue(props.text); + Scheduler.log(props.text); return props.text; } @@ -103,13 +103,13 @@ describe('ReactSuspenseWithNoopRenderer', () => { const text = props.text; try { readText(text); - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return text; } catch (promise) { if (typeof promise.then === 'function') { - Scheduler.unstable_yieldValue(`Suspend! [${text}]`); + Scheduler.log(`Suspend! [${text}]`); } else { - Scheduler.unstable_yieldValue(`Error! [${text}]`); + Scheduler.log(`Error! [${text}]`); } throw promise; } diff --git a/packages/react-reconciler/src/__tests__/ReactCache-test.js b/packages/react-reconciler/src/__tests__/ReactCache-test.js index 25e0dbebb00b3..770ebaaac9150 100644 --- a/packages/react-reconciler/src/__tests__/ReactCache-test.js +++ b/packages/react-reconciler/src/__tests__/ReactCache-test.js @@ -100,9 +100,7 @@ describe('ReactCache', () => { record.cleanupScheduled = true; if (getCacheSignal) { signal.addEventListener('abort', () => { - Scheduler.unstable_yieldValue( - `Cache cleanup: ${text} [v${textCache.version}]`, - ); + Scheduler.log(`Cache cleanup: ${text} [v${textCache.version}]`); }); } } @@ -115,7 +113,7 @@ describe('ReactCache', () => { return textCache.version; } } else { - Scheduler.unstable_yieldValue(`Cache miss! [${text}]`); + Scheduler.log(`Cache miss! [${text}]`); let resolve; let reject; @@ -148,9 +146,7 @@ describe('ReactCache', () => { if (getCacheSignal) { signal.addEventListener('abort', () => { - Scheduler.unstable_yieldValue( - `Cache cleanup: ${text} [v${textCache.version}]`, - ); + Scheduler.log(`Cache cleanup: ${text} [v${textCache.version}]`); }); } throw thenable; @@ -158,14 +154,14 @@ describe('ReactCache', () => { } function Text({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return text; } function AsyncText({text, showVersion}) { const version = readText(text); const fullText = showVersion ? `${text} [v${version}]` : text; - Scheduler.unstable_yieldValue(fullText); + Scheduler.log(fullText); return fullText; } diff --git a/packages/react-reconciler/src/__tests__/ReactClassSetStateCallback-test.js b/packages/react-reconciler/src/__tests__/ReactClassSetStateCallback-test.js index 216da08c96ae2..82bb637cafe5d 100644 --- a/packages/react-reconciler/src/__tests__/ReactClassSetStateCallback-test.js +++ b/packages/react-reconciler/src/__tests__/ReactClassSetStateCallback-test.js @@ -18,7 +18,7 @@ describe('ReactClassSetStateCallback', () => { }); function Text({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return text; } @@ -41,19 +41,13 @@ describe('ReactClassSetStateCallback', () => { await act(async () => { if (gate(flags => flags.enableUnifiedSyncLane)) { React.startTransition(() => { - app.setState({step: 1}, () => - Scheduler.unstable_yieldValue('Callback 1'), - ); + app.setState({step: 1}, () => Scheduler.log('Callback 1')); }); } else { - app.setState({step: 1}, () => - Scheduler.unstable_yieldValue('Callback 1'), - ); + app.setState({step: 1}, () => Scheduler.log('Callback 1')); } ReactNoop.flushSync(() => { - app.setState({step: 2}, () => - Scheduler.unstable_yieldValue('Callback 2'), - ); + app.setState({step: 2}, () => Scheduler.log('Callback 2')); }); }); assertLog([2, 'Callback 2', 2, 'Callback 1']); diff --git a/packages/react-reconciler/src/__tests__/ReactConcurrentErrorRecovery-test.js b/packages/react-reconciler/src/__tests__/ReactConcurrentErrorRecovery-test.js index 7d7d11c53cab6..67e3c4f340a5f 100644 --- a/packages/react-reconciler/src/__tests__/ReactConcurrentErrorRecovery-test.js +++ b/packages/react-reconciler/src/__tests__/ReactConcurrentErrorRecovery-test.js @@ -86,16 +86,16 @@ describe('ReactConcurrentErrorRecovery', () => { if (record !== undefined) { switch (record.status) { case 'pending': - Scheduler.unstable_yieldValue(`Suspend! [${text}]`); + Scheduler.log(`Suspend! [${text}]`); throw record.value; case 'rejected': - Scheduler.unstable_yieldValue(`Error! [${text}]`); + Scheduler.log(`Error! [${text}]`); throw record.value; case 'resolved': return textCache.version; } } else { - Scheduler.unstable_yieldValue(`Suspend! [${text}]`); + Scheduler.log(`Suspend! [${text}]`); const thenable = { pings: [], @@ -119,14 +119,14 @@ describe('ReactConcurrentErrorRecovery', () => { } function Text({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return text; } function AsyncText({text, showVersion}) { const version = readText(text); const fullText = showVersion ? `${text} [v${version}]` : text; - Scheduler.unstable_yieldValue(fullText); + Scheduler.log(fullText); return fullText; } diff --git a/packages/react-reconciler/src/__tests__/ReactContextPropagation-test.js b/packages/react-reconciler/src/__tests__/ReactContextPropagation-test.js index 49db1ea0fe159..5a56c47dfe069 100644 --- a/packages/react-reconciler/src/__tests__/ReactContextPropagation-test.js +++ b/packages/react-reconciler/src/__tests__/ReactContextPropagation-test.js @@ -96,16 +96,16 @@ describe('ReactLazyContextPropagation', () => { if (record !== undefined) { switch (record.status) { case 'pending': - Scheduler.unstable_yieldValue(`Suspend! [${text}]`); + Scheduler.log(`Suspend! [${text}]`); throw record.value; case 'rejected': - Scheduler.unstable_yieldValue(`Error! [${text}]`); + Scheduler.log(`Error! [${text}]`); throw record.value; case 'resolved': return textCache.version; } } else { - Scheduler.unstable_yieldValue(`Suspend! [${text}]`); + Scheduler.log(`Suspend! [${text}]`); const thenable = { pings: [], @@ -129,14 +129,14 @@ describe('ReactLazyContextPropagation', () => { } function Text({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return text; } // function AsyncText({text, showVersion}) { // const version = readText(text); // const fullText = showVersion ? `${text} [v${version}]` : text; - // Scheduler.unstable_yieldValue(fullText); + // Scheduler.log(fullText); // return text; // } @@ -321,7 +321,7 @@ describe('ReactLazyContextPropagation', () => { const [, _setOtherValue] = useState(0); setOtherValue = _setOtherValue; - Scheduler.unstable_yieldValue('Consumer'); + Scheduler.log('Consumer'); return ; }); diff --git a/packages/react-reconciler/src/__tests__/ReactDeferredValue-test.js b/packages/react-reconciler/src/__tests__/ReactDeferredValue-test.js index 328e77b1850d8..82e701106d91a 100644 --- a/packages/react-reconciler/src/__tests__/ReactDeferredValue-test.js +++ b/packages/react-reconciler/src/__tests__/ReactDeferredValue-test.js @@ -37,7 +37,7 @@ describe('ReactDeferredValue', () => { }); function Text({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return text; } diff --git a/packages/react-reconciler/src/__tests__/ReactDisableSchedulerTimeoutBasedOnReactExpirationTime-test.internal.js b/packages/react-reconciler/src/__tests__/ReactDisableSchedulerTimeoutBasedOnReactExpirationTime-test.internal.js index 0bf1bb1ee02b7..ccde59f41d60f 100644 --- a/packages/react-reconciler/src/__tests__/ReactDisableSchedulerTimeoutBasedOnReactExpirationTime-test.internal.js +++ b/packages/react-reconciler/src/__tests__/ReactDisableSchedulerTimeoutBasedOnReactExpirationTime-test.internal.js @@ -29,7 +29,7 @@ describe('ReactSuspenseList', () => { }); function Text(props) { - Scheduler.unstable_yieldValue(props.text); + Scheduler.log(props.text); return props.text; } @@ -37,7 +37,7 @@ describe('ReactSuspenseList', () => { let resolved = false; const Component = function () { if (!resolved) { - Scheduler.unstable_yieldValue('Suspend! [' + text + ']'); + Scheduler.log('Suspend! [' + text + ']'); throw promise; } return ; @@ -79,11 +79,11 @@ describe('ReactSuspenseList', () => { expect(root).toMatchRenderedOutput(null); scheduleCallback(NormalPriority, () => { - Scheduler.unstable_yieldValue('Resolve A'); + Scheduler.log('Resolve A'); A.resolve(); }); scheduleCallback(NormalPriority, () => { - Scheduler.unstable_yieldValue('Resolve B'); + Scheduler.log('Resolve B'); B.resolve(); }); diff --git a/packages/react-reconciler/src/__tests__/ReactEffectOrdering-test.js b/packages/react-reconciler/src/__tests__/ReactEffectOrdering-test.js index 90034cf06e5ef..07e052fdc558c 100644 --- a/packages/react-reconciler/src/__tests__/ReactEffectOrdering-test.js +++ b/packages/react-reconciler/src/__tests__/ReactEffectOrdering-test.js @@ -41,14 +41,14 @@ describe('ReactEffectOrdering', () => { function Parent() { useLayoutEffect(() => { - return () => Scheduler.unstable_yieldValue('Unmount parent'); + return () => Scheduler.log('Unmount parent'); }); return ; } function Child() { useLayoutEffect(() => { - return () => Scheduler.unstable_yieldValue('Unmount child'); + return () => Scheduler.log('Unmount child'); }); return 'Child'; } @@ -68,14 +68,14 @@ describe('ReactEffectOrdering', () => { function Parent() { useEffect(() => { - return () => Scheduler.unstable_yieldValue('Unmount parent'); + return () => Scheduler.log('Unmount parent'); }); return ; } function Child() { useEffect(() => { - return () => Scheduler.unstable_yieldValue('Unmount child'); + return () => Scheduler.log('Unmount child'); }); return 'Child'; } diff --git a/packages/react-reconciler/src/__tests__/ReactExpiration-test.js b/packages/react-reconciler/src/__tests__/ReactExpiration-test.js index 1903ab2eee25f..4e561ab2a516b 100644 --- a/packages/react-reconciler/src/__tests__/ReactExpiration-test.js +++ b/packages/react-reconciler/src/__tests__/ReactExpiration-test.js @@ -69,7 +69,7 @@ describe('ReactExpiration', () => { const record = textCache.get(text); if (record !== undefined) { if (record.status === 'pending') { - Scheduler.unstable_yieldValue(`Promise resolved [${text}]`); + Scheduler.log(`Promise resolved [${text}]`); record.ping(); record.ping = null; record.status = 'resolved'; @@ -88,7 +88,7 @@ describe('ReactExpiration', () => { }); function Text(props) { - Scheduler.unstable_yieldValue(props.text); + Scheduler.log(props.text); return props.text; } @@ -96,18 +96,18 @@ describe('ReactExpiration', () => { const text = props.text; try { readText(text); - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return text; } catch (promise) { if (typeof promise.then === 'function') { - Scheduler.unstable_yieldValue(`Suspend! [${text}]`); + Scheduler.log(`Suspend! [${text}]`); if (typeof props.ms === 'number' && promise._timer === undefined) { promise._timer = setTimeout(() => { resolveText(text); }, props.ms); } } else { - Scheduler.unstable_yieldValue(`Error! [${text}]`); + Scheduler.log(`Error! [${text}]`); } throw promise; } @@ -147,13 +147,13 @@ describe('ReactExpiration', () => { it('two updates of like priority in the same event always flush within the same batch', async () => { class TextClass extends React.Component { componentDidMount() { - Scheduler.unstable_yieldValue(`${this.props.text} [commit]`); + Scheduler.log(`${this.props.text} [commit]`); } componentDidUpdate() { - Scheduler.unstable_yieldValue(`${this.props.text} [commit]`); + Scheduler.log(`${this.props.text} [commit]`); } render() { - Scheduler.unstable_yieldValue(`${this.props.text} [render]`); + Scheduler.log(`${this.props.text} [render]`); return ; } } @@ -204,13 +204,13 @@ describe('ReactExpiration', () => { async () => { class TextClass extends React.Component { componentDidMount() { - Scheduler.unstable_yieldValue(`${this.props.text} [commit]`); + Scheduler.log(`${this.props.text} [commit]`); } componentDidUpdate() { - Scheduler.unstable_yieldValue(`${this.props.text} [commit]`); + Scheduler.log(`${this.props.text} [commit]`); } render() { - Scheduler.unstable_yieldValue(`${this.props.text} [render]`); + Scheduler.log(`${this.props.text} [render]`); return ; } } @@ -268,19 +268,13 @@ describe('ReactExpiration', () => { state = {text: store.text}; componentDidMount() { subscribers.push(this); - Scheduler.unstable_yieldValue( - `${this.state.text} [${this.props.label}] [commit]`, - ); + Scheduler.log(`${this.state.text} [${this.props.label}] [commit]`); } componentDidUpdate() { - Scheduler.unstable_yieldValue( - `${this.state.text} [${this.props.label}] [commit]`, - ); + Scheduler.log(`${this.state.text} [${this.props.label}] [commit]`); } render() { - Scheduler.unstable_yieldValue( - `${this.state.text} [${this.props.label}] [render]`, - ); + Scheduler.log(`${this.state.text} [${this.props.label}] [render]`); return ; } } @@ -717,7 +711,7 @@ describe('ReactExpiration', () => { it('passive effects of expired update flush after paint', async () => { function App({step}) { useEffect(() => { - Scheduler.unstable_yieldValue('Effect: ' + step); + Scheduler.log('Effect: ' + step); }, [step]); return ( <> diff --git a/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js b/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js index 9b9d2abe35e78..4bf1b05dcd282 100644 --- a/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js +++ b/packages/react-reconciler/src/__tests__/ReactFlushSync-test.js @@ -28,7 +28,7 @@ describe('ReactFlushSync', () => { }); function Text({text}) { - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return text; } @@ -126,7 +126,7 @@ describe('ReactFlushSync', () => { test('flushes passive effects synchronously when they are the result of a sync render', async () => { function App() { useEffect(() => { - Scheduler.unstable_yieldValue('Effect'); + Scheduler.log('Effect'); }, []); return ; } @@ -149,7 +149,7 @@ describe('ReactFlushSync', () => { test('do not flush passive effects synchronously after render in legacy mode', async () => { function App() { useEffect(() => { - Scheduler.unstable_yieldValue('Effect'); + Scheduler.log('Effect'); }, []); return ; } @@ -176,7 +176,7 @@ describe('ReactFlushSync', () => { function App({step}) { useEffect(() => { currentStep = step; - Scheduler.unstable_yieldValue('Effect: ' + step); + Scheduler.log('Effect: ' + step); }, [step]); return ; } @@ -207,7 +207,7 @@ describe('ReactFlushSync', () => { test("do not flush passive effects synchronously when they aren't the result of a sync render", async () => { function App() { useEffect(() => { - Scheduler.unstable_yieldValue('Effect'); + Scheduler.log('Effect'); }, []); return ; } @@ -229,7 +229,7 @@ describe('ReactFlushSync', () => { test('does not flush pending passive effects', async () => { function App() { useEffect(() => { - Scheduler.unstable_yieldValue('Effect'); + Scheduler.log('Effect'); }, []); return ; } diff --git a/packages/react-reconciler/src/__tests__/ReactHooks-test.internal.js b/packages/react-reconciler/src/__tests__/ReactHooks-test.internal.js index 453fc579d1d22..df5af903a7216 100644 --- a/packages/react-reconciler/src/__tests__/ReactHooks-test.internal.js +++ b/packages/react-reconciler/src/__tests__/ReactHooks-test.internal.js @@ -64,7 +64,7 @@ describe('ReactHooks', () => { const {useState, useLayoutEffect} = React; function Child({text}) { - Scheduler.unstable_yieldValue('Child: ' + text); + Scheduler.log('Child: ' + text); return text; } @@ -77,9 +77,9 @@ describe('ReactHooks', () => { setCounter2 = _setCounter2; const text = `${counter1}, ${counter2}`; - Scheduler.unstable_yieldValue(`Parent: ${text}`); + Scheduler.log(`Parent: ${text}`); useLayoutEffect(() => { - Scheduler.unstable_yieldValue(`Effect: ${text}`); + Scheduler.log(`Effect: ${text}`); }); return ; } @@ -153,7 +153,7 @@ describe('ReactHooks', () => { const {useState, memo} = React; function Child({text}) { - Scheduler.unstable_yieldValue('Child: ' + text); + Scheduler.log('Child: ' + text); return text; } @@ -166,7 +166,7 @@ describe('ReactHooks', () => { setCounter2 = _setCounter2; const text = `${counter1}, ${counter2} (${theme})`; - Scheduler.unstable_yieldValue(`Parent: ${text}`); + Scheduler.log(`Parent: ${text}`); return ; } @@ -226,7 +226,7 @@ describe('ReactHooks', () => { const [counter, _setCounter] = useState(0); setCounter = _setCounter; - Scheduler.unstable_yieldValue(`Count: ${counter}`); + Scheduler.log(`Count: ${counter}`); return counter; } @@ -260,7 +260,7 @@ describe('ReactHooks', () => { const [counter, _dispatch] = useReducer((s, a) => a, 0); dispatch = _dispatch; - Scheduler.unstable_yieldValue(`Count: ${counter}`); + Scheduler.log(`Count: ${counter}`); return counter; } @@ -294,7 +294,7 @@ describe('ReactHooks', () => { let setTheme; function ThemeProvider({children}) { const [theme, _setTheme] = useState('light'); - Scheduler.unstable_yieldValue('Theme: ' + theme); + Scheduler.log('Theme: ' + theme); setTheme = _setTheme; return ( {children} @@ -302,7 +302,7 @@ describe('ReactHooks', () => { } function Child({text}) { - Scheduler.unstable_yieldValue('Child: ' + text); + Scheduler.log('Child: ' + text); return text; } @@ -314,9 +314,9 @@ describe('ReactHooks', () => { const theme = useContext(ThemeContext); const text = `${counter} (${theme})`; - Scheduler.unstable_yieldValue(`Parent: ${text}`); + Scheduler.log(`Parent: ${text}`); useLayoutEffect(() => { - Scheduler.unstable_yieldValue(`Effect: ${text}`); + Scheduler.log(`Effect: ${text}`); }); return ; } @@ -373,7 +373,7 @@ describe('ReactHooks', () => { const {useState, useLayoutEffect} = React; function Child({text}) { - Scheduler.unstable_yieldValue('Child: ' + text); + Scheduler.log('Child: ' + text); return text; } @@ -381,9 +381,9 @@ describe('ReactHooks', () => { function Parent() { const [counter, _setCounter] = useState(0); setCounter = _setCounter; - Scheduler.unstable_yieldValue('Parent: ' + counter); + Scheduler.log('Parent: ' + counter); useLayoutEffect(() => { - Scheduler.unstable_yieldValue('Effect: ' + counter); + Scheduler.log('Effect: ' + counter); }); return ; } @@ -451,7 +451,7 @@ describe('ReactHooks', () => { const {useState} = React; function Child({text}) { - Scheduler.unstable_yieldValue('Child: ' + text); + Scheduler.log('Child: ' + text); return text; } @@ -459,7 +459,7 @@ describe('ReactHooks', () => { function Parent() { const [counter, _setCounter] = useState(0); setCounter = _setCounter; - Scheduler.unstable_yieldValue('Parent: ' + counter); + Scheduler.log('Parent: ' + counter); return ; } @@ -470,9 +470,7 @@ describe('ReactHooks', () => { const update = value => { setCounter(previous => { - Scheduler.unstable_yieldValue( - `Compute state (${previous} -> ${value})`, - ); + Scheduler.log(`Compute state (${previous} -> ${value})`); return value; }); }; @@ -511,7 +509,7 @@ describe('ReactHooks', () => { const {useState} = React; function Child({text}) { - Scheduler.unstable_yieldValue('Child: ' + text); + Scheduler.log('Child: ' + text); return text; } @@ -519,7 +517,7 @@ describe('ReactHooks', () => { function Parent() { const [counter, _setCounter] = useState(1); setCounter = _setCounter; - Scheduler.unstable_yieldValue('Parent: ' + counter); + Scheduler.log('Parent: ' + counter); return ; } @@ -531,9 +529,7 @@ describe('ReactHooks', () => { const update = compute => { setCounter(previous => { const value = compute(previous); - Scheduler.unstable_yieldValue( - `Compute state (${previous} -> ${value})`, - ); + Scheduler.log(`Compute state (${previous} -> ${value})`); return value; }); }; @@ -575,9 +571,7 @@ describe('ReactHooks', () => { const {useLayoutEffect} = React; function App(props) { useLayoutEffect(() => { - Scheduler.unstable_yieldValue( - 'Did commit: ' + props.dependencies.join(', '), - ); + Scheduler.log('Did commit: ' + props.dependencies.join(', ')); }, props.dependencies); return props.dependencies; } @@ -599,7 +593,7 @@ describe('ReactHooks', () => { function App({text, hasDeps}) { const resolvedText = useMemo( () => { - Scheduler.unstable_yieldValue('Compute'); + Scheduler.log('Compute'); return text.toUpperCase(); }, hasDeps ? null : [text], diff --git a/packages/react-reconciler/src/__tests__/ReactHooksWithNoopRenderer-test.js b/packages/react-reconciler/src/__tests__/ReactHooksWithNoopRenderer-test.js index b6686ec2bafcb..7325a3cf79b32 100644 --- a/packages/react-reconciler/src/__tests__/ReactHooksWithNoopRenderer-test.js +++ b/packages/react-reconciler/src/__tests__/ReactHooksWithNoopRenderer-test.js @@ -107,7 +107,7 @@ describe('ReactHooksWithNoopRenderer', () => { const record = textCache.get(text); if (record !== undefined) { if (record.status === 'pending') { - Scheduler.unstable_yieldValue(`Promise resolved [${text}]`); + Scheduler.log(`Promise resolved [${text}]`); record.ping(); record.ping = null; record.status = 'resolved'; @@ -126,7 +126,7 @@ describe('ReactHooksWithNoopRenderer', () => { }); function Text(props) { - Scheduler.unstable_yieldValue(props.text); + Scheduler.log(props.text); return ; } @@ -134,18 +134,18 @@ describe('ReactHooksWithNoopRenderer', () => { const text = props.text; try { readText(text); - Scheduler.unstable_yieldValue(text); + Scheduler.log(text); return ; } catch (promise) { if (typeof promise.then === 'function') { - Scheduler.unstable_yieldValue(`Suspend! [${text}]`); + Scheduler.log(`Suspend! [${text}]`); if (typeof props.ms === 'number' && promise._timer === undefined) { promise._timer = setTimeout(() => { resolveText(text); }, props.ms); } } else { - Scheduler.unstable_yieldValue(`Error! [${text}]`); + Scheduler.log(`Error! [${text}]`); } throw promise; } @@ -306,7 +306,7 @@ describe('ReactHooksWithNoopRenderer', () => { it('lazy state initializer', async () => { function Counter(props, ref) { const [count, updateCount] = useState(() => { - Scheduler.unstable_yieldValue('getInitialState'); + Scheduler.log('getInitialState'); return props.initialState; }); useImperativeHandle(ref, () => ({updateCount})); @@ -518,7 +518,7 @@ describe('ReactHooksWithNoopRenderer', () => { if (count < 3) { setCount(count + 1); } - Scheduler.unstable_yieldValue('Render: ' + count); + Scheduler.log('Render: ' + count); return ; } @@ -535,7 +535,7 @@ describe('ReactHooksWithNoopRenderer', () => { setCount(c => c + 1); setCount(c => c + 1); } - Scheduler.unstable_yieldValue('Render: ' + count); + Scheduler.log('Render: ' + count); return ; } @@ -556,7 +556,7 @@ describe('ReactHooksWithNoopRenderer', () => { function Counter({row: newRow}) { const [count, setCount] = useState(0); setCount(count + 1); - Scheduler.unstable_yieldValue('Render: ' + count); + Scheduler.log('Render: ' + count); return ; } ReactNoop.render(); @@ -575,7 +575,7 @@ describe('ReactHooksWithNoopRenderer', () => { if (count < 3) { dispatch('increment'); } - Scheduler.unstable_yieldValue('Render: ' + count); + Scheduler.log('Render: ' + count); return ; } @@ -618,7 +618,7 @@ describe('ReactHooksWithNoopRenderer', () => { setReducer(() => reducerA); } } - Scheduler.unstable_yieldValue('Render: ' + count); + Scheduler.log('Render: ' + count); return ; } Counter = forwardRef(Counter); @@ -673,7 +673,7 @@ describe('ReactHooksWithNoopRenderer', () => { if (counter === 0) { // We're suspending during a render that includes render phase // updates. Those updates should not persist to the next render. - Scheduler.unstable_yieldValue('Suspend!'); + Scheduler.log('Suspend!'); throw thenable; } } @@ -717,7 +717,7 @@ describe('ReactHooksWithNoopRenderer', () => { if (counter === 1) { // We're suspending during a render that includes render phase // updates. Those updates should not persist to the next render. - Scheduler.unstable_yieldValue('Suspend!'); + Scheduler.log('Suspend!'); throw thenable; } @@ -881,7 +881,7 @@ describe('ReactHooksWithNoopRenderer', () => { function Counter(props, ref) { const [count, dispatch] = useReducer(reducer, props, p => { - Scheduler.unstable_yieldValue('Init'); + Scheduler.log('Init'); return p.initialCount; }); useImperativeHandle(ref, () => ({dispatch})); @@ -953,13 +953,13 @@ describe('ReactHooksWithNoopRenderer', () => { it('simple mount and update', async () => { function Counter(props) { useEffect(() => { - Scheduler.unstable_yieldValue(`Passive effect [${props.count}]`); + Scheduler.log(`Passive effect [${props.count}]`); }); return ; } await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -969,7 +969,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 1', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -981,13 +981,13 @@ describe('ReactHooksWithNoopRenderer', () => { it('flushes passive effects even with sibling deletions', async () => { function LayoutEffect(props) { useLayoutEffect(() => { - Scheduler.unstable_yieldValue(`Layout effect`); + Scheduler.log(`Layout effect`); }); return ; } function PassiveEffect(props) { useEffect(() => { - Scheduler.unstable_yieldValue(`Passive effect`); + Scheduler.log(`Passive effect`); }, []); return ; } @@ -1014,7 +1014,7 @@ describe('ReactHooksWithNoopRenderer', () => { it('flushes passive effects even if siblings schedule an update', async () => { function PassiveEffect(props) { useEffect(() => { - Scheduler.unstable_yieldValue('Passive effect'); + Scheduler.log('Passive effect'); }); return ; } @@ -1025,7 +1025,7 @@ describe('ReactHooksWithNoopRenderer', () => { if (count === 0) { setCount(1); } - Scheduler.unstable_yieldValue('Layout effect ' + count); + Scheduler.log('Layout effect ' + count); }); return ; } @@ -1054,13 +1054,13 @@ describe('ReactHooksWithNoopRenderer', () => { it('flushes passive effects even if siblings schedule a new root', async () => { function PassiveEffect(props) { useEffect(() => { - Scheduler.unstable_yieldValue('Passive effect'); + Scheduler.log('Passive effect'); }, []); return ; } function LayoutEffect(props) { useLayoutEffect(() => { - Scheduler.unstable_yieldValue('Layout effect'); + Scheduler.log('Layout effect'); // Scheduling work shouldn't interfere with the queued passive effect ReactNoop.renderToRootWithID(, 'root2'); }); @@ -1098,7 +1098,7 @@ describe('ReactHooksWithNoopRenderer', () => { function Counter(props) { useEffect(() => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Committed state when effect was fired: ${getCommittedText()}`, ); }); @@ -1106,13 +1106,13 @@ describe('ReactHooksWithNoopRenderer', () => { } await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor([0, 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); // Before the effects have a chance to flush, schedule another update ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor([ // The previous effect flushes before the reconciliation @@ -1130,36 +1130,36 @@ describe('ReactHooksWithNoopRenderer', () => { it('defers passive effect destroy functions during unmount', async () => { function Child({bar, foo}) { React.useEffect(() => { - Scheduler.unstable_yieldValue('passive bar create'); + Scheduler.log('passive bar create'); return () => { - Scheduler.unstable_yieldValue('passive bar destroy'); + Scheduler.log('passive bar destroy'); }; }, [bar]); React.useLayoutEffect(() => { - Scheduler.unstable_yieldValue('layout bar create'); + Scheduler.log('layout bar create'); return () => { - Scheduler.unstable_yieldValue('layout bar destroy'); + Scheduler.log('layout bar destroy'); }; }, [bar]); React.useEffect(() => { - Scheduler.unstable_yieldValue('passive foo create'); + Scheduler.log('passive foo create'); return () => { - Scheduler.unstable_yieldValue('passive foo destroy'); + Scheduler.log('passive foo destroy'); }; }, [foo]); React.useLayoutEffect(() => { - Scheduler.unstable_yieldValue('layout foo create'); + Scheduler.log('layout foo create'); return () => { - Scheduler.unstable_yieldValue('layout foo destroy'); + Scheduler.log('layout foo destroy'); }; }, [foo]); - Scheduler.unstable_yieldValue('render'); + Scheduler.log('render'); return null; } await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor([ 'render', @@ -1175,7 +1175,7 @@ describe('ReactHooksWithNoopRenderer', () => { // Effects without updating dependencies lose their layout/passive tag during an update. await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor([ 'render', @@ -1189,9 +1189,7 @@ describe('ReactHooksWithNoopRenderer', () => { // Unmount the component and verify that passive destroy functions are deferred until post-commit. await act(async () => { - ReactNoop.render(null, () => - Scheduler.unstable_yieldValue('Sync effect'), - ); + ReactNoop.render(null, () => Scheduler.log('Sync effect')); await waitFor([ 'layout bar destroy', 'layout foo destroy', @@ -1205,20 +1203,20 @@ describe('ReactHooksWithNoopRenderer', () => { it('does not warn about state updates for unmounted components with pending passive unmounts', async () => { let completePendingRequest = null; function Component() { - Scheduler.unstable_yieldValue('Component'); + Scheduler.log('Component'); const [didLoad, setDidLoad] = React.useState(false); React.useLayoutEffect(() => { - Scheduler.unstable_yieldValue('layout create'); + Scheduler.log('layout create'); return () => { - Scheduler.unstable_yieldValue('layout destroy'); + Scheduler.log('layout destroy'); }; }, []); React.useEffect(() => { - Scheduler.unstable_yieldValue('passive create'); + Scheduler.log('passive create'); // Mimic an XHR request with a complete handler that updates state. completePendingRequest = () => setDidLoad(true); return () => { - Scheduler.unstable_yieldValue('passive destroy'); + Scheduler.log('passive destroy'); }; }, []); return didLoad; @@ -1226,7 +1224,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.renderToRootWithID(, 'root', () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Component', 'layout create', 'Sync effect']); ReactNoop.flushPassiveEffects(); @@ -1252,9 +1250,9 @@ describe('ReactHooksWithNoopRenderer', () => { function Parent() { const [state, setState] = useState(true); setParentState = setState; - Scheduler.unstable_yieldValue(`Parent ${state} render`); + Scheduler.log(`Parent ${state} render`); useLayoutEffect(() => { - Scheduler.unstable_yieldValue(`Parent ${state} commit`); + Scheduler.log(`Parent ${state} commit`); }); if (state) { return ( @@ -1271,16 +1269,16 @@ describe('ReactHooksWithNoopRenderer', () => { function Child({label}) { const [state, setState] = useState(0); useLayoutEffect(() => { - Scheduler.unstable_yieldValue(`Child ${label} commit`); + Scheduler.log(`Child ${label} commit`); }); useEffect(() => { setChildStates.push(setState); - Scheduler.unstable_yieldValue(`Child ${label} passive create`); + Scheduler.log(`Child ${label} passive create`); return () => { - Scheduler.unstable_yieldValue(`Child ${label} passive destroy`); + Scheduler.log(`Child ${label} passive destroy`); }; }, []); - Scheduler.unstable_yieldValue(`Child ${label} render`); + Scheduler.log(`Child ${label} render`); return state; } @@ -1334,14 +1332,14 @@ describe('ReactHooksWithNoopRenderer', () => { it('does not warn about state updates for unmounted components with no pending passive unmounts', async () => { let completePendingRequest = null; function Component() { - Scheduler.unstable_yieldValue('Component'); + Scheduler.log('Component'); const [didLoad, setDidLoad] = React.useState(false); React.useLayoutEffect(() => { - Scheduler.unstable_yieldValue('layout create'); + Scheduler.log('layout create'); // Mimic an XHR request with a complete handler that updates state. completePendingRequest = () => setDidLoad(true); return () => { - Scheduler.unstable_yieldValue('layout destroy'); + Scheduler.log('layout destroy'); }; }, []); return didLoad; @@ -1349,7 +1347,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.renderToRootWithID(, 'root', () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Component', 'layout create', 'Sync effect']); @@ -1365,16 +1363,16 @@ describe('ReactHooksWithNoopRenderer', () => { it('does not warn if there are pending passive unmount effects but not for the current fiber', async () => { let completePendingRequest = null; function ComponentWithXHR() { - Scheduler.unstable_yieldValue('Component'); + Scheduler.log('Component'); const [didLoad, setDidLoad] = React.useState(false); React.useLayoutEffect(() => { - Scheduler.unstable_yieldValue('a:layout create'); + Scheduler.log('a:layout create'); return () => { - Scheduler.unstable_yieldValue('a:layout destroy'); + Scheduler.log('a:layout destroy'); }; }, []); React.useEffect(() => { - Scheduler.unstable_yieldValue('a:passive create'); + Scheduler.log('a:passive create'); // Mimic an XHR request with a complete handler that updates state. completePendingRequest = () => setDidLoad(true); }, []); @@ -1383,9 +1381,9 @@ describe('ReactHooksWithNoopRenderer', () => { function ComponentWithPendingPassiveUnmount() { React.useEffect(() => { - Scheduler.unstable_yieldValue('b:passive create'); + Scheduler.log('b:passive create'); return () => { - Scheduler.unstable_yieldValue('b:passive destroy'); + Scheduler.log('b:passive destroy'); }; }, []); return null; @@ -1398,7 +1396,7 @@ describe('ReactHooksWithNoopRenderer', () => { , 'root', - () => Scheduler.unstable_yieldValue('Sync effect'), + () => Scheduler.log('Sync effect'), ); await waitFor(['Component', 'a:layout create', 'Sync effect']); ReactNoop.flushPassiveEffects(); @@ -1417,13 +1415,13 @@ describe('ReactHooksWithNoopRenderer', () => { let updaterFunction; function Component() { - Scheduler.unstable_yieldValue('Component'); + Scheduler.log('Component'); const [state, setState] = React.useState(false); updaterFunction = setState; React.useEffect(() => { - Scheduler.unstable_yieldValue('passive create'); + Scheduler.log('passive create'); return () => { - Scheduler.unstable_yieldValue('passive destroy'); + Scheduler.log('passive destroy'); }; }, []); return state; @@ -1431,7 +1429,7 @@ describe('ReactHooksWithNoopRenderer', () => { act(() => { ReactNoop.renderToRootWithID(, 'root', () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); }); assertLog(['Component', 'Sync effect', 'passive create']); @@ -1446,13 +1444,13 @@ describe('ReactHooksWithNoopRenderer', () => { it('does not show a warning when a component updates its own state from within passive unmount function', async () => { function Component() { - Scheduler.unstable_yieldValue('Component'); + Scheduler.log('Component'); const [didLoad, setDidLoad] = React.useState(false); React.useEffect(() => { - Scheduler.unstable_yieldValue('passive create'); + Scheduler.log('passive create'); return () => { setDidLoad(true); - Scheduler.unstable_yieldValue('passive destroy'); + Scheduler.log('passive destroy'); }; }, []); return didLoad; @@ -1460,7 +1458,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.renderToRootWithID(, 'root', () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Component', 'Sync effect', 'passive create']); @@ -1472,23 +1470,23 @@ describe('ReactHooksWithNoopRenderer', () => { it('does not show a warning when a component updates a child state from within passive unmount function', async () => { function Parent() { - Scheduler.unstable_yieldValue('Parent'); + Scheduler.log('Parent'); const updaterRef = useRef(null); React.useEffect(() => { - Scheduler.unstable_yieldValue('Parent passive create'); + Scheduler.log('Parent passive create'); return () => { updaterRef.current(true); - Scheduler.unstable_yieldValue('Parent passive destroy'); + Scheduler.log('Parent passive destroy'); }; }, []); return ; } function Child({updaterRef}) { - Scheduler.unstable_yieldValue('Child'); + Scheduler.log('Child'); const [state, setState] = React.useState(false); React.useEffect(() => { - Scheduler.unstable_yieldValue('Child passive create'); + Scheduler.log('Child passive create'); updaterRef.current = setState; }, []); return state; @@ -1512,16 +1510,16 @@ describe('ReactHooksWithNoopRenderer', () => { it('does not show a warning when a component updates a parents state from within passive unmount function', async () => { function Parent() { const [state, setState] = React.useState(false); - Scheduler.unstable_yieldValue('Parent'); + Scheduler.log('Parent'); return ; } function Child({setState, state}) { - Scheduler.unstable_yieldValue('Child'); + Scheduler.log('Child'); React.useEffect(() => { - Scheduler.unstable_yieldValue('Child passive create'); + Scheduler.log('Child passive create'); return () => { - Scheduler.unstable_yieldValue('Child passive destroy'); + Scheduler.log('Child passive destroy'); setState(true); }; }, []); @@ -1542,14 +1540,14 @@ describe('ReactHooksWithNoopRenderer', () => { function Counter(props) { const [count, updateCount] = useState('(empty)'); useEffect(() => { - Scheduler.unstable_yieldValue(`Schedule update [${props.count}]`); + Scheduler.log(`Schedule update [${props.count}]`); updateCount(props.count); }, [props.count]); return ; } await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: (empty)', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -1560,7 +1558,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -1574,14 +1572,14 @@ describe('ReactHooksWithNoopRenderer', () => { function Counter(props) { const [count, updateCount] = useState('(empty)'); useEffect(() => { - Scheduler.unstable_yieldValue(`Schedule update [${props.count}]`); + Scheduler.log(`Schedule update [${props.count}]`); updateCount(props.count); }, [props.count]); return ; } await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: (empty)', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -1589,7 +1587,7 @@ describe('ReactHooksWithNoopRenderer', () => { // Rendering again should flush the previous commit's effects React.startTransition(() => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); }); @@ -1613,14 +1611,14 @@ describe('ReactHooksWithNoopRenderer', () => { const [count, updateCount] = useState(0); _updateCount = updateCount; useEffect(() => { - Scheduler.unstable_yieldValue(`Will set count to 1`); + Scheduler.log(`Will set count to 1`); updateCount(1); }, []); return ; } ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -1686,7 +1684,7 @@ describe('ReactHooksWithNoopRenderer', () => { function Counter(props) { const [count, updateCount] = useState('(empty)'); useEffect(() => { - Scheduler.unstable_yieldValue(`Schedule update [${props.count}]`); + Scheduler.log(`Schedule update [${props.count}]`); ReactNoop.flushSync(() => { updateCount(props.count); }); @@ -1701,7 +1699,7 @@ describe('ReactHooksWithNoopRenderer', () => { await expect(async () => { await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: (empty)', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput( @@ -1716,16 +1714,16 @@ describe('ReactHooksWithNoopRenderer', () => { it('unmounts previous effect', async () => { function Counter(props) { useEffect(() => { - Scheduler.unstable_yieldValue(`Did create [${props.count}]`); + Scheduler.log(`Did create [${props.count}]`); return () => { - Scheduler.unstable_yieldValue(`Did destroy [${props.count}]`); + Scheduler.log(`Did destroy [${props.count}]`); }; }); return ; } await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -1735,7 +1733,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 1', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -1747,16 +1745,16 @@ describe('ReactHooksWithNoopRenderer', () => { it('unmounts on deletion', async () => { function Counter(props) { useEffect(() => { - Scheduler.unstable_yieldValue(`Did create [${props.count}]`); + Scheduler.log(`Did create [${props.count}]`); return () => { - Scheduler.unstable_yieldValue(`Did destroy [${props.count}]`); + Scheduler.log(`Did destroy [${props.count}]`); }; }); return ; } await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -1772,16 +1770,16 @@ describe('ReactHooksWithNoopRenderer', () => { it('unmounts on deletion after skipped effect', async () => { function Counter(props) { useEffect(() => { - Scheduler.unstable_yieldValue(`Did create [${props.count}]`); + Scheduler.log(`Did create [${props.count}]`); return () => { - Scheduler.unstable_yieldValue(`Did destroy [${props.count}]`); + Scheduler.log(`Did destroy [${props.count}]`); }; }, []); return ; } await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -1791,7 +1789,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 1', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -1806,9 +1804,9 @@ describe('ReactHooksWithNoopRenderer', () => { it('always fires effects if no dependencies are provided', async () => { function effect() { - Scheduler.unstable_yieldValue(`Did create`); + Scheduler.log(`Did create`); return () => { - Scheduler.unstable_yieldValue(`Did destroy`); + Scheduler.log(`Did destroy`); }; } function Counter(props) { @@ -1817,7 +1815,7 @@ describe('ReactHooksWithNoopRenderer', () => { } await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -1827,7 +1825,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 1', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -1844,16 +1842,16 @@ describe('ReactHooksWithNoopRenderer', () => { function Counter(props) { const text = `${props.label}: ${props.count}`; useEffect(() => { - Scheduler.unstable_yieldValue(`Did create [${text}]`); + Scheduler.log(`Did create [${text}]`); return () => { - Scheduler.unstable_yieldValue(`Did destroy [${text}]`); + Scheduler.log(`Did destroy [${text}]`); }; }, [props.label, props.count]); return ; } await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 0', 'Sync effect']); }); @@ -1863,7 +1861,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); // Count changed await waitFor(['Count: 1', 'Sync effect']); @@ -1874,7 +1872,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); // Nothing changed, so no effect should have fired await waitFor(['Count: 1', 'Sync effect']); @@ -1885,7 +1883,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); // Label changed await waitFor(['Total: 1', 'Sync effect']); @@ -1898,16 +1896,16 @@ describe('ReactHooksWithNoopRenderer', () => { it('multiple effects', async () => { function Counter(props) { useEffect(() => { - Scheduler.unstable_yieldValue(`Did commit 1 [${props.count}]`); + Scheduler.log(`Did commit 1 [${props.count}]`); }); useEffect(() => { - Scheduler.unstable_yieldValue(`Did commit 2 [${props.count}]`); + Scheduler.log(`Did commit 2 [${props.count}]`); }); return ; } await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -1917,7 +1915,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 1', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -1928,22 +1926,22 @@ describe('ReactHooksWithNoopRenderer', () => { it('unmounts all previous effects before creating any new ones', async () => { function Counter(props) { useEffect(() => { - Scheduler.unstable_yieldValue(`Mount A [${props.count}]`); + Scheduler.log(`Mount A [${props.count}]`); return () => { - Scheduler.unstable_yieldValue(`Unmount A [${props.count}]`); + Scheduler.log(`Unmount A [${props.count}]`); }; }); useEffect(() => { - Scheduler.unstable_yieldValue(`Mount B [${props.count}]`); + Scheduler.log(`Mount B [${props.count}]`); return () => { - Scheduler.unstable_yieldValue(`Unmount B [${props.count}]`); + Scheduler.log(`Unmount B [${props.count}]`); }; }); return ; } await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -1953,7 +1951,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 1', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -1969,9 +1967,9 @@ describe('ReactHooksWithNoopRenderer', () => { it('unmounts all previous effects between siblings before creating any new ones', async () => { function Counter({count, label}) { useEffect(() => { - Scheduler.unstable_yieldValue(`Mount ${label} [${count}]`); + Scheduler.log(`Mount ${label} [${count}]`); return () => { - Scheduler.unstable_yieldValue(`Unmount ${label} [${count}]`); + Scheduler.log(`Unmount ${label} [${count}]`); }; }); return ; @@ -1982,7 +1980,7 @@ describe('ReactHooksWithNoopRenderer', () => { , - () => Scheduler.unstable_yieldValue('Sync effect'), + () => Scheduler.log('Sync effect'), ); await waitFor(['A 0', 'B 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput( @@ -2001,7 +1999,7 @@ describe('ReactHooksWithNoopRenderer', () => { , - () => Scheduler.unstable_yieldValue('Sync effect'), + () => Scheduler.log('Sync effect'), ); await waitFor(['A 1', 'B 1', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput( @@ -2024,7 +2022,7 @@ describe('ReactHooksWithNoopRenderer', () => { , - () => Scheduler.unstable_yieldValue('Sync effect'), + () => Scheduler.log('Sync effect'), ); await waitFor(['B 2', 'C 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput( @@ -2045,25 +2043,25 @@ describe('ReactHooksWithNoopRenderer', () => { it('handles errors in create on mount', async () => { function Counter(props) { useEffect(() => { - Scheduler.unstable_yieldValue(`Mount A [${props.count}]`); + Scheduler.log(`Mount A [${props.count}]`); return () => { - Scheduler.unstable_yieldValue(`Unmount A [${props.count}]`); + Scheduler.log(`Unmount A [${props.count}]`); }; }); useEffect(() => { - Scheduler.unstable_yieldValue('Oops!'); + Scheduler.log('Oops!'); throw new Error('Oops!'); // eslint-disable-next-line no-unreachable - Scheduler.unstable_yieldValue(`Mount B [${props.count}]`); + Scheduler.log(`Mount B [${props.count}]`); return () => { - Scheduler.unstable_yieldValue(`Unmount B [${props.count}]`); + Scheduler.log(`Unmount B [${props.count}]`); }; }); return ; } await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -2083,26 +2081,26 @@ describe('ReactHooksWithNoopRenderer', () => { it('handles errors in create on update', async () => { function Counter(props) { useEffect(() => { - Scheduler.unstable_yieldValue(`Mount A [${props.count}]`); + Scheduler.log(`Mount A [${props.count}]`); return () => { - Scheduler.unstable_yieldValue(`Unmount A [${props.count}]`); + Scheduler.log(`Unmount A [${props.count}]`); }; }); useEffect(() => { if (props.count === 1) { - Scheduler.unstable_yieldValue('Oops!'); + Scheduler.log('Oops!'); throw new Error('Oops!'); } - Scheduler.unstable_yieldValue(`Mount B [${props.count}]`); + Scheduler.log(`Mount B [${props.count}]`); return () => { - Scheduler.unstable_yieldValue(`Unmount B [${props.count}]`); + Scheduler.log(`Unmount B [${props.count}]`); }; }); return ; } await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -2113,7 +2111,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { // This update will trigger an error ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 1', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -2131,18 +2129,18 @@ describe('ReactHooksWithNoopRenderer', () => { it('handles errors in destroy on update', async () => { function Counter(props) { useEffect(() => { - Scheduler.unstable_yieldValue(`Mount A [${props.count}]`); + Scheduler.log(`Mount A [${props.count}]`); return () => { - Scheduler.unstable_yieldValue('Oops!'); + Scheduler.log('Oops!'); if (props.count === 0) { throw new Error('Oops!'); } }; }); useEffect(() => { - Scheduler.unstable_yieldValue(`Mount B [${props.count}]`); + Scheduler.log(`Mount B [${props.count}]`); return () => { - Scheduler.unstable_yieldValue(`Unmount B [${props.count}]`); + Scheduler.log(`Unmount B [${props.count}]`); }; }); return ; @@ -2150,7 +2148,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -2161,7 +2159,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { // This update will trigger an error during passive effect unmount ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 1', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -2184,21 +2182,21 @@ describe('ReactHooksWithNoopRenderer', () => { it('works with memo', async () => { function Counter({count}) { useLayoutEffect(() => { - Scheduler.unstable_yieldValue('Mount: ' + count); - return () => Scheduler.unstable_yieldValue('Unmount: ' + count); + Scheduler.log('Mount: ' + count); + return () => Scheduler.log('Unmount: ' + count); }); return ; } Counter = memo(Counter); ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 0', 'Mount: 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Count: 1', 'Unmount: 0', 'Mount: 1', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -2216,11 +2214,9 @@ describe('ReactHooksWithNoopRenderer', () => { beforeEach(() => { BrokenUseEffectCleanup = function () { useEffect(() => { - Scheduler.unstable_yieldValue('BrokenUseEffectCleanup useEffect'); + Scheduler.log('BrokenUseEffectCleanup useEffect'); return () => { - Scheduler.unstable_yieldValue( - 'BrokenUseEffectCleanup useEffect destroy', - ); + Scheduler.log('BrokenUseEffectCleanup useEffect destroy'); throw new Error('Expected error'); }; }, []); @@ -2231,32 +2227,28 @@ describe('ReactHooksWithNoopRenderer', () => { ErrorBoundary = class extends React.Component { state = {error: null}; static getDerivedStateFromError(error) { - Scheduler.unstable_yieldValue( - `ErrorBoundary static getDerivedStateFromError`, - ); + Scheduler.log(`ErrorBoundary static getDerivedStateFromError`); return {error}; } componentDidCatch(error, info) { - Scheduler.unstable_yieldValue(`ErrorBoundary componentDidCatch`); + Scheduler.log(`ErrorBoundary componentDidCatch`); } render() { if (this.state.error) { - Scheduler.unstable_yieldValue('ErrorBoundary render error'); + Scheduler.log('ErrorBoundary render error'); return ; } - Scheduler.unstable_yieldValue('ErrorBoundary render success'); + Scheduler.log('ErrorBoundary render success'); return this.props.children || null; } }; LogOnlyErrorBoundary = class extends React.Component { componentDidCatch(error, info) { - Scheduler.unstable_yieldValue( - `LogOnlyErrorBoundary componentDidCatch`, - ); + Scheduler.log(`LogOnlyErrorBoundary componentDidCatch`); } render() { - Scheduler.unstable_yieldValue(`LogOnlyErrorBoundary render`); + Scheduler.log(`LogOnlyErrorBoundary render`); return this.props.children || null; } }; @@ -2414,18 +2406,18 @@ describe('ReactHooksWithNoopRenderer', () => { const Wrapper = ({children}) => children; function Child() { React.useEffect(() => { - Scheduler.unstable_yieldValue('passive create'); + Scheduler.log('passive create'); return () => { - Scheduler.unstable_yieldValue('passive destroy'); + Scheduler.log('passive destroy'); }; }, []); React.useLayoutEffect(() => { - Scheduler.unstable_yieldValue('layout create'); + Scheduler.log('layout create'); return () => { - Scheduler.unstable_yieldValue('layout destroy'); + Scheduler.log('layout destroy'); }; }, []); - Scheduler.unstable_yieldValue('render'); + Scheduler.log('render'); return null; } @@ -2481,18 +2473,18 @@ describe('ReactHooksWithNoopRenderer', () => { function Grandchild() { React.useEffect(() => { - Scheduler.unstable_yieldValue('passive create'); + Scheduler.log('passive create'); return () => { - Scheduler.unstable_yieldValue('passive destroy'); + Scheduler.log('passive destroy'); }; }, []); React.useLayoutEffect(() => { - Scheduler.unstable_yieldValue('layout create'); + Scheduler.log('layout create'); return () => { - Scheduler.unstable_yieldValue('layout destroy'); + Scheduler.log('layout destroy'); }; }, []); - Scheduler.unstable_yieldValue('render'); + Scheduler.log('render'); return null; } @@ -2593,9 +2585,9 @@ describe('ReactHooksWithNoopRenderer', () => { it('fires insertion effects after snapshots on update', async () => { function CounterA(props) { useInsertionEffect(() => { - Scheduler.unstable_yieldValue(`Create insertion`); + Scheduler.log(`Create insertion`); return () => { - Scheduler.unstable_yieldValue(`Destroy insertion`); + Scheduler.log(`Destroy insertion`); }; }); return null; @@ -2603,7 +2595,7 @@ describe('ReactHooksWithNoopRenderer', () => { class CounterB extends React.Component { getSnapshotBeforeUpdate(prevProps, prevState) { - Scheduler.unstable_yieldValue(`Get Snapshot`); + Scheduler.log(`Get Snapshot`); return null; } @@ -2654,34 +2646,22 @@ describe('ReactHooksWithNoopRenderer', () => { function Counter(props) { useInsertionEffect(() => { - Scheduler.unstable_yieldValue( - `Create insertion [current: ${committedText}]`, - ); + Scheduler.log(`Create insertion [current: ${committedText}]`); committedText = String(props.count); return () => { - Scheduler.unstable_yieldValue( - `Destroy insertion [current: ${committedText}]`, - ); + Scheduler.log(`Destroy insertion [current: ${committedText}]`); }; }); useLayoutEffect(() => { - Scheduler.unstable_yieldValue( - `Create layout [current: ${committedText}]`, - ); + Scheduler.log(`Create layout [current: ${committedText}]`); return () => { - Scheduler.unstable_yieldValue( - `Destroy layout [current: ${committedText}]`, - ); + Scheduler.log(`Destroy layout [current: ${committedText}]`); }; }); useEffect(() => { - Scheduler.unstable_yieldValue( - `Create passive [current: ${committedText}]`, - ); + Scheduler.log(`Create passive [current: ${committedText}]`); return () => { - Scheduler.unstable_yieldValue( - `Destroy passive [current: ${committedText}]`, - ); + Scheduler.log(`Destroy passive [current: ${committedText}]`); }; }); return null; @@ -2716,35 +2696,23 @@ describe('ReactHooksWithNoopRenderer', () => { function Counter(props) { useInsertionEffect(() => { - Scheduler.unstable_yieldValue( - `Create insertion [current: ${committedText}]`, - ); + Scheduler.log(`Create insertion [current: ${committedText}]`); committedText = String(props.count); return () => { - Scheduler.unstable_yieldValue( - `Destroy insertion [current: ${committedText}]`, - ); + Scheduler.log(`Destroy insertion [current: ${committedText}]`); }; }); useLayoutEffect(() => { - Scheduler.unstable_yieldValue( - `Create layout [current: ${committedText}]`, - ); + Scheduler.log(`Create layout [current: ${committedText}]`); committedText = String(props.count); return () => { - Scheduler.unstable_yieldValue( - `Destroy layout [current: ${committedText}]`, - ); + Scheduler.log(`Destroy layout [current: ${committedText}]`); }; }); useEffect(() => { - Scheduler.unstable_yieldValue( - `Create passive [current: ${committedText}]`, - ); + Scheduler.log(`Create passive [current: ${committedText}]`); return () => { - Scheduler.unstable_yieldValue( - `Destroy passive [current: ${committedText}]`, - ); + Scheduler.log(`Destroy passive [current: ${committedText}]`); }; }); return null; @@ -2784,45 +2752,45 @@ describe('ReactHooksWithNoopRenderer', () => { function CounterA(props) { useInsertionEffect(() => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Create Insertion 1 for Component A [A: ${committedA}, B: ${committedB}]`, ); committedA = String(props.count); return () => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Destroy Insertion 1 for Component A [A: ${committedA}, B: ${committedB}]`, ); }; }); useInsertionEffect(() => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Create Insertion 2 for Component A [A: ${committedA}, B: ${committedB}]`, ); committedA = String(props.count); return () => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Destroy Insertion 2 for Component A [A: ${committedA}, B: ${committedB}]`, ); }; }); useLayoutEffect(() => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Create Layout 1 for Component A [A: ${committedA}, B: ${committedB}]`, ); return () => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Destroy Layout 1 for Component A [A: ${committedA}, B: ${committedB}]`, ); }; }); useLayoutEffect(() => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Create Layout 2 for Component A [A: ${committedA}, B: ${committedB}]`, ); return () => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Destroy Layout 2 for Component A [A: ${committedA}, B: ${committedB}]`, ); }; @@ -2832,45 +2800,45 @@ describe('ReactHooksWithNoopRenderer', () => { function CounterB(props) { useInsertionEffect(() => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Create Insertion 1 for Component B [A: ${committedA}, B: ${committedB}]`, ); committedB = String(props.count); return () => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Destroy Insertion 1 for Component B [A: ${committedA}, B: ${committedB}]`, ); }; }); useInsertionEffect(() => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Create Insertion 2 for Component B [A: ${committedA}, B: ${committedB}]`, ); committedB = String(props.count); return () => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Destroy Insertion 2 for Component B [A: ${committedA}, B: ${committedB}]`, ); }; }); useLayoutEffect(() => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Create Layout 1 for Component B [A: ${committedA}, B: ${committedB}]`, ); return () => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Destroy Layout 1 for Component B [A: ${committedA}, B: ${committedB}]`, ); }; }); useLayoutEffect(() => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Create Layout 2 for Component B [A: ${committedA}, B: ${committedB}]`, ); return () => { - Scheduler.unstable_yieldValue( + Scheduler.log( `Destroy Layout 2 for Component B [A: ${committedA}, B: ${committedB}]`, ); }; @@ -3077,9 +3045,9 @@ describe('ReactHooksWithNoopRenderer', () => { describe('useLayoutEffect', () => { it('fires layout effects after the host has been mutated', async () => { function getCommittedText() { - const yields = Scheduler.unstable_clearYields(); + const yields = Scheduler.unstable_clearLog(); const children = ReactNoop.getChildrenAsJSX(); - Scheduler.unstable_yieldValue(yields); + Scheduler.log(yields); if (children === null) { return null; } @@ -3088,19 +3056,19 @@ describe('ReactHooksWithNoopRenderer', () => { function Counter(props) { useLayoutEffect(() => { - Scheduler.unstable_yieldValue(`Current: ${getCommittedText()}`); + Scheduler.log(`Current: ${getCommittedText()}`); }); return ; } ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor([[0], 'Current: 0', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor([[1], 'Current: 1', 'Sync effect']); expect(ReactNoop).toMatchRenderedOutput(); @@ -3115,23 +3083,15 @@ describe('ReactHooksWithNoopRenderer', () => { // intentionally omits a mutation effect. committedText = String(props.count); - Scheduler.unstable_yieldValue( - `Mount layout [current: ${committedText}]`, - ); + Scheduler.log(`Mount layout [current: ${committedText}]`); return () => { - Scheduler.unstable_yieldValue( - `Unmount layout [current: ${committedText}]`, - ); + Scheduler.log(`Unmount layout [current: ${committedText}]`); }; }); useEffect(() => { - Scheduler.unstable_yieldValue( - `Mount normal [current: ${committedText}]`, - ); + Scheduler.log(`Mount normal [current: ${committedText}]`); return () => { - Scheduler.unstable_yieldValue( - `Unmount normal [current: ${committedText}]`, - ); + Scheduler.log(`Unmount normal [current: ${committedText}]`); }; }); return null; @@ -3139,12 +3099,12 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Mount layout [current: 0]', 'Sync effect']); expect(committedText).toEqual('0'); ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor([ 'Mount normal [current: 0]', @@ -3163,39 +3123,35 @@ describe('ReactHooksWithNoopRenderer', () => { class ErrorBoundary extends React.Component { state = {error: null}; static getDerivedStateFromError(error) { - Scheduler.unstable_yieldValue( - `ErrorBoundary static getDerivedStateFromError`, - ); + Scheduler.log(`ErrorBoundary static getDerivedStateFromError`); return {error}; } render() { const {children, id, fallbackID} = this.props; const {error} = this.state; if (error) { - Scheduler.unstable_yieldValue(`${id} render error`); + Scheduler.log(`${id} render error`); return ; } - Scheduler.unstable_yieldValue(`${id} render success`); + Scheduler.log(`${id} render success`); return children || null; } } function Component({id}) { - Scheduler.unstable_yieldValue('Component render ' + id); + Scheduler.log('Component render ' + id); return ; } function BrokenLayoutEffectDestroy() { useLayoutEffect(() => { return () => { - Scheduler.unstable_yieldValue( - 'BrokenLayoutEffectDestroy useLayoutEffect destroy', - ); + Scheduler.log('BrokenLayoutEffectDestroy useLayoutEffect destroy'); throw Error('Expected'); }; }, []); - Scheduler.unstable_yieldValue('BrokenLayoutEffectDestroy render'); + Scheduler.log('BrokenLayoutEffectDestroy render'); return ; } @@ -3367,7 +3323,7 @@ describe('ReactHooksWithNoopRenderer', () => { function CapitalizedText(props) { const text = props.text; const capitalizedText = useMemo(() => { - Scheduler.unstable_yieldValue(`Capitalize '${text}'`); + Scheduler.log(`Capitalize '${text}'`); return text.toUpperCase(); }, [text]); return ; @@ -3397,12 +3353,12 @@ describe('ReactHooksWithNoopRenderer', () => { } function computeA() { - Scheduler.unstable_yieldValue('compute A'); + Scheduler.log('compute A'); return 'A'; } function computeB() { - Scheduler.unstable_yieldValue('compute B'); + Scheduler.log('compute B'); return 'B'; } @@ -3433,7 +3389,7 @@ describe('ReactHooksWithNoopRenderer', () => { } function compute(val) { - Scheduler.unstable_yieldValue('compute ' + val); + Scheduler.log('compute ' + val); return val; } @@ -3812,17 +3768,17 @@ describe('ReactHooksWithNoopRenderer', () => { it('unmount effects', async () => { function App(props) { useEffect(() => { - Scheduler.unstable_yieldValue('Mount A'); + Scheduler.log('Mount A'); return () => { - Scheduler.unstable_yieldValue('Unmount A'); + Scheduler.log('Unmount A'); }; }, []); if (props.showMore) { useEffect(() => { - Scheduler.unstable_yieldValue('Mount B'); + Scheduler.log('Mount B'); return () => { - Scheduler.unstable_yieldValue('Unmount B'); + Scheduler.log('Unmount B'); }; }, []); } @@ -3832,7 +3788,7 @@ describe('ReactHooksWithNoopRenderer', () => { await act(async () => { ReactNoop.render(, () => - Scheduler.unstable_yieldValue('Sync effect'), + Scheduler.log('Sync effect'), ); await waitFor(['Sync effect']); }); @@ -3884,14 +3840,14 @@ describe('ReactHooksWithNoopRenderer', () => { // This reducer closes over a value from props. If the reducer is not // properly updated, the eager reducer will compare to an old value // and bail out incorrectly. - Scheduler.unstable_yieldValue('Reducer: ' + count); + Scheduler.log('Reducer: ' + count); return count; }, -1); useEffect(() => { - Scheduler.unstable_yieldValue('Effect: ' + count); + Scheduler.log('Effect: ' + count); dispatch(); }, [count]); - Scheduler.unstable_yieldValue('Render: ' + state); + Scheduler.log('Render: ' + state); return count; } @@ -3927,8 +3883,8 @@ describe('ReactHooksWithNoopRenderer', () => { increment = () => dispatch({type: 'increment'}); setDisabled = _setDisabled; - Scheduler.unstable_yieldValue('Render disabled: ' + disabled); - Scheduler.unstable_yieldValue('Render count: ' + count); + Scheduler.log('Render disabled: ' + disabled); + Scheduler.log('Render count: ' + count); return count; } @@ -3970,14 +3926,14 @@ describe('ReactHooksWithNoopRenderer', () => { increment = () => dispatch({type: 'increment'}); - Scheduler.unstable_yieldValue('Render count: ' + count); + Scheduler.log('Render count: ' + count); return count; } function App() { const [disabled, _setDisabled] = useState(true); setDisabled = _setDisabled; - Scheduler.unstable_yieldValue('Render disabled: ' + disabled); + Scheduler.log('Render disabled: ' + disabled); return ; } @@ -4019,14 +3975,14 @@ describe('ReactHooksWithNoopRenderer', () => { increment = () => dispatch({type: 'increment'}); - Scheduler.unstable_yieldValue('Render count: ' + count); + Scheduler.log('Render count: ' + count); return count; } function App() { const [disabled, _setDisabled] = useState(true); setDisabled = _setDisabled; - Scheduler.unstable_yieldValue('Render disabled: ' + disabled); + Scheduler.log('Render disabled: ' + disabled); return ; } @@ -4055,9 +4011,9 @@ describe('ReactHooksWithNoopRenderer', () => { function CounterA() { const [counter, setCounter] = useState(0); setCounterA = setCounter; - Scheduler.unstable_yieldValue('Render A: ' + counter); + Scheduler.log('Render A: ' + counter); useEffect(() => { - Scheduler.unstable_yieldValue('Commit A: ' + counter); + Scheduler.log('Commit A: ' + counter); }); return counter; } @@ -4065,9 +4021,9 @@ describe('ReactHooksWithNoopRenderer', () => { function CounterB() { const [counter, setCounter] = useState(0); setCounterB = setCounter; - Scheduler.unstable_yieldValue('Render B: ' + counter); + Scheduler.log('Render B: ' + counter); useEffect(() => { - Scheduler.unstable_yieldValue('Commit B: ' + counter); + Scheduler.log('Commit B: ' + counter); }); return counter; } @@ -4114,7 +4070,7 @@ describe('ReactHooksWithNoopRenderer', () => { setStep(step + 1); } - Scheduler.unstable_yieldValue(`Step: ${step}, Shadow: ${shadow}`); + Scheduler.log(`Step: ${step}, Shadow: ${shadow}`); return shadow; } @@ -4170,15 +4126,15 @@ describe('ReactHooksWithNoopRenderer', () => { function Child({label}) { useLayoutEffect(() => { - Scheduler.unstable_yieldValue('Mount layout ' + label); + Scheduler.log('Mount layout ' + label); return () => { - Scheduler.unstable_yieldValue('Unmount layout ' + label); + Scheduler.log('Unmount layout ' + label); }; }, [label]); useEffect(() => { - Scheduler.unstable_yieldValue('Mount passive ' + label); + Scheduler.log('Mount passive ' + label); return () => { - Scheduler.unstable_yieldValue('Unmount passive ' + label); + Scheduler.log('Unmount passive ' + label); }; }, [label]); return label; @@ -4222,9 +4178,9 @@ describe('ReactHooksWithNoopRenderer', () => { function Child({label}) { useEffect(() => { - Scheduler.unstable_yieldValue('Mount ' + label); + Scheduler.log('Mount ' + label); return () => { - Scheduler.unstable_yieldValue('Unmount ' + label); + Scheduler.log('Unmount ' + label); }; }, [label]); return label; @@ -4267,9 +4223,9 @@ describe('ReactHooksWithNoopRenderer', () => { it('regression: SuspenseList causes unmounts to be dropped on deletion', async () => { function Row({label}) { useEffect(() => { - Scheduler.unstable_yieldValue('Mount ' + label); + Scheduler.log('Mount ' + label); return () => { - Scheduler.unstable_yieldValue('Unmount ' + label); + Scheduler.log('Unmount ' + label); }; }, [label]); return ( @@ -4314,7 +4270,7 @@ describe('ReactHooksWithNoopRenderer', () => { const [count, setCount] = useState(0); useEffect(() => { - Scheduler.unstable_yieldValue(`Effect: ${count}`); + Scheduler.log(`Effect: ${count}`); }, [count]); if (count > 0) { diff --git a/packages/react-reconciler/src/__tests__/ReactIncremental-test.js b/packages/react-reconciler/src/__tests__/ReactIncremental-test.js index 460b751115fa2..b90572aed72df 100644 --- a/packages/react-reconciler/src/__tests__/ReactIncremental-test.js +++ b/packages/react-reconciler/src/__tests__/ReactIncremental-test.js @@ -62,7 +62,7 @@ describe('ReactIncremental', () => { it('should render a simple component, in steps if needed', async () => { function Bar() { - Scheduler.unstable_yieldValue('Bar'); + Scheduler.log('Bar'); return (
Hello World
@@ -71,14 +71,12 @@ describe('ReactIncremental', () => { } function Foo() { - Scheduler.unstable_yieldValue('Foo'); + Scheduler.log('Foo'); return [, ]; } React.startTransition(() => { - ReactNoop.render(, () => - Scheduler.unstable_yieldValue('callback'), - ); + ReactNoop.render(, () => Scheduler.log('callback')); }); // Do one step of work. expect(ReactNoop.flushNextYield()).toEqual(['Foo']); @@ -89,17 +87,17 @@ describe('ReactIncremental', () => { it('updates a previous render', async () => { function Header() { - Scheduler.unstable_yieldValue('Header'); + Scheduler.log('Header'); return

Hi

; } function Content(props) { - Scheduler.unstable_yieldValue('Content'); + Scheduler.log('Content'); return
{props.children}
; } function Footer() { - Scheduler.unstable_yieldValue('Footer'); + Scheduler.log('Footer'); return
Bye
; } @@ -107,7 +105,7 @@ describe('ReactIncremental', () => { const footer =