Convert ReactErrorLoggingRecovery to createRoot (#28003)
Sebastian Silbermann committed
Jan 19, 2024 at 18:07 UTC
601dba82175edd321c833395514081fe3aa6f445
1 file changed
+18
-24
packages/react-dom/src/__tests__/ReactErrorLoggingRecovery-test.js
+18
-24
@@ -17,7 +17,8 @@ if (global.window) {
17
18
// The issue only reproduced when React was loaded before JSDOM.
19
const React = require('react');
20
-const ReactDOM = require('react-dom');
20
+const ReactDOMClient = require('react-dom/client');
21
+const act = require('internal-test-utils').act;
22
23
// Initialize JSDOM separately.
24
// We don't use our normal JSDOM setup because we want to load React first.
@@ -43,13 +44,6 @@ describe('ReactErrorLoggingRecovery', () => {
44
45
beforeEach(() => {
46
console.error = error => {
46
- if (
47
- typeof error === 'string' &&
48
- error.includes('ReactDOM.render is no longer supported in React 18')
49
- ) {
50
- // Ignore legacy root deprecation warning
51
- return;
52
- }
47
throw new Error('Buggy console.error');
48
};
49
});
@@ -58,23 +52,23 @@ describe('ReactErrorLoggingRecovery', () => {
52
console.error = originalConsoleError;
53
});
54
61
- it('should recover from errors in console.error', function () {
55
+ it('should recover from errors in console.error', async function () {
56
const div = document.createElement('div');
63
- let didCatch = false;
64
- try {
65
- ReactDOM.render(<Bad />, div);
66
- ReactDOM.render(<Bad />, div);
67
- } catch (e) {
68
- expect(e.message).toBe('no');
69
- didCatch = true;
70
- }
71
- expect(didCatch).toBe(true);
72
- ReactDOM.render(<span>Hello</span>, div);
73
- expect(div.firstChild.textContent).toBe('Hello');
57
+ const root = ReactDOMClient.createRoot(div);
58
+ await expect(async () => {
59
+ await act(() => {
60
+ root.render(<Bad />);
61
+ });
62
+ await act(() => {
63
+ root.render(<Bad />);
64
+ });
65
+ }).rejects.toThrow('no');
66
75
- // Verify the console.error bug is surfaced
76
- expect(() => {
77
- jest.runAllTimers();
78
- }).toThrow('Buggy console.error');
67
+ await expect(async () => {
68
+ await act(() => {
69
+ root.render(<span>Hello</span>);
70
+ });
71
+ }).rejects.toThrow('Buggy console.error');
72
+ expect(div.firstChild.textContent).toBe('Hello');
73
});
74
});