5

We are trying to upgrade our test environment from jest 26 to 27. This is our working branch : https://github.com/pass-culture/pass-culture-app-native/tree/update-jest-27

So far, we encounter a bunch of error that we are still unable to fix, for instance:

TypeError: requestAnimationFrame is not a function

    TypeError: requestAnimationFrame is not a function
      at start (node_modules/react-native/Libraries/Animated/animations/TimingAnimation.js:133:34)

TypeError: global.cancelAnimationFrame is not a function

    TypeError: global.cancelAnimationFrame is not a function

      at TimingAnimation.stop (node_modules/react-native/Libraries/Animated/animations/TimingAnimation.js:176:12)

Exceeded timeout of 5000 ms for a hook

    thrown: "Exceeded timeout of 5000 ms for a hook.
    Use jest.setTimeout(newTimeout) to increase the timeout value, if this is a long-running test."

We have many test failing for this and have found a bunch of proposition but none worked to fix our test

This is the most present error.

If you have any idea, to make progress, it would be welcomed.

Reproduction

  1. Clone my repo git clone --single-branch --branche update-jest-27 https://github.com/pass-culture/pass-culture-app-native.git
  2. cd pass-culture-app-native
  3. yarn
  4. yarn test:unit

Additional context

System:
  OS: Linux dka 5.8.0-0.bpo.2-amd64 #1 SMP Debian 5.8.10-1~bpo10+1 (2020-09-26) x86_64 GNU/Linux
  CPU: (8) arm64
Binaries:
  Node: v16.13.2 - /home/dka/.nvm/versions/node/v16.13.2/bin/node
  Yarn: 1.22.15 - /home/dka/.yarn/bin/yarn
npmPackages:
  jest: 26.0.14 => 27.5.2
  react-native: 0.68.2
Dimitri Kopriwa
  • 13,139
  • 27
  • 98
  • 204
  • have you tried mocking out Animated? Do you need anything from Animated in your tests? This would just address the first two – Abe Jul 27 '22 at 18:43
  • I tried to define in global a mock but not using jest.mock is not helping. It didn't seems to work ans was literraly getting ignored. Just 28 doesn't seems to have this bug but since just 27 isn't, I am having all those timeout error which keep falling in 28 despite jest.setTimeout was increase. Don't know what to do. – Dimitri Kopriwa Jul 28 '22 at 08:07

2 Answers2

2

I tried to mock global.cancelAnimationFrame and global.requestAnimationFrame but none of them worked for me (I'm using react-native).

So, I had to mock this module in my setupFiles.js to fix the error:

jest.mock('react-native/Libraries/Animated/animations/TimingAnimation.js');
Mahdieh Shavandi
  • 4,906
  • 32
  • 41
  • 1
    Wow - this saved me after a day of fruitless debugging after upgrading to Jest 27. We had been using `useFakeTimers`, but it was breaking despite all suggested updates - but this allowed us to get rid of `useFakeTimers`, at which point the upgrade worked. Thank you!! – Andrew Apr 24 '23 at 20:37
1

try add into jestSetup file

beforeEach(() => {
  // @ts-ignore
  global.requestAnimationFrame = function (callback: any) {
    setTimeout(callback, 0);
  };
  global.cancelAnimationFrame = function (callback: any) {
    setTimeout(callback, 0);
  };
});
Matheus Souza
  • 11
  • 1
  • 1
    As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Aug 05 '22 at 23:07