Enzyme snapshot showing [object,Object] for shallow rendering snapshots
- Dominant language
- JavaScript
- Stars
- 19.8k
- Forks
- 2k
- PR merge metrics
- No merged PRs in 30d
Description
I am testing my react-native app using jest and enzyme. I have this component structure.
```
```
Here is my test case
```
import Login from "../index";
import React from 'react';
import { shallow } from 'enzyme';
import globalStyles from '../../../../../global/styles';
let theme = 'DefaultTheme', wrapper;
const createTestProps = (props) => ({
navigation: {
navigate: jest.fn()
},
theme: theme,
globalStyles: globalStyles(theme),
session: {},
changeScene: jest.fn(),
changeTheme: jest.fn(),
setUser: jest.fn(),
logout: jest.fn(),
...props
});
beforeEach(() => {
const props = createTestProps({});
wrapper = shallow();
});
test('should render login component correctly', () => {
expect(wrapper).toMatchSnapshot();
});
```
All components snapshots render correctly but my custom component Gradient Button showing this type of structure
`<[object Object]/>`
Due to this I am also getting this warning in console
> Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/f unction (for composite components) but got: object.
### Your environment
#### API
- [-] shallow
- [ ] mount
- [ ] render
#### Version
| library | version
| ------------------- | -------
| enzyme | ^3.10.0
| react | 16.8.3
| react-dom |
| react-test-renderer |
| adapter (below) |
#### Adapter
- [-] enzyme-adapter-react-16
- [ ] enzyme-adapter-react-16.3
- [ ] enzyme-adapter-react-16.2
- [ ] enzyme-adapter-react-16.1
- [ ] enzyme-adapter-react-15
- [ ] enzyme-adapter-react-15.4
- [ ] enzyme-adapter-react-14
- [ ] enzyme-adapter-react-13
- [ ] enzyme-adapter-react-helper
- [ ] others ( )
Contributor guide
Research direction
Reproduce the shallow-render snapshot test for Login with the shown props and adapter setup, then inspect how GradientButton is represented in the rendered output. Compare the invalid-element warning with the component's snapshot output. Done means the custom component renders without [object Object] and the test completes without the React.createElement warning.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react, react-native
- Domain
- testing
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100