testing-library / dom-testing-library

🐙 Simple and complete DOM testing utilities that encourage good testing practices.
https://testing-library.com/dom
MIT License
3.26k stars 466 forks source link

When using "useFakeTimers", "findBy*" queries aren't resolved #1218

Closed JZalfen closed 1 year ago

JZalfen commented 1 year ago

Relevant code or config:

it('with fake timers, not working :(', async () => {
  vi.useFakeTimers();

  render(<TestComponent />);

  screen.getByText('Apple');
  vi.runOnlyPendingTimers();

  // this promise never resolves with fake timers
  await screen.findByText('Pear');

  // restore to real timers
  vi.useRealTimers();
});

What you did:

Using "useFakeTimers" with "findBy*" queries.

What happened:

Timeout on first usage of "screen.findByText".

Reproduction:

Stackblitz: https://stackblitz.com/edit/vitejs-vite-fwc91c?file=src/TestComponent.spec.tsx To run test: execute "vitest" in terminal

Problem description:

The test runs into a timeout.

Suggested solution:

none

bc-m commented 1 year ago

With @testing-library/react version 13.4.0 (using @testing-library/dom version 8.20.0) it works.

Stackblitz: https://stackblitz.com/edit/vitejs-vite-mfzplb?file=src/TestComponent.spec.tsx

So it looks like a regression of @testing-library/dom version 9.

bc-m commented 1 year ago

For me vi.useFakeTimers({ shouldAdvanceTime: true }); fixed it for @testing-library/dom v9:

https://stackblitz.com/edit/vitejs-vite-jjkbqn?file=src/TestComponent.spec.tsx

eps1lon commented 1 year ago

We don't support automatic advancement of fake timers outside of Jest. Closing as a duplicate of https://github.com/testing-library/dom-testing-library/issues/987