Convert ReactServerRenderingHydration-test to createRoot (partially) (#28010)
Convert ReactServerRenderingHydration-test to createRoot (partially) Some tests seem to be specifically testing the legacy APIs, maybe we need to keep those around. Keeping this PR to the simple updates.
Jan Kassens committed
Jan 24, 2024 at 10:38 UTC
f161ceaa743fc14ef472e9d7b3e5a0b99ed9e970
1 file changed
+15
-6
packages/react-dom/src/__tests__/ReactServerRenderingHydration-test.js
+15
-6
@@ -122,7 +122,7 @@ describe('ReactDOMServerHydration', () => {
122
// We have a polyfill for autoFocus on the client, but we intentionally don't
123
// want it to call focus() when hydrating because this can mess up existing
124
// focus before the JS has loaded.
125
- it('should emit autofocus on the server but not focus() when hydrating', () => {
125
+ it('should emit autofocus on the server but not focus() when hydrating', async () => {
126
const element = document.createElement('div');
127
element.innerHTML = ReactDOMServer.renderToString(
128
<input autoFocus={true} />,
@@ -131,15 +131,19 @@ describe('ReactDOMServerHydration', () => {
131
132
// It should not be called on mount.
133
element.firstChild.focus = jest.fn();
134
- ReactDOM.hydrate(<input autoFocus={true} />, element);
134
+ const root = await act(() =>
135
+ ReactDOMClient.hydrateRoot(element, <input autoFocus={true} />),
136
+ );
137
expect(element.firstChild.focus).not.toHaveBeenCalled();
138
139
// Or during an update.
138
- ReactDOM.render(<input autoFocus={true} />, element);
140
+ await act(() => {
141
+ root.render(<input autoFocus={true} />);
142
+ });
143
expect(element.firstChild.focus).not.toHaveBeenCalled();
144
});
145
142
- it('should not focus on either server or client with autofocus={false}', () => {
146
+ it('should not focus on either server or client with autofocus={false}', async () => {
147
const element = document.createElement('div');
148
element.innerHTML = ReactDOMServer.renderToString(
149
<input autoFocus={false} />,
@@ -147,10 +151,15 @@ describe('ReactDOMServerHydration', () => {
151
expect(element.firstChild.autofocus).toBe(false);
152
153
element.firstChild.focus = jest.fn();
150
- ReactDOM.hydrate(<input autoFocus={false} />, element);
154
+ const root = await act(() =>
155
+ ReactDOMClient.hydrateRoot(element, <input autoFocus={false} />),
156
+ );
157
+
158
expect(element.firstChild.focus).not.toHaveBeenCalled();
159
153
- ReactDOM.render(<input autoFocus={false} />, element);
160
+ await act(() => {
161
+ root.render(<input autoFocus={false} />);
162
+ });
163
expect(element.firstChild.focus).not.toHaveBeenCalled();
164
});
165