testing-library / react-testing-library

🐐 Simple and complete React DOM testing utilities that encourage good testing practices.

Home Page:https://testing-library.com/react

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Support sinon fake timers

thatsmydoing opened this issue · comments

Describe the feature you'd like:

When using waitFor and sinon fake timers enabled, the test gets stuck and eventually times out. This seems to be a consequence of f78839b which adds a setTimeout.

Suggested implementation:

Supporting it in the same way jest timers are supported is probably okay, alternatively provide configuration for generically supporting arbitrary fake timer implementations.

Describe alternatives you've considered:

Adding the following to our test setup seems to work with the current version but it could easily get out of sync and it would be nice to have it built in or provide nicer abstraction to configure.

import { configure } from '@testing-library/react';
import sinon from 'sinon';

configure({
  asyncWrapper: async (cb) => {
    // our tests run only in the browser but this should more properly be getIsReactActEnvironment()
    const previousActEnvironment = window.IS_REACT_ACT_ENVIRONMENT;
    window.IS_REACT_ACT_ENVIRONMENT = false;
    try {
      const result = await cb();
      // Drain microtask queue.
      // Otherwise we'll restore the previous act() environment, before we resolve the `waitFor` call.
      // The caller would have no chance to wrap the in-flight Promises in `act()`
      await new Promise(resolve => {
        setTimeout(() => {
          resolve();
        }, 0);
        // run callbacks if we've mocked out global timers
        if (window.Date.isFake) {
          sinon.clock.tick(0);
        }
      });
      return result;
    } finally {
      window.IS_REACT_ACT_ENVIRONMENT = previousActEnvironment;
    }
  },
});

Teachability, Documentation, Adoption, Migration Strategy:

Ideally, it should just work. Otherwise, examples for how to configure it would be nice.

Alternatively, flush the queue without using setTimeout like what react does in https://github.com/facebook/react/blob/main/packages/shared/enqueueTask.js

This would be great, jest fake timers are supported in RTL, but sinon fake times are widely used. We can't build a few scenarios due to this limitation at the moment.