Warning when test on Jest

[rodolfobarretoweb]

React version: 16.0.0-alpha.6 React native version: 0.43.3

Animated: useNativeDriver is not supported because the native animated module is missing. Falling back to JS-based animation. To resolve this, add RCTAnimation module to this app, or remove useNativeDriver. More info: https://github.com/facebook/react-native/issues/11094#issuecomment-263240420

[rknell]

Still happening with v0.6.7 and RN 0.48

[matart15]

My tests are failing with Invariant Violation: Native animated module is not available if I remove <ScrollableTabView> they passes.

[mateen-hussain]

I have the same issue and it happens when I try to render the component using react-test-renderer while running the test in jest

[christianchown]

Hello.

NativeAnimatedHelper is not mocked by default; I got rid of this warning by adding a

jest.mock('NativeAnimatedHelper');

in my jest setup file.

[rknell]

thanks @christianchown , that got me past that step, now I am stuck with

TypeError: Cannot read property 'addListener' of undefined
    at AnimatedValue._startListeningToNativeValueUpdates (/Users/<redacted>/app/node_modules/react-native/Libraries/Animated/src/nodes/AnimatedValue.js:194:75)
    at AnimatedValue.__makeNative (/Users/<redacted>/app/node_modules/react-native/Libraries/Animated/src/nodes/AnimatedValue.js:102:6)
    at AnimatedDivision.__makeNative (/Users/<redacted>/app/node_modules/react-native/Libraries/Animated/src/nodes/AnimatedDivision.js:33:9)
    at AnimatedValue.__makeNative (/Users/<redacted>/app/node_modules/react-native/Libraries/Animated/src/nodes/AnimatedWithChildren.js:30:7)
    at AnimatedValue.__makeNative (/Users/<redacted>/app/node_modules/react-native/Libraries/Animated/src/nodes/AnimatedValue.js:99:109)
    at AnimatedDivision.__makeNative (/Users/<redacted>/app/node_modules/react-native/Libraries/Animated/src/nodes/AnimatedDivision.js:33:9)
    at AnimatedValue.__addChild (/Users/<redacted>/app/node_modules/react-native/Libraries/Animated/src/nodes/AnimatedWithChildren.js:46:7)
    at AnimatedDivision.__attach (/Users/<redacted>/app/node_modules/react-native/Libraries/Animated/src/nodes/AnimatedDivision.js:53:9)
    at AnimatedDivision.__addChild (/Users/<redacted>/app/node_modules/react-native/Libraries/Animated/src/nodes/AnimatedWithChildren.js:41:6)
    at AnimatedInterpolation.__attach (/Users/<redacted>/app/node_modules/react-native/Libraries/Animated/src/nodes/AnimatedInterpolation.js:344:14)
    at AnimatedInterpolation.__addChild (/Users/<redacted>/app/node_modules/react-native/Libraries/Animated/src/nodes/AnimatedWithChildren.js:41:6)
    at /Users/<redacted>/app/node_modules/react-native/Libraries/Animated/src/nodes/AnimatedTransform.js:75:7

RN 0.50.3 "react-native-scrollable-tab-view": "^0.8.0",

[DoWhileGeek]

I'm experiencing @rknell's issue, given @christianchown's solution. Has there been any headway on this issue?

[igez]

+1

experiencing @rknell's problem as well

[dammy95]

+1 Also experiencing @rknell's problem

[dammy95]

So I found a way around this by doing this:

1. Create react-native-scrollable-tab-view.js in your app/__mocks__ folder.
2. In the react-native-scrollable-tab-view.js file, insert this:

export const NativeAnimatedHelper = {
  addListener: jest.fn(),
};

3. add in jest.mock('react-native-scrollable-tab-view', () => 'NativeAnimatedHelper'); in your jest test file.

Hope this helps!

[betoharres]

jest.mock('NativeAnimatedHelper')

This didn't work for me. After googling I found this: https://stackoverflow.com/questions/58257932/cannot-find-module-nativeanimatedhelper-when-using-jest-mock

which you just need to do this instead: jest.mock('react-native/Libraries/Animated/src/NativeAnimatedHelper')

[christianchown]

2021 update - a working fix for me now is

jest.mock('react-native/Libraries/Animated/NativeAnimatedHelper');

[WarunaWMPL]

Can anyone please tell me where is the jest.mock available to change

[betoharres]

@WarunaWMPL

Can anyone please tell me where is the jest.mock available to change

you don't need to import it, you just add this to .eslintrc.js

module.exports = {
  root: true,
  env: {jest: true},
  // ....
}

and create a js file with the library name inside the __mock__ directory and paste that mock inside the file. the jest variable will be set once it reaches the mock file, dont worry

[WarunaWMPL]

@betoharres it worked. Thanks

[mohmmd-ishtiaq]

So I found a way around this by doing this:

1. Create react-native-scrollable-tab-view.js in your app/__mocks__ folder.
2. In the react-native-scrollable-tab-view.js file, insert this:

export const NativeAnimatedHelper = {
  addListener: jest.fn(),
};

1. add in jest.mock('react-native-scrollable-tab-view', () => 'NativeAnimatedHelper'); in your jest test file.

Hope this helps!

it worked, thanks.