Created
April 1, 2020 07:05
-
-
Save JannisRex/758bcc645540fc717b40bcc520cd6940 to your computer and use it in GitHub Desktop.
Jest Test for <ErrorBoundary />
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import React from 'react' | |
| import { Text, View } from 'react-native' | |
| import renderer from 'react-test-renderer' | |
| import { ErrorBoundary } from '../../src/components/index' | |
| describe('ErrorBoundary', () => { | |
| let consoleErrorSpy | |
| let errorMock | |
| let workingComponent | |
| beforeAll(() => { | |
| consoleErrorSpy = jest.spyOn(console, 'error').mockImplementation(() => {}) // to clear ErrorBoundary errors in cli | |
| errorMock = new Error('This is a test error!') | |
| workingComponent = () => null | |
| }) | |
| afterAll(() => { | |
| consoleErrorSpy.mockRestore() // called after to reset the consoleError ---- reset props to default | |
| }) | |
| it('should render children', () => { // Default, everything is OK and children should get rendered | |
| const wrapper = renderer.create( | |
| <ErrorBoundary> | |
| <workingComponent /> | |
| </ErrorBoundary> | |
| ) | |
| expect(wrapper.getInstance().state.error).toBe(null) | |
| expect(wrapper.getInstance().state.hasError).toBe(false) | |
| expect(wrapper).toMatchSnapshot() | |
| }) | |
| it('should catch errors set the state and render the default FallbackComponent', () => { // checking if getDerivedStateFromError catches err | |
| const wrapper = renderer.create( | |
| <ErrorBoundary> | |
| <View>{errorMock}</View> | |
| </ErrorBoundary> | |
| ) | |
| expect(wrapper.getInstance().state.hasError).toBe(true) | |
| expect(wrapper).toMatchSnapshot() | |
| }) | |
| it('should catch errors set the state render the FallbackComponent and call onError()', () => { | |
| const FallbackComponent = () => <Text>Error Fallback!</Text> // This is ErrSubstituteScreen | |
| const onError = jest.fn() // just mocking the fucntion and test, if its getting called | |
| const wrapper = renderer.create( | |
| <ErrorBoundary FallbackComponent={FallbackComponent} onError={onError}> | |
| <View>{errorMock}</View> | |
| </ErrorBoundary> | |
| ) | |
| expect(wrapper.getInstance().state.error).not.toBeNull() | |
| expect(wrapper.getInstance().state.hasError).toBe(true) | |
| expect(onError).toHaveBeenCalledWith(expect.any(Error), expect.any(String)) | |
| expect(wrapper).toMatchSnapshot() | |
| }) | |
| it('should reset state when calling resetError', () => { | |
| const wrapper = renderer.create( | |
| <ErrorBoundary> | |
| <workingComponent /> | |
| </ErrorBoundary> | |
| ) | |
| wrapper.getInstance().setState({ error: errorMock, hasError: true }) // setting state manually | |
| wrapper.getInstance().resetError() // calling reset() to check functionality | |
| expect(wrapper.getInstance().state.error).toBeNull() | |
| expect(wrapper.getInstance().state.hasError).toBe(false) | |
| }) | |
| }) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment