From f497a1e26262f1b7e2cc7b47e9df5247368ff403 Mon Sep 17 00:00:00 2001 From: Sebastian Markbage Date: Mon, 20 May 2024 23:46:06 -0400 Subject: [PATCH] Fix tests --- .../src/__tests__/ReactFlight-test.js | 16 +++++----- .../__tests__/ReactChildReconciler-test.js | 8 +++-- .../src/__tests__/ReactComponent-test.js | 8 +++-- .../react-dom/src/__tests__/ReactDOM-test.js | 4 +-- .../src/__tests__/ReactMultiChild-test.js | 8 +++-- .../src/__tests__/ReactUpdates-test.js | 13 ++++++-- .../src/__tests__/ReactHooks-test.internal.js | 2 ++ .../ReactIncrementalErrorLogging-test.js | 30 +++++++++++-------- .../src/__tests__/ReactLazy-test.internal.js | 21 ++++++++----- .../src/__tests__/ReactMemo-test.js | 4 +-- .../src/__tests__/ReactCreateRef-test.js | 12 +++++--- .../ReactElementValidator-test.internal.js | 9 ++---- .../ReactJSXElementValidator-test.js | 2 -- .../src/__tests__/ReactJSXRuntime-test.js | 7 ++--- .../createReactClassIntegration-test.js | 2 ++ 15 files changed, 89 insertions(+), 57 deletions(-) diff --git a/packages/react-client/src/__tests__/ReactFlight-test.js b/packages/react-client/src/__tests__/ReactFlight-test.js index b7a73eb2ab57e..bc660a207f075 100644 --- a/packages/react-client/src/__tests__/ReactFlight-test.js +++ b/packages/react-client/src/__tests__/ReactFlight-test.js @@ -1123,10 +1123,11 @@ describe('ReactFlight', () => { } function App() { - return ( - - - + // We use the ReactServer runtime here to get the Server owner. + return ReactServer.createElement( + Indirection, + null, + ReactServer.createElement(ClientComponent), ); } @@ -1143,11 +1144,10 @@ describe('ReactFlight', () => { '\n' + 'Check the render method of `Component`. See https://react.dev/link/warning-keys for more information.\n' + ' in span (at **)\n' + - // TODO: Because this validates after the div has been mounted, it is part of - // the parent stack but since owner stacks will switch to owners this goes away again. - (gate(flags => flags.enableOwnerStacks) ? ' in div (at **)\n' : '') + ' in Component (at **)\n' + - ' in Indirection (at **)\n' + + (gate(flags => flags.enableOwnerStacks) + ? '' + : ' in Indirection (at **)\n') + ' in App (at **)', ); }); diff --git a/packages/react-dom/src/__tests__/ReactChildReconciler-test.js b/packages/react-dom/src/__tests__/ReactChildReconciler-test.js index ef584a7856921..425f4abd13346 100644 --- a/packages/react-dom/src/__tests__/ReactChildReconciler-test.js +++ b/packages/react-dom/src/__tests__/ReactChildReconciler-test.js @@ -130,7 +130,9 @@ describe('ReactChildReconciler', () => { 'could change in a future version.\n' + ' in div (at **)\n' + ' in Component (at **)\n' + - ' in Parent (at **)\n' + + (gate(flags => flags.enableOwnerStacks) + ? '' + : ' in Parent (at **)\n') + ' in GrandParent (at **)', ); }); @@ -189,7 +191,9 @@ describe('ReactChildReconciler', () => { 'could change in a future version.\n' + ' in div (at **)\n' + ' in Component (at **)\n' + - ' in Parent (at **)\n' + + (gate(flags => flags.enableOwnerStacks) + ? '' + : ' in Parent (at **)\n') + ' in GrandParent (at **)', ); }); diff --git a/packages/react-dom/src/__tests__/ReactComponent-test.js b/packages/react-dom/src/__tests__/ReactComponent-test.js index 61538fed69492..1951f4ba73400 100644 --- a/packages/react-dom/src/__tests__/ReactComponent-test.js +++ b/packages/react-dom/src/__tests__/ReactComponent-test.js @@ -761,7 +761,9 @@ describe('ReactComponent', () => { 'Or maybe you meant to call this function rather than return it.\n' + ' {Foo}\n' + ' in span (at **)\n' + - ' in div (at **)\n' + + (gate(flags => flags.enableOwnerStacks) + ? '' + : ' in div (at **)\n') + ' in Foo (at **)', ); }); @@ -820,7 +822,9 @@ describe('ReactComponent', () => { 'Or maybe you meant to call this function rather than return it.\n' + ' {Foo}\n' + ' in span (at **)\n' + - ' in div (at **)\n' + + (gate(flags => flags.enableOwnerStacks) + ? '' + : ' in div (at **)\n') + ' in Foo (at **)', ]); await act(() => { diff --git a/packages/react-dom/src/__tests__/ReactDOM-test.js b/packages/react-dom/src/__tests__/ReactDOM-test.js index 72fa57fb1fd5e..697b65dd60753 100644 --- a/packages/react-dom/src/__tests__/ReactDOM-test.js +++ b/packages/react-dom/src/__tests__/ReactDOM-test.js @@ -552,7 +552,7 @@ describe('ReactDOM', () => { // ReactDOM(App > div > span) 'Invalid ARIA attribute `ariaTypo`. ARIA attributes follow the pattern aria-* and must be lowercase.\n' + ' in span (at **)\n' + - ' in div (at **)\n' + + (gate(flags => flags.enableOwnerStacks) ? '' : ' in div (at **)\n') + ' in App (at **)', // ReactDOM(App > div > ServerEntry) >>> ReactDOMServer(Child) >>> ReactDOMServer(App2) >>> ReactDOMServer(blink) 'Invalid ARIA attribute `ariaTypo2`. ARIA attributes follow the pattern aria-* and must be lowercase.\n' + @@ -569,7 +569,7 @@ describe('ReactDOM', () => { // ReactDOM(App > div > font) 'Invalid ARIA attribute `ariaTypo5`. ARIA attributes follow the pattern aria-* and must be lowercase.\n' + ' in font (at **)\n' + - ' in div (at **)\n' + + (gate(flags => flags.enableOwnerStacks) ? '' : ' in div (at **)\n') + ' in App (at **)', ]); }); diff --git a/packages/react-dom/src/__tests__/ReactMultiChild-test.js b/packages/react-dom/src/__tests__/ReactMultiChild-test.js index 44d71fe7fc805..1ffc793f96023 100644 --- a/packages/react-dom/src/__tests__/ReactMultiChild-test.js +++ b/packages/react-dom/src/__tests__/ReactMultiChild-test.js @@ -229,7 +229,9 @@ describe('ReactMultiChild', () => { 'could change in a future version.\n' + ' in div (at **)\n' + ' in WrapperComponent (at **)\n' + - ' in div (at **)\n' + + (gate(flags => flags.enableOwnerStacks) + ? '' + : ' in div (at **)\n') + ' in Parent (at **)', ); }); @@ -292,7 +294,9 @@ describe('ReactMultiChild', () => { 'could change in a future version.\n' + ' in div (at **)\n' + ' in WrapperComponent (at **)\n' + - ' in div (at **)\n' + + (gate(flags => flags.enableOwnerStacks) + ? '' + : ' in div (at **)\n') + ' in Parent (at **)', ); }); diff --git a/packages/react-dom/src/__tests__/ReactUpdates-test.js b/packages/react-dom/src/__tests__/ReactUpdates-test.js index 9a10a8d061b5f..1c40e72a78535 100644 --- a/packages/react-dom/src/__tests__/ReactUpdates-test.js +++ b/packages/react-dom/src/__tests__/ReactUpdates-test.js @@ -1848,7 +1848,7 @@ describe('ReactUpdates', () => { it('warns about a deferred infinite update loop with useEffect', async () => { function NonTerminating() { const [step, setStep] = React.useState(0); - React.useEffect(() => { + React.useEffect(function myEffect() { setStep(x => x + 1); }); return step; @@ -1860,10 +1860,12 @@ describe('ReactUpdates', () => { let error = null; let stack = null; + let nativeStack = null; const originalConsoleError = console.error; console.error = (e, s) => { error = e; stack = s; + nativeStack = new Error().stack; Scheduler.log('stop'); }; try { @@ -1876,7 +1878,14 @@ describe('ReactUpdates', () => { } expect(error).toContain('Maximum update depth exceeded'); - expect(stack).toContain('at NonTerminating'); + // The currently executing effect should be on the native stack + expect(nativeStack).toContain('at myEffect'); + if (!gate(flags => flags.enableOwnerStacks)) { + // The currently running component's name is not in the owner + // stack because it's just its JSX callsite. + expect(stack).toContain('at NonTerminating'); + } + expect(stack).toContain('at App'); }); it('can have nested updates if they do not cross the limit', async () => { diff --git a/packages/react-reconciler/src/__tests__/ReactHooks-test.internal.js b/packages/react-reconciler/src/__tests__/ReactHooks-test.internal.js index 476838776f329..8cc5c15a9e081 100644 --- a/packages/react-reconciler/src/__tests__/ReactHooks-test.internal.js +++ b/packages/react-reconciler/src/__tests__/ReactHooks-test.internal.js @@ -716,6 +716,7 @@ describe('ReactHooks', () => { useImperativeHandle(ref, () => {}, props.deps); return null; }); + App.displayName = 'App'; await expect(async () => { await act(() => { @@ -846,6 +847,7 @@ describe('ReactHooks', () => { }); return null; }); + App.displayName = 'App'; await expect(async () => { await act(() => { diff --git a/packages/react-reconciler/src/__tests__/ReactIncrementalErrorLogging-test.js b/packages/react-reconciler/src/__tests__/ReactIncrementalErrorLogging-test.js index 3bd934af38da6..8333445c69784 100644 --- a/packages/react-reconciler/src/__tests__/ReactIncrementalErrorLogging-test.js +++ b/packages/react-reconciler/src/__tests__/ReactIncrementalErrorLogging-test.js @@ -93,9 +93,11 @@ describe('ReactIncrementalErrorLogging', () => { ), expect.stringMatching( new RegExp( - '\\s+(in|at) ErrorThrowingComponent (.*)\n' + - '\\s+(in|at) span(.*)\n' + - '\\s+(in|at) div(.*)', + gate(flags => flags.enableOwnerStacks) + ? '\\s+(in|at) ErrorThrowingComponent' + : '\\s+(in|at) ErrorThrowingComponent (.*)\n' + + '\\s+(in|at) span(.*)\n' + + '\\s+(in|at) div(.*)', ), ), ); @@ -139,9 +141,11 @@ describe('ReactIncrementalErrorLogging', () => { ), expect.stringMatching( new RegExp( - '\\s+(in|at) ErrorThrowingComponent (.*)\n' + - '\\s+(in|at) span(.*)\n' + - '\\s+(in|at) div(.*)', + gate(flags => flags.enableOwnerStacks) + ? '\\s+(in|at) ErrorThrowingComponent' + : '\\s+(in|at) ErrorThrowingComponent (.*)\n' + + '\\s+(in|at) span(.*)\n' + + '\\s+(in|at) div(.*)', ), ), ); @@ -197,10 +201,12 @@ describe('ReactIncrementalErrorLogging', () => { ), expect.stringMatching( new RegExp( - '\\s+(in|at) ErrorThrowingComponent (.*)\n' + - '\\s+(in|at) span(.*)\n' + - '\\s+(in|at) ErrorBoundary(.*)\n' + - '\\s+(in|at) div(.*)', + gate(flags => flags.enableOwnerStacks) + ? '\\s+(in|at) ErrorThrowingComponent' + : '\\s+(in|at) ErrorThrowingComponent (.*)\n' + + '\\s+(in|at) span(.*)\n' + + '\\s+(in|at) ErrorBoundary(.*)\n' + + '\\s+(in|at) div(.*)', ), ), ); @@ -278,9 +284,7 @@ describe('ReactIncrementalErrorLogging', () => { ), expect.stringMatching( gate(flag => flag.enableOwnerStacks) - ? // With owner stacks the return path is cut off but in this case - // this is also what the owner stack looks like. - new RegExp('\\s+(in|at) Foo (.*)') + ? new RegExp('\\s+(in|at) Foo') : new RegExp( '\\s+(in|at) Foo (.*)\n' + '\\s+(in|at) ErrorBoundary(.*)', ), diff --git a/packages/react-reconciler/src/__tests__/ReactLazy-test.internal.js b/packages/react-reconciler/src/__tests__/ReactLazy-test.internal.js index b2874a99520f8..3ec58b2f705a7 100644 --- a/packages/react-reconciler/src/__tests__/ReactLazy-test.internal.js +++ b/packages/react-reconciler/src/__tests__/ReactLazy-test.internal.js @@ -228,10 +228,18 @@ describe('ReactLazy', () => { expect(error.message).toMatch('Element type is invalid'); assertLog(['Loading...']); - assertConsoleErrorDev([ - 'Expected the result of a dynamic import() call', - 'Expected the result of a dynamic import() call', - ]); + assertConsoleErrorDev( + [ + 'Expected the result of a dynamic import() call', + 'Expected the result of a dynamic import() call', + ], + gate(flags => flags.enableOwnerStacks) + ? { + // There's no owner + withoutStack: true, + } + : undefined, + ); expect(root).not.toMatchRenderedOutput('Hi'); }); @@ -996,10 +1004,7 @@ describe('ReactLazy', () => { await act(() => resolveFakeImport(Foo)); assertLog(['A', 'B']); }).toErrorDev( - ' in Text (at **)\n' + - // TODO: Because this validates after the div has been mounted, it is part of - // the parent stack but since owner stacks will switch to owners this goes away again. - (gate(flags => flags.enableOwnerStacks) ? ' in div (at **)\n' : '') + + (gate(flags => flags.enableOwnerStacks) ? '' : ' in Text (at **)\n') + ' in Foo (at **)', ); expect(root).toMatchRenderedOutput(
AB
); diff --git a/packages/react-reconciler/src/__tests__/ReactMemo-test.js b/packages/react-reconciler/src/__tests__/ReactMemo-test.js index 1399bf359197f..db2d2e2aebdcc 100644 --- a/packages/react-reconciler/src/__tests__/ReactMemo-test.js +++ b/packages/react-reconciler/src/__tests__/ReactMemo-test.js @@ -622,8 +622,8 @@ describe('memo', () => { '\n\nCheck the top-level render call using . It was passed a child from Inner. ' + 'See https://react.dev/link/warning-keys for more information.\n' + ' in span (at **)\n' + - ' in Inner (at **)\n' + - ' in p (at **)', + ' in Inner (at **)' + + (gate(flags => flags.enableOwnerStacks) ? '' : '\n in p (at **)'), ); }); diff --git a/packages/react/src/__tests__/ReactCreateRef-test.js b/packages/react/src/__tests__/ReactCreateRef-test.js index 34dc5aa3aa682..616c62e00c88f 100644 --- a/packages/react/src/__tests__/ReactCreateRef-test.js +++ b/packages/react/src/__tests__/ReactCreateRef-test.js @@ -45,8 +45,10 @@ describe('ReactCreateRef', () => { ).toErrorDev( 'Unexpected ref object provided for div. ' + 'Use either a ref-setter function or React.createRef().\n' + - ' in div (at **)\n' + - ' in Wrapper (at **)', + ' in div (at **)' + + (gate(flags => flags.enableOwnerStacks) + ? '' + : '\n in Wrapper (at **)'), ); expect(() => @@ -60,8 +62,10 @@ describe('ReactCreateRef', () => { ).toErrorDev( 'Unexpected ref object provided for ExampleComponent. ' + 'Use either a ref-setter function or React.createRef().\n' + - ' in ExampleComponent (at **)\n' + - ' in Wrapper (at **)', + ' in ExampleComponent (at **)' + + (gate(flags => flags.enableOwnerStacks) + ? '' + : '\n in Wrapper (at **)'), ); }); }); diff --git a/packages/react/src/__tests__/ReactElementValidator-test.internal.js b/packages/react/src/__tests__/ReactElementValidator-test.internal.js index 6d133fc8d9b9c..7cac9d7c83900 100644 --- a/packages/react/src/__tests__/ReactElementValidator-test.internal.js +++ b/packages/react/src/__tests__/ReactElementValidator-test.internal.js @@ -142,11 +142,10 @@ describe('ReactElementValidator', () => { '"key" prop.\n\nCheck the render method of `Component`. See ' + 'https://react.dev/link/warning-keys for more information.\n' + ' in div (at **)\n' + - // TODO: Because this validates after the div has been mounted, it is part of - // the parent stack but since owner stacks will switch to owners this goes away again. - (gate(flags => flags.enableOwnerStacks) ? ' in div (at **)\n' : '') + ' in Component (at **)\n' + - ' in Parent (at **)\n' + + (gate(flags => flags.enableOwnerStacks) + ? '' + : ' in Parent (at **)\n') + ' in GrandParent (at **)', ); }); @@ -262,8 +261,6 @@ describe('ReactElementValidator', () => { 'Each child in a list should have a unique "key" prop.' + '\n\nCheck the render method of `ParentComp`. It was passed a child from MyComp. ' + 'See https://react.dev/link/warning-keys for more information.\n' + - // TODO: Because this validates after the div has been mounted, it is part of - // the parent stack but since owner stacks will switch to owners this goes away again. ' in div (at **)\n' + ' in MyComp (at **)\n' + ' in ParentComp (at **)', diff --git a/packages/react/src/__tests__/ReactJSXElementValidator-test.js b/packages/react/src/__tests__/ReactJSXElementValidator-test.js index bbafbc74011a5..7ac4ead790f60 100644 --- a/packages/react/src/__tests__/ReactJSXElementValidator-test.js +++ b/packages/react/src/__tests__/ReactJSXElementValidator-test.js @@ -209,8 +209,6 @@ describe('ReactJSXElementValidator', () => { 'Each child in a list should have a unique "key" prop.' + '\n\nCheck the render method of `ParentComp`. It was passed a child from MyComp. ' + 'See https://react.dev/link/warning-keys for more information.\n' + - // TODO: Because this validates after the div has been mounted, it is part of - // the parent stack but since owner stacks will switch to owners this goes away again. ' in div (at **)\n' + ' in MyComp (at **)\n' + ' in ParentComp (at **)', diff --git a/packages/react/src/__tests__/ReactJSXRuntime-test.js b/packages/react/src/__tests__/ReactJSXRuntime-test.js index ae26e133fb17a..6e6c111589e37 100644 --- a/packages/react/src/__tests__/ReactJSXRuntime-test.js +++ b/packages/react/src/__tests__/ReactJSXRuntime-test.js @@ -299,10 +299,9 @@ describe('ReactJSXRuntime', () => { }).toErrorDev( 'Warning: Each child in a list should have a unique "key" prop.\n\n' + 'Check the render method of `Parent`. See https://react.dev/link/warning-keys for more information.\n' + - ' in Child (at **)\n' + - // TODO: Because this validates after the div has been mounted, it is part of - // the parent stack but since owner stacks will switch to owners this goes away again. - (gate(flags => flags.enableOwnerStacks) ? ' in div (at **)\n' : '') + + (gate(flags => flags.enableOwnerStacks) + ? '' + : ' in Child (at **)\n') + ' in Parent (at **)', ); }); diff --git a/packages/react/src/__tests__/createReactClassIntegration-test.js b/packages/react/src/__tests__/createReactClassIntegration-test.js index 0b65b14257814..cfdc7174c7ba9 100644 --- a/packages/react/src/__tests__/createReactClassIntegration-test.js +++ b/packages/react/src/__tests__/createReactClassIntegration-test.js @@ -594,6 +594,7 @@ describe('create-react-class-integration', () => { return null; }, }); + Component.displayName = 'Component'; await expect(async () => { await expect(async () => { @@ -643,6 +644,7 @@ describe('create-react-class-integration', () => { return null; }, }); + Component.displayName = 'Component'; await expect(async () => { await expect(async () => {