@samitouri / QOS-React / commits / 26297f5383

[assert helpers] not dom or reconciler (#31862)

converts everything left outside react-dom and react-reconciler

Ricky committed Dec 20, 2024 at 12:41 UTC 26297f5383f7e7150d9aa2cf12e8326c96991cab
10 files changed +195 -145
packages/react-cache/src/__tests__/ReactCacheOld-test.internal.js
+24 -11
@@ -22,6 +22,7 @@ let waitForPaint;
22 let assertLog;
23 let waitForThrow;
24 let act;
25 +let assertConsoleErrorDev;
26
27 describe('ReactCache', () => {
28 beforeEach(() => {
@@ -39,6 +40,7 @@ describe('ReactCache', () => {
40 assertLog = InternalTestUtils.assertLog;
41 waitForThrow = InternalTestUtils.waitForThrow;
42 waitForPaint = InternalTestUtils.waitForPaint;
43 + assertConsoleErrorDev = InternalTestUtils.assertConsoleErrorDev;
44 act = InternalTestUtils.act;
45
46 TextResource = createResource(
@@ -190,20 +192,31 @@ describe('ReactCache', () => {
192 );
193
194 if (__DEV__) {
193 - await expect(async () => {
194 - await waitForAll([
195 - 'App',
196 - 'Loading...',
197 -
198 - ...(gate('enableSiblingPrerendering') ? ['App'] : []),
199 - ]);
200 - }).toErrorDev([
195 + await waitForAll([
196 + 'App',
197 + 'Loading...',
198 +
199 + ...(gate('enableSiblingPrerendering') ? ['App'] : []),
200 + ]);
201 + assertConsoleErrorDev([
202 'Invalid key type. Expected a string, number, symbol, or ' +
203 "boolean, but instead received: [ 'Hi', 100 ]\n\n" +
204 'To use non-primitive values as keys, you must pass a hash ' +
204 - 'function as the second argument to createResource().',
205 -
206 - ...(gate('enableSiblingPrerendering') ? ['Invalid key type'] : []),
205 + 'function as the second argument to createResource().\n' +
206 + ' in App (at **)' +
207 + (gate(flags => flags.enableOwnerStacks)
208 + ? ''
209 + : '\n in Suspense (at **)'),
210 +
211 + ...(gate('enableSiblingPrerendering')
212 + ? [
213 + 'Invalid key type. Expected a string, number, symbol, or ' +
214 + "boolean, but instead received: [ 'Hi', 100 ]\n\n" +
215 + 'To use non-primitive values as keys, you must pass a hash ' +
216 + 'function as the second argument to createResource().\n' +
217 + ' in App (at **)',
218 + ]
219 + : []),
220 ]);
221 } else {
222 await waitForAll([
packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegration-test.js
+8 -5
@@ -14,6 +14,7 @@ let React;
14 let ReactTestRenderer;
15 let ReactDebugTools;
16 let act;
17 +let assertConsoleErrorDev;
18 let useMemoCache;
19
20 function normalizeSourceLoc(tree) {
@@ -33,7 +34,7 @@ describe('ReactHooksInspectionIntegration', () => {
34 jest.resetModules();
35 React = require('react');
36 ReactTestRenderer = require('react-test-renderer');
36 - act = require('internal-test-utils').act;
37 + ({act, assertConsoleErrorDev} = require('internal-test-utils'));
38 ReactDebugTools = require('react-debug-tools');
39 useMemoCache = require('react/compiler-runtime').c;
40 });
@@ -2344,10 +2345,12 @@ describe('ReactHooksInspectionIntegration', () => {
2345 </Suspense>,
2346 );
2347
2347 - await expect(async () => {
2348 - await act(async () => await LazyFoo);
2349 - }).toErrorDev([
2350 - 'Foo: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead.',
2348 + await act(async () => await LazyFoo);
2349 + assertConsoleErrorDev([
2350 + 'Foo: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead.' +
2351 + (gate(flags => flags.enableOwnerStacks)
2352 + ? ''
2353 + : '\n in Foo (at **)\n' + ' in Suspense (at **)'),
2354 ]);
2355
2356 const childFiber = renderer.root._currentFiber();
packages/react-dom/src/client/__tests__/trustedTypes-test.internal.js
+7 -7
@@ -14,6 +14,7 @@ describe('when Trusted Types are available in global object', () => {
14 let ReactDOMClient;
15 let ReactFeatureFlags;
16 let act;
17 + let assertConsoleErrorDev;
18 let container;
19 let ttObject1;
20 let ttObject2;
@@ -36,7 +37,7 @@ describe('when Trusted Types are available in global object', () => {
37 ReactFeatureFlags.enableTrustedTypesIntegration = true;
38 React = require('react');
39 ReactDOMClient = require('react-dom/client');
39 - act = require('internal-test-utils').act;
40 + ({act, assertConsoleErrorDev} = require('internal-test-utils'));
41 ttObject1 = {
42 toString() {
43 return '<b>Hi</b>';
@@ -208,17 +209,16 @@ describe('when Trusted Types are available in global object', () => {
209
210 it('should warn once when rendering script tag in jsx on client', async () => {
211 const root = ReactDOMClient.createRoot(container);
211 - await expect(async () => {
212 - await act(() => {
213 - root.render(<script>alert("I am not executed")</script>);
214 - });
215 - }).toErrorDev(
212 + await act(() => {
213 + root.render(<script>alert("I am not executed")</script>);
214 + });
215 + assertConsoleErrorDev([
216 'Encountered a script tag while rendering React component. ' +
217 'Scripts inside React components are never executed when rendering ' +
218 'on the client. Consider using template tag instead ' +
219 '(https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template).\n' +
220 ' in script (at **)',
221 - );
221 + ]);
222
223 // check that the warning is printed only once
224 await act(() => {
packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js
+44 -42
@@ -16,6 +16,7 @@ let ReactNativePrivateInterface;
16 let createReactNativeComponentClass;
17 let StrictMode;
18 let act;
19 +let assertConsoleErrorDev;
20
21 const DISPATCH_COMMAND_REQUIRES_HOST_COMPONENT =
22 "dispatchCommand was called with a ref that isn't a " +
@@ -38,7 +39,7 @@ describe('ReactFabric', () => {
39 createReactNativeComponentClass =
40 require('react-native/Libraries/ReactPrivate/ReactNativePrivateInterface')
41 .ReactNativeViewConfigRegistry.register;
41 - act = require('internal-test-utils').act;
42 + ({act, assertConsoleErrorDev} = require('internal-test-utils'));
43 });
44
45 it('should be able to create and render a native component', async () => {
@@ -459,9 +460,8 @@ describe('ReactFabric', () => {
460 });
461
462 expect(nativeFabricUIManager.dispatchCommand).not.toBeCalled();
462 - expect(() => {
463 - ReactFabric.dispatchCommand(viewRef, 'updateCommand', [10, 20]);
464 - }).toErrorDev([DISPATCH_COMMAND_REQUIRES_HOST_COMPONENT], {
463 + ReactFabric.dispatchCommand(viewRef, 'updateCommand', [10, 20]);
464 + assertConsoleErrorDev([DISPATCH_COMMAND_REQUIRES_HOST_COMPONENT], {
465 withoutStack: true,
466 });
467
@@ -525,9 +525,8 @@ describe('ReactFabric', () => {
525 });
526
527 expect(nativeFabricUIManager.sendAccessibilityEvent).not.toBeCalled();
528 - expect(() => {
529 - ReactFabric.sendAccessibilityEvent(viewRef, 'eventTypeName');
530 - }).toErrorDev([SEND_ACCESSIBILITY_EVENT_REQUIRES_HOST_COMPONENT], {
528 + ReactFabric.sendAccessibilityEvent(viewRef, 'eventTypeName');
529 + assertConsoleErrorDev([SEND_ACCESSIBILITY_EVENT_REQUIRES_HOST_COMPONENT], {
530 withoutStack: true,
531 });
532
@@ -856,24 +855,31 @@ describe('ReactFabric', () => {
855 uiViewClassName: 'RCTView',
856 }));
857
859 - await expect(async () => {
860 - await act(() => {
861 - ReactFabric.render(<View>this should warn</View>, 11, null, true);
862 - });
863 - }).toErrorDev(['Text strings must be rendered within a <Text> component.']);
858 + await act(() => {
859 + ReactFabric.render(<View>this should warn</View>, 11, null, true);
860 + });
861 + assertConsoleErrorDev([
862 + 'Text strings must be rendered within a <Text> component.\n' +
863 + ' in RCTView (at **)',
864 + ]);
865
865 - await expect(async () => {
866 - await act(() => {
867 - ReactFabric.render(
868 - <Text>
869 - <ScrollView>hi hello hi</ScrollView>
870 - </Text>,
871 - 11,
872 - null,
873 - true,
874 - );
875 - });
876 - }).toErrorDev(['Text strings must be rendered within a <Text> component.']);
866 + await act(() => {
867 + ReactFabric.render(
868 + <Text>
869 + <ScrollView>hi hello hi</ScrollView>
870 + </Text>,
871 + 11,
872 + null,
873 + true,
874 + );
875 + });
876 + assertConsoleErrorDev([
877 + 'Text strings must be rendered within a <Text> component.\n' +
878 + ' in RCTScrollView (at **)' +
879 + (gate(flags => !flags.enableOwnerStacks)
880 + ? '\n in RCTText (at **)'
881 + : ''),
882 + ]);
883 });
884
885 it('should not throw for text inside of an indirect <Text> ancestor', async () => {
@@ -1166,10 +1172,8 @@ describe('ReactFabric', () => {
1172 );
1173 });
1174
1169 - let match;
1170 - expect(
1171 - () => (match = ReactFabric.findHostInstance_DEPRECATED(parent)),
1172 - ).toErrorDev([
1175 + const match = ReactFabric.findHostInstance_DEPRECATED(parent);
1176 + assertConsoleErrorDev([
1177 'findHostInstance_DEPRECATED is deprecated in StrictMode. ' +
1178 'findHostInstance_DEPRECATED was passed an instance of ContainsStrictModeChild which renders StrictMode children. ' +
1179 'Instead, add a ref directly to the element you want to reference. ' +
@@ -1207,10 +1211,8 @@ describe('ReactFabric', () => {
1211 );
1212 });
1213
1210 - let match;
1211 - expect(
1212 - () => (match = ReactFabric.findHostInstance_DEPRECATED(parent)),
1213 - ).toErrorDev([
1214 + const match = ReactFabric.findHostInstance_DEPRECATED(parent);
1215 + assertConsoleErrorDev([
1216 'findHostInstance_DEPRECATED is deprecated in StrictMode. ' +
1217 'findHostInstance_DEPRECATED was passed an instance of IsInStrictMode which is inside StrictMode. ' +
1218 'Instead, add a ref directly to the element you want to reference. ' +
@@ -1250,8 +1252,8 @@ describe('ReactFabric', () => {
1252 );
1253 });
1254
1253 - let match;
1254 - expect(() => (match = ReactFabric.findNodeHandle(parent))).toErrorDev([
1255 + const match = ReactFabric.findNodeHandle(parent);
1256 + assertConsoleErrorDev([
1257 'findNodeHandle is deprecated in StrictMode. ' +
1258 'findNodeHandle was passed an instance of ContainsStrictModeChild which renders StrictMode children. ' +
1259 'Instead, add a ref directly to the element you want to reference. ' +
@@ -1291,8 +1293,8 @@ describe('ReactFabric', () => {
1293 );
1294 });
1295
1294 - let match;
1295 - expect(() => (match = ReactFabric.findNodeHandle(parent))).toErrorDev([
1296 + const match = ReactFabric.findNodeHandle(parent);
1297 + assertConsoleErrorDev([
1298 'findNodeHandle is deprecated in StrictMode. ' +
1299 'findNodeHandle was passed an instance of IsInStrictMode which is inside StrictMode. ' +
1300 'Instead, add a ref directly to the element you want to reference. ' +
@@ -1313,16 +1315,16 @@ describe('ReactFabric', () => {
1315 return null;
1316 }
1317 }
1316 - await expect(async () => {
1317 - await act(() => {
1318 - ReactFabric.render(<TestComponent />, 11, null, true);
1319 - });
1320 - }).toErrorDev([
1318 + await act(() => {
1319 + ReactFabric.render(<TestComponent />, 11, null, true);
1320 + });
1321 + assertConsoleErrorDev([
1322 'TestComponent is accessing findNodeHandle inside its render(). ' +
1323 'render() should be a pure function of props and state. It should ' +
1324 'never access something that requires stale data from the previous ' +
1325 'render, such as refs. Move this logic to componentDidMount and ' +
1325 - 'componentDidUpdate instead.',
1326 + 'componentDidUpdate instead.\n' +
1327 + ' in TestComponent (at **)',
1328 ]);
1329 });
1330
packages/react-native-renderer/src/__tests__/ReactNativeEvents-test.internal.js
+27 -23
@@ -18,6 +18,7 @@ let ReactNative;
18 let ResponderEventPlugin;
19 let UIManager;
20 let createReactNativeComponentClass;
21 +let assertConsoleErrorDev;
22
23 // Parallels requireNativeComponent() in that it lazily constructs a view config,
24 // And registers view manager event types with ReactNativeViewConfigRegistry.
@@ -69,6 +70,7 @@ beforeEach(() => {
70 require('react-native/Libraries/ReactPrivate/ReactNativePrivateInterface').RCTEventEmitter;
71 React = require('react');
72 act = require('internal-test-utils').act;
73 + assertConsoleErrorDev = require('internal-test-utils').assertConsoleErrorDev;
74 ReactNative = require('react-native-renderer');
75 ResponderEventPlugin =
76 require('react-native-renderer/src/legacy-events/ResponderEventPlugin').default;
@@ -227,30 +229,32 @@ test('handles events on text nodes', () => {
229 }
230
231 const log = [];
230 - expect(() => {
231 - ReactNative.render(
232 - <ContextHack>
233 - <Text>
234 - <Text
235 - onTouchEnd={() => log.push('string touchend')}
236 - onTouchEndCapture={() => log.push('string touchend capture')}
237 - onTouchStart={() => log.push('string touchstart')}
238 - onTouchStartCapture={() => log.push('string touchstart capture')}>
239 - Text Content
240 - </Text>
241 - <Text
242 - onTouchEnd={() => log.push('number touchend')}
243 - onTouchEndCapture={() => log.push('number touchend capture')}
244 - onTouchStart={() => log.push('number touchstart')}
245 - onTouchStartCapture={() => log.push('number touchstart capture')}>
246 - {123}
247 - </Text>
232 + ReactNative.render(
233 + <ContextHack>
234 + <Text>
235 + <Text
236 + onTouchEnd={() => log.push('string touchend')}
237 + onTouchEndCapture={() => log.push('string touchend capture')}
238 + onTouchStart={() => log.push('string touchstart')}
239 + onTouchStartCapture={() => log.push('string touchstart capture')}>
240 + Text Content
241 </Text>
249 - </ContextHack>,
250 - 1,
251 - );
252 - }).toErrorDev([
253 - 'ContextHack uses the legacy childContextTypes API which will soon be removed. Use React.createContext() instead.',
242 + <Text
243 + onTouchEnd={() => log.push('number touchend')}
244 + onTouchEndCapture={() => log.push('number touchend capture')}
245 + onTouchStart={() => log.push('number touchstart')}
246 + onTouchStartCapture={() => log.push('number touchstart capture')}>
247 + {123}
248 + </Text>
249 + </Text>
250 + </ContextHack>,
251 + 1,
252 + );
253 + assertConsoleErrorDev([
254 + 'ContextHack uses the legacy childContextTypes API which will soon be removed. ' +
255 + 'Use React.createContext() instead. ' +
256 + '(https://react.dev/link/legacy-context)' +
257 + '\n in ContextHack (at **)',
258 ]);
259
260 expect(UIManager.createView).toHaveBeenCalledTimes(5);
packages/react-native-renderer/src/__tests__/ReactNativeMount-test.internal.js
+14 -19
@@ -18,6 +18,7 @@ let UIManager;
18 let TextInputState;
19 let ReactNativePrivateInterface;
20 let act;
21 +let assertConsoleErrorDev;
22
23 const DISPATCH_COMMAND_REQUIRES_HOST_COMPONENT =
24 "dispatchCommand was called with a ref that isn't a " +
@@ -32,7 +33,7 @@ describe('ReactNative', () => {
33 jest.resetModules();
34
35 React = require('react');
35 - act = require('internal-test-utils').act;
36 + ({act, assertConsoleErrorDev} = require('internal-test-utils'));
37 StrictMode = React.StrictMode;
38 ReactNative = require('react-native-renderer');
39 ReactNativePrivateInterface = require('react-native/Libraries/ReactPrivate/ReactNativePrivateInterface');
@@ -158,9 +159,8 @@ describe('ReactNative', () => {
159 );
160
161 expect(UIManager.dispatchViewManagerCommand).not.toBeCalled();
161 - expect(() => {
162 - ReactNative.dispatchCommand(viewRef, 'updateCommand', [10, 20]);
163 - }).toErrorDev([DISPATCH_COMMAND_REQUIRES_HOST_COMPONENT], {
162 + ReactNative.dispatchCommand(viewRef, 'updateCommand', [10, 20]);
163 + assertConsoleErrorDev([DISPATCH_COMMAND_REQUIRES_HOST_COMPONENT], {
164 withoutStack: true,
165 });
166
@@ -219,9 +219,8 @@ describe('ReactNative', () => {
219 );
220
221 expect(UIManager.sendAccessibilityEvent).not.toBeCalled();
222 - expect(() => {
223 - ReactNative.sendAccessibilityEvent(viewRef, 'updateCommand', [10, 20]);
224 - }).toErrorDev([SEND_ACCESSIBILITY_EVENT_REQUIRES_HOST_COMPONENT], {
222 + ReactNative.sendAccessibilityEvent(viewRef, 'updateCommand', [10, 20]);
223 + assertConsoleErrorDev([SEND_ACCESSIBILITY_EVENT_REQUIRES_HOST_COMPONENT], {
224 withoutStack: true,
225 });
226
@@ -614,10 +613,8 @@ describe('ReactNative', () => {
613
614 ReactNative.render(<ContainsStrictModeChild ref={n => (parent = n)} />, 11);
615
617 - let match;
618 - expect(
619 - () => (match = ReactNative.findHostInstance_DEPRECATED(parent)),
620 - ).toErrorDev([
616 + const match = ReactNative.findHostInstance_DEPRECATED(parent);
617 + assertConsoleErrorDev([
618 'findHostInstance_DEPRECATED is deprecated in StrictMode. ' +
619 'findHostInstance_DEPRECATED was passed an instance of ContainsStrictModeChild which renders StrictMode children. ' +
620 'Instead, add a ref directly to the element you want to reference. ' +
@@ -652,10 +649,8 @@ describe('ReactNative', () => {
649 11,
650 );
651
655 - let match;
656 - expect(
657 - () => (match = ReactNative.findHostInstance_DEPRECATED(parent)),
658 - ).toErrorDev([
652 + const match = ReactNative.findHostInstance_DEPRECATED(parent);
653 + assertConsoleErrorDev([
654 'findHostInstance_DEPRECATED is deprecated in StrictMode. ' +
655 'findHostInstance_DEPRECATED was passed an instance of IsInStrictMode which is inside StrictMode. ' +
656 'Instead, add a ref directly to the element you want to reference. ' +
@@ -689,8 +684,8 @@ describe('ReactNative', () => {
684
685 ReactNative.render(<ContainsStrictModeChild ref={n => (parent = n)} />, 11);
686
692 - let match;
693 - expect(() => (match = ReactNative.findNodeHandle(parent))).toErrorDev([
687 + const match = ReactNative.findNodeHandle(parent);
688 + assertConsoleErrorDev([
689 'findNodeHandle is deprecated in StrictMode. ' +
690 'findNodeHandle was passed an instance of ContainsStrictModeChild which renders StrictMode children. ' +
691 'Instead, add a ref directly to the element you want to reference. ' +
@@ -725,8 +720,8 @@ describe('ReactNative', () => {
720 11,
721 );
722
728 - let match;
729 - expect(() => (match = ReactNative.findNodeHandle(parent))).toErrorDev([
723 + const match = ReactNative.findNodeHandle(parent);
724 + assertConsoleErrorDev([
725 'findNodeHandle is deprecated in StrictMode. ' +
726 'findNodeHandle was passed an instance of IsInStrictMode which is inside StrictMode. ' +
727 'Instead, add a ref directly to the element you want to reference. ' +
packages/react-server-dom-webpack/src/__tests__/ReactFlightDOMBrowser-test.js
+33 -19
@@ -38,6 +38,7 @@ let ReactServerDOM;
38 let Scheduler;
39 let ReactServerScheduler;
40 let reactServerAct;
41 +let assertConsoleErrorDev;
42
43 describe('ReactFlightDOMBrowser', () => {
44 beforeEach(() => {
@@ -75,7 +76,7 @@ describe('ReactFlightDOMBrowser', () => {
76 Scheduler = require('scheduler');
77 patchMessageChannel(Scheduler);
78
78 - act = require('internal-test-utils').act;
79 + ({act, assertConsoleErrorDev} = require('internal-test-utils'));
80 React = require('react');
81 ReactDOM = require('react-dom');
82 ReactDOMClient = require('react-dom/client');
@@ -1156,25 +1157,38 @@ describe('ReactFlightDOMBrowser', () => {
1157 const container = document.createElement('div');
1158 const root = ReactDOMClient.createRoot(container);
1159
1159 - await expect(async () => {
1160 - const stream = await serverAct(() =>
1161 - ReactServerDOMServer.renderToReadableStream(
1162 - <>
1163 - <Parent>{Array(6).fill(<div>no key</div>)}</Parent>
1164 - <ParentModule.Parent>
1165 - {Array(6).fill(<div>no key</div>)}
1166 - </ParentModule.Parent>
1167 - </>,
1168 - webpackMap,
1169 - ),
1170 - );
1171 - const result =
1172 - await ReactServerDOMClient.createFromReadableStream(stream);
1160 + const stream = await serverAct(() =>
1161 + ReactServerDOMServer.renderToReadableStream(
1162 + <>
1163 + <Parent>{Array(6).fill(<div>no key</div>)}</Parent>
1164 + <ParentModule.Parent>
1165 + {Array(6).fill(<div>no key</div>)}
1166 + </ParentModule.Parent>
1167 + </>,
1168 + webpackMap,
1169 + ),
1170 + );
1171 + const result = await ReactServerDOMClient.createFromReadableStream(stream);
1172
1174 - await act(() => {
1175 - root.render(result);
1176 - });
1177 - }).toErrorDev('Each child in a list should have a unique "key" prop.');
1173 + if (!gate(flags => flags.enableOwnerStacks)) {
1174 + assertConsoleErrorDev([
1175 + 'Each child in a list should have a unique "key" prop. ' +
1176 + 'See https://react.dev/link/warning-keys for more information.\n' +
1177 + ' in div (at **)',
1178 + ]);
1179 + }
1180 +
1181 + await act(() => {
1182 + root.render(result);
1183 + });
1184 + if (gate(flags => flags.enableOwnerStacks)) {
1185 + assertConsoleErrorDev([
1186 + 'Each child in a list should have a unique "key" prop.\n\n' +
1187 + 'Check the top-level render call using <ParentClient>. ' +
1188 + 'See https://react.dev/link/warning-keys for more information.\n' +
1189 + ' in div (at **)',
1190 + ]);
1191 + }
1192 });
1193
1194 it('basic use(promise)', async () => {
packages/react-server-dom-webpack/src/__tests__/ReactFlightDOMEdge-test.js
+13 -8
@@ -37,6 +37,7 @@ let ReactServerDOMStaticServer;
37 let ReactServerDOMClient;
38 let use;
39 let reactServerAct;
40 +let assertConsoleErrorDev;
41
42 function normalizeCodeLocInfo(str) {
43 return (
@@ -66,6 +67,8 @@ describe('ReactFlightDOMEdge', () => {
67 jest.resetModules();
68
69 reactServerAct = require('internal-test-utils').serverAct;
70 + assertConsoleErrorDev =
71 + require('internal-test-utils').assertConsoleErrorDev;
72
73 // Simulate the condition resolution
74 jest.mock('react', () => require('react/react.react-server'));
@@ -802,17 +805,19 @@ describe('ReactFlightDOMEdge', () => {
805 ),
806 };
807
805 - expect(() => {
806 - ServerModule.greet.bind({}, 'hi');
807 - }).toErrorDev(
808 - 'Cannot bind "this" of a Server Action. Pass null or undefined as the first argument to .bind().',
808 + ServerModule.greet.bind({}, 'hi');
809 + assertConsoleErrorDev(
810 + [
811 + 'Cannot bind "this" of a Server Action. Pass null or undefined as the first argument to .bind().',
812 + ],
813 {withoutStack: true},
814 );
815
812 - expect(() => {
813 - ServerModuleImportedOnClient.greet.bind({}, 'hi');
814 - }).toErrorDev(
815 - 'Cannot bind "this" of a Server Action. Pass null or undefined as the first argument to .bind().',
816 + ServerModuleImportedOnClient.greet.bind({}, 'hi');
817 + assertConsoleErrorDev(
818 + [
819 + 'Cannot bind "this" of a Server Action. Pass null or undefined as the first argument to .bind().',
820 + ],
821 {withoutStack: true},
822 );
823 });
packages/react-server-dom-webpack/src/__tests__/ReactFlightDOMForm-test.js
+9 -4
@@ -50,6 +50,7 @@ let ReactServerDOMClient;
50 let ReactDOMClient;
51 let useActionState;
52 let act;
53 +let assertConsoleErrorDev;
54
55 describe('ReactFlightDOMForm', () => {
56 beforeEach(() => {
@@ -72,6 +73,8 @@ describe('ReactFlightDOMForm', () => {
73 ReactDOMServer = require('react-dom/server.edge');
74 ReactDOMClient = require('react-dom/client');
75 act = React.act;
76 + assertConsoleErrorDev =
77 + require('internal-test-utils').assertConsoleErrorDev;
78
79 // TODO: Test the old api but it warns so needs warnings to be asserted.
80 // if (__VARIANT__) {
@@ -959,12 +962,13 @@ describe('ReactFlightDOMForm', () => {
962 await readIntoContainer(postbackSsrStream);
963 }
964
962 - await expect(submitTheForm).toErrorDev(
965 + await submitTheForm();
966 + assertConsoleErrorDev([
967 'Failed to serialize an action for progressive enhancement:\n' +
968 'Error: React Element cannot be passed to Server Functions from the Client without a temporary reference set. Pass a TemporaryReferenceSet to the options.\n' +
969 ' [<div/>]\n' +
970 ' ^^^^^^',
967 - );
971 + ]);
972
973 // The error message was returned as JSX.
974 const form2 = container.getElementsByTagName('form')[0];
@@ -1035,10 +1039,11 @@ describe('ReactFlightDOMForm', () => {
1039 await readIntoContainer(postbackSsrStream);
1040 }
1041
1038 - await expect(submitTheForm).toErrorDev(
1042 + await submitTheForm();
1043 + assertConsoleErrorDev([
1044 'Failed to serialize an action for progressive enhancement:\n' +
1045 'Error: File/Blob fields are not yet supported in progressive forms. Will fallback to client hydration.',
1041 - );
1046 + ]);
1047
1048 expect(blob instanceof Blob).toBe(true);
1049 expect(blob.size).toBe(2);
packages/react-test-renderer/src/__tests__/ReactTestRenderer-test.js
+16 -7
@@ -14,6 +14,7 @@ let React;
14 let ReactCache;
15 let ReactTestRenderer;
16 let act;
17 +let assertConsoleErrorDev;
18
19 describe('ReactTestRenderer', () => {
20 beforeEach(() => {
@@ -27,19 +28,27 @@ describe('ReactTestRenderer', () => {
28 ReactTestRenderer = require('react-test-renderer');
29 const InternalTestUtils = require('internal-test-utils');
30 act = InternalTestUtils.act;
31 + assertConsoleErrorDev = InternalTestUtils.assertConsoleErrorDev;
32 });
33
34 it('should warn if used to render a ReactDOM portal', async () => {
35 const container = document.createElement('div');
36 let error;
37
36 - await expect(async () => {
37 - await act(() => {
38 - ReactTestRenderer.create(ReactDOM.createPortal('foo', container));
39 - }).catch(e => (error = e));
40 - }).toErrorDev('An invalid container has been provided.', {
41 - withoutStack: true,
42 - });
38 + await act(() => {
39 + ReactTestRenderer.create(ReactDOM.createPortal('foo', container));
40 + }).catch(e => (error = e));
41 + assertConsoleErrorDev(
42 + [
43 + 'An invalid container has been provided. ' +
44 + 'This may indicate that another renderer is being used in addition to the test renderer. ' +
45 + '(For example, ReactDOM.createPortal inside of a ReactTestRenderer tree.) ' +
46 + 'This is not supported.',
47 + ],
48 + {
49 + withoutStack: true,
50 + },
51 + );
52
53 // After the update throws, a subsequent render is scheduled to
54 // unmount the whole tree. This update also causes an error, so React