CODEWITHSUNDEEP
react-nativejestjs
dogwasstar
dogwasstar

Reputation: 881

React native testing with Jest

I am new to React native and was learning how to write test for my welcome screen. The screen only has a background image and some text and a button.

Here is the error I am getting

onsole.error node_modules/prop-types/checkPropTypes.js:20

  Warning: Failed prop type: Invalid prop `source` supplied to `Image`.

      in Image (at WelcomeScreen.js:91)

      in WelcomeScreen (at WelcomeTest.js:7)

console.error node_modules/react/cjs/react.development.js:188

  Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.



  Check your code at WelcomeScreen.js:104.

      in WelcomeScreen (at WelcomeTest.js:7)

console.error node_modules/react-test-renderer/cjs/react-test-renderer.development.js:9036

  The above error occurred in one of your React components:

      in View (created by View)

      in View (at ImageBackground.js:63)

      in ImageBackground (at WelcomeScreen.js:74)

      in WelcomeScreen (at WelcomeTest.js:7)



  Consider adding an error boundary to your tree to customize error handling behavior.

Here is what I have written for the WelcomeTest.js

    import 'react-native'
import React from 'react'
import WelcomeScreen from '../App/Containers/WelcomeScreen'
import renderer from 'react-test-renderer'

test('WelcomeScreen component', () => {
  const tree = renderer.create(<WelcomeScreen />).toJSON()
  expect(tree).toMatchSnapshot()
})

Not sure what I am doing wrong. I have checked my imports and made sure the page renders correctly on its on. Can some one please point me in the right direction. Thanks in advance

Upvotes: 1

Views: 499

Answers (2)

jit
jit

Reputation: 35

I think Jest isn't able to consume Image while creating snapshot for comparing to older snap.

Upvotes: 0

Blimeys
Blimeys

Reputation: 176

In your jest.config.js add:

moduleNameMapper: {
    '^image![a-zA-Z0-9$_-]+$': 'GlobalImageStub',
}

This should mock resolve images path correctly for testing purpose.

Upvotes: 2

Related Questions