More Extensive Jest Mocks

[deecewan]

Introduction

The jest preset misses a lot of mocks of native components, and I can't seem to see any similarities between what is mocked, or rationale behind what should + shouldn't be mocked, anywhere.

Details

It feels like the react-native jest preset should mock every native component that exists in the react-native codebase. There are some things that are mocked, like Text, but others that aren't, like TouchableOpacity. This makes for very confusing errors to an end-user, where they may be using the ref.measure exposed on every native component, and getting errors like measure is not a function.

This is "easily" fixable by the end user by doing:

const mockComponent = require('react-native/jest/mockComponent')
const MockNativeMethods = require('react-native/jest/MockNativeMethods')

jest.mock('react-native/Libraries/Components/Touchable/TouchableOpacity', () => {
  return mockComponent(
    'react-native/Libraries/Components/Touchable/TouchableOpacity', 
    MockNativeMethods,
  )
});

But, this isn't currently present in jest/setup.js in the react-native repo.

There are some components present in there:

• Image is mocked, but does not have native methods (i.e. measure) attached to it
• Text is mocked, and does have native methods
• TextInput is mocked, and has native methods, along with other methods on the instance, mocked.

It feels like, unless there is good reason to not, that all components in Libraries/Components should have a mock defined in jest/setup.js.

Discussion points

• Is there a reason why some components are mocked and some aren't?
• Are there any downsides to every component being mocked?