jest.useRealTimers() is not a function when running RTL tests in jest-electron environment

I decided to try using jest-electron environment in our jest test setup because jsdom environment has some missing browser functionality that we were using.

• “@testing-library/jest-dom”: “^5.11.9”,
• “@testing-library/react”: “^11.2.3”,
• “@testing-library/user-event”: “^12.6.3”,
• node version: v15.10
• npm version: v7

Relevant code or config:

pasting only necessary changes here of my jest.config.js

{
 .
 .
  runner: 'jest-electron/runner',
  testEnvironment: 'jest-electron/environment',
  .
  .
  .
}

What you did:

ran npm run test

What happened:

i think helpers file inside RTL /dom is calling jest.useFakeTimers()… which is not available in jest-electron environment.

The error that i’m getting is shown in the following SS.

Reproduction:

Small repro can be created on local machine on following these steps. clone : https://github.com/tmtsoftware/esw-ocs-eng-ui git checkout jest-branch npm i & npm t

Problem description:

RTL/jest-dom helpers are calling jest.timers functionality without checking jest-environment.

Suggested solution:

there could be some kind of check related to which environment jest is currently running before this line. @Testing-Library/dom/dist/helpers.js:38.

[ZheyangSong]

In case this helps anyone facing the same issue, this breakage is seemly introduced by a patch version of 7.29. You can try to downgrade this library to a 7.28.x or lower. You should get this issue gone.

Hope this will get the testing-library project team’s attention as well. For me, the module I use, its custom environment doesn’t define userRealTimers. https://github.com/facebook-atom/jest-electron-runner/blob/master/packages/electron/src/Environment.js#L16

[Ruluk]

For the record, the same thing is happening to me when using the latest RTL in CodeSandbox.

Test code:

import React from 'react';

import { render } from '@testing-library/react';
import '@testing-library/jest-dom/extend-expect';

import App from './App';

describe('App', () => {
  test('it should render', () => {
    render(<App />);
  });
});

Dependencies:

{
    "@testing-library/react": "11.2.6",
    "react": "17.0.2",
    "react-dom": "17.0.2",
    "react-scripts": "4.0.0"
}

EDIT: New fact. It seems that it only fails with RTL 11.2.6. With 11.2.5 and below it seems to work fine.