Skip to content

Commit

Permalink
[assert helpers] not dom or reconciler (#31862)
Browse files Browse the repository at this point in the history 
converts everything left outside react-dom and react-reconciler
  • Loading branch information
@rickhanlonii
rickhanlonii authored Dec 20, 2024
1 parent 6a3d6a4 commit 26297f5
Show file tree
Hide file tree
Showing 10 changed files with 195 additions and 145 deletions.
35 changes: 24 additions & 11 deletions packages/react-cache/src/__tests__/ReactCacheOld-test.internal.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ let waitForPaint;
let assertLog;
let waitForThrow;
let act;
let assertConsoleErrorDev;

describe('ReactCache', () => {
beforeEach(() => {
Expand All @@ -39,6 +40,7 @@ describe('ReactCache', () => {
assertLog = InternalTestUtils.assertLog;
waitForThrow = InternalTestUtils.waitForThrow;
waitForPaint = InternalTestUtils.waitForPaint;
assertConsoleErrorDev = InternalTestUtils.assertConsoleErrorDev;
act = InternalTestUtils.act;

TextResource = createResource(
Expand Down Expand Up @@ -190,20 +192,31 @@ describe('ReactCache', () => {
);

if (__DEV__) {
await expect(async () => {
await waitForAll([
'App',
'Loading...',

...(gate('enableSiblingPrerendering') ? ['App'] : []),
]);
}).toErrorDev([
await waitForAll([
'App',
'Loading...',

...(gate('enableSiblingPrerendering') ? ['App'] : []),
]);
assertConsoleErrorDev([
'Invalid key type. Expected a string, number, symbol, or ' +
"boolean, but instead received: [ 'Hi', 100 ]\n\n" +
'To use non-primitive values as keys, you must pass a hash ' +
'function as the second argument to createResource().',

...(gate('enableSiblingPrerendering') ? ['Invalid key type'] : []),
'function as the second argument to createResource().\n' +
' in App (at **)' +
(gate(flags => flags.enableOwnerStacks)
? ''
: '\n in Suspense (at **)'),

...(gate('enableSiblingPrerendering')
? [
'Invalid key type. Expected a string, number, symbol, or ' +
"boolean, but instead received: [ 'Hi', 100 ]\n\n" +
'To use non-primitive values as keys, you must pass a hash ' +
'function as the second argument to createResource().\n' +
' in App (at **)',
]
: []),
]);
} else {
await waitForAll([
Expand Down
13 changes: 8 additions & 5 deletions packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegration-test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ let React;
let ReactTestRenderer;
let ReactDebugTools;
let act;
let assertConsoleErrorDev;
let useMemoCache;

function normalizeSourceLoc(tree) {
Expand All @@ -33,7 +34,7 @@ describe('ReactHooksInspectionIntegration', () => {
jest.resetModules();
React = require('react');
ReactTestRenderer = require('react-test-renderer');
act = require('internal-test-utils').act;
({act, assertConsoleErrorDev} = require('internal-test-utils'));
ReactDebugTools = require('react-debug-tools');
useMemoCache = require('react/compiler-runtime').c;
});
Expand Down Expand Up @@ -2344,10 +2345,12 @@ describe('ReactHooksInspectionIntegration', () => {
</Suspense>,
);

await expect(async () => {
await act(async () => await LazyFoo);
}).toErrorDev([
'Foo: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead.',
await act(async () => await LazyFoo);
assertConsoleErrorDev([
'Foo: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead.' +
(gate(flags => flags.enableOwnerStacks)
? ''
: '\n in Foo (at **)\n' + ' in Suspense (at **)'),
]);

const childFiber = renderer.root._currentFiber();
Expand Down
14 changes: 7 additions & 7 deletions packages/react-dom/src/client/__tests__/trustedTypes-test.internal.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ describe('when Trusted Types are available in global object', () => {
let ReactDOMClient;
let ReactFeatureFlags;
let act;
let assertConsoleErrorDev;
let container;
let ttObject1;
let ttObject2;
Expand All @@ -36,7 +37,7 @@ describe('when Trusted Types are available in global object', () => {
ReactFeatureFlags.enableTrustedTypesIntegration = true;
React = require('react');
ReactDOMClient = require('react-dom/client');
act = require('internal-test-utils').act;
({act, assertConsoleErrorDev} = require('internal-test-utils'));
ttObject1 = {
toString() {
return '<b>Hi</b>';
Expand Down Expand Up @@ -208,17 +209,16 @@ describe('when Trusted Types are available in global object', () => {

it('should warn once when rendering script tag in jsx on client', async () => {
const root = ReactDOMClient.createRoot(container);
await expect(async () => {
await act(() => {
root.render(<script>alert("I am not executed")</script>);
});
}).toErrorDev(
await act(() => {
root.render(<script>alert("I am not executed")</script>);
});
assertConsoleErrorDev([
'Encountered a script tag while rendering React component. ' +
'Scripts inside React components are never executed when rendering ' +
'on the client. Consider using template tag instead ' +
'(https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template).\n' +
' in script (at **)',
);
]);

// check that the warning is printed only once
await act(() => {
Expand Down
86 changes: 44 additions & 42 deletions packages/react-native-renderer/src/__tests__/ReactFabric-test.internal.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ let ReactNativePrivateInterface;
let createReactNativeComponentClass;
let StrictMode;
let act;
let assertConsoleErrorDev;

const DISPATCH_COMMAND_REQUIRES_HOST_COMPONENT =
"dispatchCommand was called with a ref that isn't a " +
Expand All @@ -38,7 +39,7 @@ describe('ReactFabric', () => {
createReactNativeComponentClass =
require('react-native/Libraries/ReactPrivate/ReactNativePrivateInterface')
.ReactNativeViewConfigRegistry.register;
act = require('internal-test-utils').act;
({act, assertConsoleErrorDev} = require('internal-test-utils'));
});

it('should be able to create and render a native component', async () => {
Expand Down Expand Up @@ -459,9 +460,8 @@ describe('ReactFabric', () => {
});

expect(nativeFabricUIManager.dispatchCommand).not.toBeCalled();
expect(() => {
ReactFabric.dispatchCommand(viewRef, 'updateCommand', [10, 20]);
}).toErrorDev([DISPATCH_COMMAND_REQUIRES_HOST_COMPONENT], {
ReactFabric.dispatchCommand(viewRef, 'updateCommand', [10, 20]);
assertConsoleErrorDev([DISPATCH_COMMAND_REQUIRES_HOST_COMPONENT], {
withoutStack: true,
});

Expand Down Expand Up @@ -525,9 +525,8 @@ describe('ReactFabric', () => {
});

expect(nativeFabricUIManager.sendAccessibilityEvent).not.toBeCalled();
expect(() => {
ReactFabric.sendAccessibilityEvent(viewRef, 'eventTypeName');
}).toErrorDev([SEND_ACCESSIBILITY_EVENT_REQUIRES_HOST_COMPONENT], {
ReactFabric.sendAccessibilityEvent(viewRef, 'eventTypeName');
assertConsoleErrorDev([SEND_ACCESSIBILITY_EVENT_REQUIRES_HOST_COMPONENT], {
withoutStack: true,
});

Expand Down Expand Up @@ -856,24 +855,31 @@ describe('ReactFabric', () => {
uiViewClassName: 'RCTView',
}));

await expect(async () => {
await act(() => {
ReactFabric.render(<View>this should warn</View>, 11, null, true);
});
}).toErrorDev(['Text strings must be rendered within a <Text> component.']);
await act(() => {
ReactFabric.render(<View>this should warn</View>, 11, null, true);
});
assertConsoleErrorDev([
'Text strings must be rendered within a <Text> component.\n' +
' in RCTView (at **)',
]);

await expect(async () => {
await act(() => {
ReactFabric.render(
<Text>
<ScrollView>hi hello hi</ScrollView>
</Text>,
11,
null,
true,
);
});
}).toErrorDev(['Text strings must be rendered within a <Text> component.']);
await act(() => {
ReactFabric.render(
<Text>
<ScrollView>hi hello hi</ScrollView>
</Text>,
11,
null,
true,
);
});
assertConsoleErrorDev([
'Text strings must be rendered within a <Text> component.\n' +
' in RCTScrollView (at **)' +
(gate(flags => !flags.enableOwnerStacks)
? '\n in RCTText (at **)'
: ''),
]);
});

it('should not throw for text inside of an indirect <Text> ancestor', async () => {
Expand Down Expand Up @@ -1166,10 +1172,8 @@ describe('ReactFabric', () => {
);
});

let match;
expect(
() => (match = ReactFabric.findHostInstance_DEPRECATED(parent)),
).toErrorDev([
const match = ReactFabric.findHostInstance_DEPRECATED(parent);
assertConsoleErrorDev([
'findHostInstance_DEPRECATED is deprecated in StrictMode. ' +
'findHostInstance_DEPRECATED was passed an instance of ContainsStrictModeChild which renders StrictMode children. ' +
'Instead, add a ref directly to the element you want to reference. ' +
Expand Down Expand Up @@ -1207,10 +1211,8 @@ describe('ReactFabric', () => {
);
});

let match;
expect(
() => (match = ReactFabric.findHostInstance_DEPRECATED(parent)),
).toErrorDev([
const match = ReactFabric.findHostInstance_DEPRECATED(parent);
assertConsoleErrorDev([
'findHostInstance_DEPRECATED is deprecated in StrictMode. ' +
'findHostInstance_DEPRECATED was passed an instance of IsInStrictMode which is inside StrictMode. ' +
'Instead, add a ref directly to the element you want to reference. ' +
Expand Down Expand Up @@ -1250,8 +1252,8 @@ describe('ReactFabric', () => {
);
});

let match;
expect(() => (match = ReactFabric.findNodeHandle(parent))).toErrorDev([
const match = ReactFabric.findNodeHandle(parent);
assertConsoleErrorDev([
'findNodeHandle is deprecated in StrictMode. ' +
'findNodeHandle was passed an instance of ContainsStrictModeChild which renders StrictMode children. ' +
'Instead, add a ref directly to the element you want to reference. ' +
Expand Down Expand Up @@ -1291,8 +1293,8 @@ describe('ReactFabric', () => {
);
});

let match;
expect(() => (match = ReactFabric.findNodeHandle(parent))).toErrorDev([
const match = ReactFabric.findNodeHandle(parent);
assertConsoleErrorDev([
'findNodeHandle is deprecated in StrictMode. ' +
'findNodeHandle was passed an instance of IsInStrictMode which is inside StrictMode. ' +
'Instead, add a ref directly to the element you want to reference. ' +
Expand All @@ -1313,16 +1315,16 @@ describe('ReactFabric', () => {
return null;
}
}
await expect(async () => {
await act(() => {
ReactFabric.render(<TestComponent />, 11, null, true);
});
}).toErrorDev([
await act(() => {
ReactFabric.render(<TestComponent />, 11, null, true);
});
assertConsoleErrorDev([
'TestComponent is accessing findNodeHandle inside its render(). ' +
'render() should be a pure function of props and state. It should ' +
'never access something that requires stale data from the previous ' +
'render, such as refs. Move this logic to componentDidMount and ' +
'componentDidUpdate instead.',
'componentDidUpdate instead.\n' +
' in TestComponent (at **)',
]);
});

Expand Down
50 changes: 27 additions & 23 deletions packages/react-native-renderer/src/__tests__/ReactNativeEvents-test.internal.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ let ReactNative;
let ResponderEventPlugin;
let UIManager;
let createReactNativeComponentClass;
let assertConsoleErrorDev;

// Parallels requireNativeComponent() in that it lazily constructs a view config,
// And registers view manager event types with ReactNativeViewConfigRegistry.
Expand Down Expand Up @@ -69,6 +70,7 @@ beforeEach(() => {
require('react-native/Libraries/ReactPrivate/ReactNativePrivateInterface').RCTEventEmitter;
React = require('react');
act = require('internal-test-utils').act;
assertConsoleErrorDev = require('internal-test-utils').assertConsoleErrorDev;
ReactNative = require('react-native-renderer');
ResponderEventPlugin =
require('react-native-renderer/src/legacy-events/ResponderEventPlugin').default;
Expand Down Expand Up @@ -227,30 +229,32 @@ test('handles events on text nodes', () => {
}

const log = [];
expect(() => {
ReactNative.render(
<ContextHack>
<Text>
<Text
onTouchEnd={() => log.push('string touchend')}
onTouchEndCapture={() => log.push('string touchend capture')}
onTouchStart={() => log.push('string touchstart')}
onTouchStartCapture={() => log.push('string touchstart capture')}>
Text Content
</Text>
<Text
onTouchEnd={() => log.push('number touchend')}
onTouchEndCapture={() => log.push('number touchend capture')}
onTouchStart={() => log.push('number touchstart')}
onTouchStartCapture={() => log.push('number touchstart capture')}>
{123}
</Text>
ReactNative.render(
<ContextHack>
<Text>
<Text
onTouchEnd={() => log.push('string touchend')}
onTouchEndCapture={() => log.push('string touchend capture')}
onTouchStart={() => log.push('string touchstart')}
onTouchStartCapture={() => log.push('string touchstart capture')}>
Text Content
</Text>
</ContextHack>,
1,
);
}).toErrorDev([
'ContextHack uses the legacy childContextTypes API which will soon be removed. Use React.createContext() instead.',
<Text
onTouchEnd={() => log.push('number touchend')}
onTouchEndCapture={() => log.push('number touchend capture')}
onTouchStart={() => log.push('number touchstart')}
onTouchStartCapture={() => log.push('number touchstart capture')}>
{123}
</Text>
</Text>
</ContextHack>,
1,
);
assertConsoleErrorDev([
'ContextHack uses the legacy childContextTypes API which will soon be removed. ' +
'Use React.createContext() instead. ' +
'(https://react.dev/link/legacy-context)' +
'\n in ContextHack (at **)',
]);

expect(UIManager.createView).toHaveBeenCalledTimes(5);
Expand Down
Loading

0 comments on commit 26297f5

Please sign in to comment.