ReactNative Animated is not properly mocked

[sospedra]

Do you want to request a feature or report a bug?
Bug

What is the current behavior?
Animated is not mocked

Using
react-native 0.47
jest 20
react 16
react-test-renderer 16

Implement any Animated component. With the new Animated.value and so on. And make a snapshot test.

It'll return:

Log error

 const wrapper = this._environment.runScript(transformedFile.script)[
                                                                     ^

TypeError: Cannot read property 'Object.<anonymous>' of null
  at Runtime._execModule (/Users/rigel/labs/mobile-apps/node_modules/jest-runtime/build/index.js:510:72)
  at Runtime.requireModule (/Users/rigel/labs/mobile-apps/node_modules/jest-runtime/build/index.js:329:14)
  at Runtime.requireModuleOrMock (/Users/rigel/labs/mobile-apps/node_modules/jest-runtime/build/index.js:405:19)
  at Function.bezier (/Users/rigel/labs/mobile-apps/node_modules/react-native/Libraries/Animated/src/Easing.js:228:13)
  at ease (/Users/rigel/labs/mobile-apps/node_modules/react-native/Libraries/Animated/src/Easing.js:94:14)
  at TimingAnimation._easing (/Users/rigel/labs/mobile-apps/node_modules/react-native/Libraries/Animated/src/Easing.js:262:10)
  at TimingAnimation.onUpdate (/Users/rigel/labs/mobile-apps/node_modules/react-native/Libraries/Animated/src/AnimatedImplementation.js:338:22)
  at ontimeout (timers.js:365:14)
  at tryOnTimeout (timers.js:237:5)
  at Timer.listOnTimeout (timers.js:207:5)

What is the expected behavior?

Should mock properly Animated, like the other react-native components so it doesn't break.

[cpojer]

This is not a Jest issue, this is an issue with react-native.

Please note this issue tracker is not a help forum. We recommend using StackOverflow or our discord channel for questions. Thank you :)

[sospedra]

It looks like a jest bug to me. A bug related with timers.
See this thread: #2979 (comment)

[AtticusFetch]

@sospedra , I am having the same issue, were you able to find a workaround?

[sospedra]

@AtticusFetch For reasons we needed the timer to be fixed hence we started using jest.useFakeTimers() and Date.now = jest.fn(() => 1503187200000). This causes jest to stop using timer worker-farm thus avoiding the error.

Hope it helps

[salujaharkirat]

This works fine. However adding this breaks promise based this cases

[duranmla]

I think this is the same that @sospedra wanted to let us know but I will just mention that by only adding:

jest.useFakeTimers();

On the top of your test file, it will make it work, I haven't dug too much into how/why it works, but it does it. Cheers.

Reference at:

• https://jestjs.io/docs/en/timer-mocks.html
• https://stackoverflow.com/questions/50793885/referenceerror-you-are-trying-to-import-a-file-after-the-jest-environment-has

PD: it seems to affect only the single file where you add the code so I do not see any bad consequence on adding it

[shushanth]

Was having the similar issue with RN 59,

use the below things to get rid of this error ,

• Remove import 'jsdom-global/register'; from tests .

• "testEnvironment": "jsdom" and "timers": "fake", should be used in jest configuration.

  "jest": {
  ...........
  "timers": "fake",
  "testEnvironment": "jsdom"
  ............
  }

[Gp2mv3]

This did it for me:

 "testEnvironment": "jsdom"

[RageOfJustice]

Was having the similar issue with RN 59,

use the below things to get rid of this error ,

• Remove import 'jsdom-global/register'; from tests .
• "testEnvironment": "jsdom" and "timers": "fake", should be used in jest configuration.
  "jest": {
  ...........
  "timers": "fake",
  "testEnvironment": "jsdom"
  ............
  }

Thanks. It helped me with FlatList snapshot

[allanyego]

@duranmla , thanks for that trick. I was having issues in CodeSandbox even after explicitly setting test environment to node.

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
Please note this issue tracker is not a help forum. We recommend using StackOverflow or our discord channel for questions.