jest: [Bug]: React Native 0.68.2 have painful upgrade from Jest 26 to 27, requestAnimationFrame is not a function (not the one from window, but from react-native, no jsdom involved)
Version
27.5.1
Steps to reproduce
Clone my repo git clone --single-branch --branche update-jest-27 https://github.com/pass-culture/pass-culture-app-native.git
cd pass-culture-app-native
yarn
yarn test:unit
Expected behavior
I expect unit test to pass after upgrade
Actual behavior
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 an error with react-native, despite we are aware the jest env changed from jsdom to node, react-native does not use dom function anyway, and we got this:
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)
Just to make it clear, those function are not the one from window
in a browser environment, see by yourself here:
- https://github.com/facebook/react-native/blob/main/Libraries/Animated/animations/TimingAnimation.js#L128
- https://github.com/facebook/react-native/blob/main/Libraries/Animated/animations/TimingAnimation.js#L163
- https://github.com/facebook/react-native/blob/main/Libraries/Animated/animations/TimingAnimation.js#L171
And this is where it is implemented in react-native 0.68.2
- https://github.com/facebook/react-native/blob/main/Libraries/Core/Timers/JSTimers.js#L258-L261
- https://github.com/facebook/react-native/blob/main/Libraries/Core/Timers/JSTimers.js#L341-L343
Those tests succeed in jest 28, but we aren’t able to do both upgrade due to another problem related to the same jest 27 upgrade regarding timer, where all of our test now fails.
Additional context
it is not a DOM app, it’s a react-native app with jest that use react-native preset and no jsdom
Environment
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
About this issue
- Original URL
- State: closed
- Created 2 years ago
- Comments: 21
It worked for me adding
jest.mock('react-native/Libraries/Animated/animations/TimingAnimation.js');
Not sure if this will help everyone but I fixed all issues with a 26 -> 27 upgrade by removing ALL uses of
jest.useFakeTimer
/jest.runAllTimers
.