Mock usage and setup not documented

johnnywang commented 1 year ago

Description

It's not clear from the documentation whether mocking is necessary when trying to test reanimated code in Jest/RNTL, i.e. jest.mock('react-native-reanimated', () => require('react-native-reanimated/mock')); I see that there was an old issue/PR opened up against this a few years ago, at which point there WERE instructions added to the readme to reference the included mock file: https://github.com/software-mansion/react-native-reanimated/pull/410. There are also multiple references in various (old) threads about how this was necessary, but nothing recent.

It seems like this was dropped at some point, and is not mentioned on the testing page either: https://docs.swmansion.com/react-native-reanimated/docs/guide/testing/

I've been struggling to get RNTL tests around gesture handler + reanimated to work, and it's not obvious to me if I need to mock out reanimated (in which case I simply can't test code using things like useAnimatedGestureHandler since it's mocked out) or not (which seems to cause other failures / tests to not complete)

Steps to reproduce

Go to https://docs.swmansion.com/react-native-reanimated/docs/guide/testing/
See that there are no references to the aforementioned mock file

Snack or a link to a repository

https://docs.swmansion.com/react-native-reanimated/docs/guide/testing/

Reanimated version

2.12.0

React Native version

0.70.5

Platforms

iOS

JavaScript runtime

None

Workflow

None

Architecture

None

Build type

None

Device

None

Device model

No response

Acknowledgements

Yes

github-actions[bot] commented 1 year ago

Hey! 👋

The issue doesn't seem to contain a minimal reproduction.

Could you provide a snack or a link to a GitHub repository under your username that reproduces the problem?

Latropos commented 1 year ago

@kacperkapusciak It's an old PR and our docs have change a lot since that time. Do you think we should improve it to inform about mocks better, or can we close this PR?

kacperkapusciak commented 1 year ago

@Latropos I think it's a valid problem that we haven't addressed. Let's keep it open

jbbelcher53 commented 3 months ago

for anyone else who might run into issues with jest tests where it says for example, Cannot read properties of undefined (reading 'duration') adding this to my setup file fixed it:

jest.mock("react-native-reanimated", () => {
  // eslint-disable-next-line @typescript-eslint/no-var-requires, no-undef
  const AnimatedMock = require("react-native-reanimated/mock")
  return {
    ...AnimatedMock,
    ZoomIn: {
      duration: jest.fn(),
    },
    ZoomOut: {
      duration: jest.fn(),
    },
  }
})

If your issue isn't ZoomIn or ZoomOut just change/add the animation name and any properties you are using with the animation to the object for it.

software-mansion / react-native-reanimated