Codemod tests to waitFor pattern (3/?) (#26299)

This converts some of our test suite to use the `waitFor` test pattern, instead of the `expect(Scheduler).toFlushAndYield` pattern. Most of these changes are automated with jscodeshift, with some slight manual cleanup in certain cases. See #26285 for full context.

Author: acdlite

packages/react-dom/src/__tests__/ReactDOMImageLoad-test.internal.js

@@ -24,6 +24,10 @@ let images = [];
 let onLoadSpy = null;
 let actualLoadSpy = null;
 
+let waitForAll;
+let waitFor;
+let assertLog;
+
 function PhaseMarkers({children}) {
  Scheduler.unstable_yieldValue('render start');
  React.useLayoutEffect(() => {
@@ -94,6 +98,11 @@ describe('ReactDOMImageLoad', () => {
  ReactDOMClient = require('react-dom/client');
  // Suspense = React.Suspense;
 
+ const InternalTestUtils = require('internal-test-utils');
+ waitForAll = InternalTestUtils.waitForAll;
+ waitFor = InternalTestUtils.waitFor;
+ assertLog = InternalTestUtils.assertLog;
+
  onLoadSpy = jest.fn(reactEvent => {
  const src = reactEvent.target.getAttribute('src');
  Scheduler.unstable_yieldValue('onLoadSpy [' + src + ']');
@@ -206,26 +215,17 @@ describe('ReactDOMImageLoad', () => {
  ),
  );
 
- expect(Scheduler).toFlushAndYieldThrough([
- 'render start',
- 'Img default',
- 'Yield',
- ]);
+ await waitFor(['render start', 'Img default', 'Yield']);
  const img = last(images);
  loadImage(img);
- expect(Scheduler).toHaveYielded([
+ assertLog([
  'actualLoadSpy [default]',
  // no onLoadSpy since we have not completed render
  ]);
- expect(Scheduler).toFlushAndYield([
- 'a',
- 'load triggered',
- 'last layout',
- 'last passive',
- ]);
+ await waitForAll(['a', 'load triggered', 'last layout', 'last passive']);
  expect(img.__needsDispatch).toBe(true);
  loadImage(img);
- expect(Scheduler).toHaveYielded([
+ assertLog([
  'actualLoadSpy [default]', // the browser reloading of the image causes this to yield again
  'onLoadSpy [default]',
  ]);
@@ -244,7 +244,7 @@ describe('ReactDOMImageLoad', () => {
  ),
  );
 
- expect(Scheduler).toFlushAndYieldThrough([
+ await waitFor([
  'render start',
  'Img default',
  'load triggered',
@@ -253,11 +253,8 @@ describe('ReactDOMImageLoad', () => {
  Scheduler.unstable_requestPaint();
  const img = last(images);
  loadImage(img);
- expect(Scheduler).toHaveYielded([
- 'actualLoadSpy [default]',
- 'onLoadSpy [default]',
- ]);
- expect(Scheduler).toFlushAndYield(['last passive']);
+ assertLog(['actualLoadSpy [default]', 'onLoadSpy [default]']);
+ await waitForAll(['last passive']);
  expect(img.__needsDispatch).toBe(false);
  expect(onLoadSpy).toHaveBeenCalledTimes(1);
  });
@@ -286,16 +283,12 @@ describe('ReactDOMImageLoad', () => {
 
  React.startTransition(() => root.render(<Base />));
 
- expect(Scheduler).toFlushAndYieldThrough([
- 'render start',
- 'Img a',
- 'Yield',
- ]);
+ await waitFor(['render start', 'Img a', 'Yield']);
  const img = last(images);
  loadImage(img);
- expect(Scheduler).toHaveYielded(['actualLoadSpy [a]']);
+ assertLog(['actualLoadSpy [a]']);
 
- expect(Scheduler).toFlushAndYieldThrough([
+ await waitFor([
  'load triggered',
  'last layout',
  // the update in layout causes a passive effects flush before a sync render
@@ -309,7 +302,7 @@ describe('ReactDOMImageLoad', () => {
  ]);
  expect(images.length).toBe(1);
  loadImage(img);
- expect(Scheduler).toHaveYielded(['actualLoadSpy [b]', 'onLoadSpy [b]']);
+ assertLog(['actualLoadSpy [b]', 'onLoadSpy [b]']);
  expect(onLoadSpy).toHaveBeenCalledTimes(1);
  });
 
@@ -323,7 +316,7 @@ describe('ReactDOMImageLoad', () => {
  </PhaseMarkers>,
  );
 
- expect(Scheduler).toFlushAndYield([
+ await waitForAll([
  'render start',
  'Img default',
  'load triggered',
@@ -332,10 +325,7 @@ describe('ReactDOMImageLoad', () => {
  ]);
  const img = last(images);
  loadImage(img);
- expect(Scheduler).toHaveYielded([
- 'actualLoadSpy [default]',
- 'onLoadSpy [default]',
- ]);
+ assertLog(['actualLoadSpy [default]', 'onLoadSpy [default]']);
  expect(onLoadSpy).toHaveBeenCalledTimes(1);
  });
 
@@ -365,26 +355,17 @@ describe('ReactDOMImageLoad', () => {
  ),
  );
 
- expect(Scheduler).toFlushAndYieldThrough([
- 'render start',
- 'Img default',
- 'Yield',
- ]);
+ await waitFor(['render start', 'Img default', 'Yield']);
  const img = last(images);
  loadImage(img);
- expect(Scheduler).toHaveYielded(['actualLoadSpy [default]']);
- expect(Scheduler).toFlushAndYield([
- 'a',
- 'load triggered',
- 'last layout',
- 'last passive',
- ]);
+ assertLog(['actualLoadSpy [default]']);
+ await waitForAll(['a', 'load triggered', 'last layout', 'last passive']);
  expect(img.__needsDispatch).toBe(true);
  loadImage(img);
  // we expect the browser to load the image again but since we are no longer rendering
  // the img there will be no onLoad called
- expect(Scheduler).toHaveYielded(['actualLoadSpy [default]']);
- expect(Scheduler).toFlushWithoutYielding();
+ assertLog(['actualLoadSpy [default]']);
+ await waitForAll([]);
  expect(onLoadSpy).not.toHaveBeenCalled();
  });
 
@@ -426,16 +407,16 @@ describe('ReactDOMImageLoad', () => {
  ),
  );
 
- expect(Scheduler).toFlushAndYieldThrough([
+ await waitFor([
  // initial render
  'render start',
  'Img default',
  'Yield',
  ]);
  const img = last(images);
  loadImage(img);
- expect(Scheduler).toHaveYielded(['actualLoadSpy [default]']);
- expect(Scheduler).toFlushAndYield([
+ assertLog(['actualLoadSpy [default]']);
+ await waitForAll([
  'a',
  'load triggered',
  // img is present at first
@@ -450,8 +431,8 @@ describe('ReactDOMImageLoad', () => {
  loadImage(img);
  // we expect the browser to load the image again but since we are no longer rendering
  // the img there will be no onLoad called
- expect(Scheduler).toHaveYielded(['actualLoadSpy [default]']);
- expect(Scheduler).toFlushWithoutYielding();
+ assertLog(['actualLoadSpy [default]']);
+ await waitForAll([]);
  expect(onLoadSpy).not.toHaveBeenCalled();
  });
 
@@ -548,22 +529,18 @@ describe('ReactDOMImageLoad', () => {
 
  root.render(<Base />);
 
- expect(Scheduler).toFlushWithoutYielding();
+ await waitForAll([]);
 
  React.startTransition(() => externalSetSrc('a'));
 
- expect(Scheduler).toFlushAndYieldThrough([
- 'YieldingWithImage',
- 'Img a',
- 'Yield',
- ]);
+ await waitFor(['YieldingWithImage', 'Img a', 'Yield']);
  let img = last(images);
  loadImage(img);
- expect(Scheduler).toHaveYielded(['actualLoadSpy [a]']);
+ assertLog(['actualLoadSpy [a]']);
 
  ReactDOM.flushSync(() => externalSetSrcAlt('b'));
 
- expect(Scheduler).toHaveYielded([
+ assertLog([
  'YieldingWithImage',
  'Img b',
  'Yield',
@@ -576,18 +553,12 @@ describe('ReactDOMImageLoad', () => {
  expect(img.__needsDispatch).toBe(true);
  loadImage(img);
 
- expect(Scheduler).toHaveYielded(['actualLoadSpy [b]', 'onLoadSpy [b]']);
+ assertLog(['actualLoadSpy [b]', 'onLoadSpy [b]']);
  // why is there another update here?
- expect(Scheduler).toFlushAndYield([
- 'YieldingWithImage',
- 'Img b',
- 'Yield',
- 'b',
- 'Committed',
- ]);
+ await waitForAll(['YieldingWithImage', 'Img b', 'Yield', 'b', 'Committed']);
  });
 
- it('preserves the src property / attribute when triggering a potential new load event', () => {
+ it('preserves the src property / attribute when triggering a potential new load event', async () => {
  // this test covers a regression identified in https://github.com/mui/material-ui/pull/31263
  // where the resetting of the src property caused the property to change from relative to fully qualified
 
@@ -612,17 +583,13 @@ describe('ReactDOMImageLoad', () => {
  );
 
  // render to yield to capture state of img src attribute and property before commit
- expect(Scheduler).toFlushAndYieldThrough([
- 'render start',
- 'Img default',
- 'Yield',
- ]);
+ await waitFor(['render start', 'Img default', 'Yield']);
  const img = last(images);
  const renderSrcProperty = img.src;
  const renderSrcAttr = img.getAttribute('src');
 
  // finish render and commit causing the src property to be rewritten
- expect(Scheduler).toFlushAndYield(['a', 'last layout', 'last passive']);
+ await waitForAll(['a', 'last layout', 'last passive']);
  const commitSrcProperty = img.src;
  const commitSrcAttr = img.getAttribute('src');
 

packages/react-dom/src/__tests__/ReactDOMNativeEventHeuristic-test.js

@@ -15,6 +15,8 @@ let ReactDOM;
 let ReactDOMClient;
 let Scheduler;
 let act;
+let assertLog;
+let waitFor;
 
 describe('ReactDOMNativeEventHeuristic-test', () => {
  let container;
@@ -28,6 +30,10 @@ describe('ReactDOMNativeEventHeuristic-test', () => {
  Scheduler = require('scheduler');
  act = require('jest-react').act;
 
+ const InternalTestUtils = require('internal-test-utils');
+ assertLog = InternalTestUtils.assertLog;
+ waitFor = InternalTestUtils.waitFor;
+
  document.body.appendChild(container);
  });
 
@@ -301,10 +307,10 @@ describe('ReactDOMNativeEventHeuristic-test', () => {
  dispatchAndSetCurrentEvent(target.current, mouseEnterEvent);
 
  // Since mouse end is not discrete, should not have updated yet
- expect(Scheduler).toHaveYielded(['not hovered']);
+ assertLog(['not hovered']);
  expect(container.textContent).toEqual('not hovered');
 
- expect(Scheduler).toFlushAndYieldThrough(['hovered']);
+ await waitFor(['hovered']);
  expect(container.textContent).toEqual('hovered');
  });
  expect(container.textContent).toEqual('hovered');
@@ -381,7 +387,7 @@ describe('ReactDOMNativeEventHeuristic-test', () => {
  pressEvent.initEvent('click', true, true);
  dispatchAndSetCurrentEvent(target, pressEvent);
 
- expect(Scheduler).toHaveYielded(['Count: 0 [after batchedUpdates]']);
+ assertLog(['Count: 0 [after batchedUpdates]']);
  expect(container.textContent).toEqual('Count: 0');
 
  // Intentionally not using `act` so we can observe in between the click

packages/react-dom/src/__tests__/ReactDOMNestedEvents-test.js

@@ -15,6 +15,7 @@ describe('ReactDOMNestedEvents', () => {
  let Scheduler;
  let act;
  let useState;
+ let assertLog;
 
  beforeEach(() => {
  jest.resetModules();
@@ -23,6 +24,9 @@ describe('ReactDOMNestedEvents', () => {
  Scheduler = require('scheduler');
  act = require('jest-react').act;
  useState = React.useState;
+
+ const InternalTestUtils = require('internal-test-utils');
+ assertLog = InternalTestUtils.assertLog;
  });
 
  test('nested event dispatches should not cause updates to flush', async () => {
@@ -67,9 +71,7 @@ describe('ReactDOMNestedEvents', () => {
  await act(async () => {
  buttonRef.current.click();
  });
- expect(Scheduler).toHaveYielded([
- 'Value right after focus call: Clicked: false, Focused: false',
- ]);
+ assertLog(['Value right after focus call: Clicked: false, Focused: false']);
  expect(buttonRef.current.innerHTML).toEqual('Clicked: true, Focused: true');
  });
 });

packages/react-dom/src/__tests__/ReactDOMRoot-test.js

@@ -16,6 +16,8 @@ let ReactDOMServer = require('react-dom/server');
 let Scheduler = require('scheduler');
 let act;
 let useEffect;
+let assertLog;
+let waitFor;
 
 describe('ReactDOMRoot', () => {
  let container;
@@ -30,6 +32,10 @@ describe('ReactDOMRoot', () => {
  Scheduler = require('scheduler');
  act = require('jest-react').act;
  useEffect = React.useEffect;
+
+ const InternalTestUtils = require('internal-test-utils');
+ assertLog = InternalTestUtils.assertLog;
+ waitFor = InternalTestUtils.waitFor;
  });
 
  it('renders children', () => {
@@ -255,7 +261,7 @@ describe('ReactDOMRoot', () => {
  Scheduler.unstable_yieldValue('callback');
  });
  expect(container.textContent).toEqual('Hi');
- expect(Scheduler).toHaveYielded(['callback']);
+ assertLog(['callback']);
  });
 
  it('warns when unmounting with legacy API (no previous content)', () => {
@@ -401,10 +407,10 @@ describe('ReactDOMRoot', () => {
  await act(async () => {
  root.render(<Foo value="b" />);
 
- expect(Scheduler).toHaveYielded(['a']);
+ assertLog(['a']);
  expect(container.textContent).toEqual('a');
 
- expect(Scheduler).toFlushAndYieldThrough(['b']);
+ await waitFor(['b']);
  if (gate(flags => flags.allowConcurrentByDefault)) {
  expect(container.textContent).toEqual('a');
  } else {