I am receiving the error below after running Jest. I dont have much experience using Jest so hoping someone can please provide information on why this test is failing.
Results: Jest test result:
- Snapshot
+ Received
- <span
- className="icon icon-dismiss size-2x "
- style={
- Object {
- "color": "inherit",
+ <Fragment>
+ <span
+ className="icon icon-dismiss size-2x "
+ style={
+ Object {
+ "color": "inherit",
+ }
}
- }
- title=""
- />
+ title=""
+ />
+ </Fragment>
26 | };
27 | const wrapper = shallow(<Icon {...props} />);
> 28 | expect(toJson(wrapper)).toMatchSnapshot();
| ^
29 | });
30 | });
Here is the test file: Test File
Component.spec.jsx
describe('Snapshot test - <Icon />', () => {
it('renders Icon correctly in clean state', () => {
const props = {
icon: 'dismiss',
};
const wrapper = shallow(<Icon {...props} />);
expect(toJson(wrapper)).toMatchSnapshot();
});
it('renders Icon correctly when colour provided', () => {
const props = {
icon: 'dismiss',
color: '#000000',
};
const wrapper = shallow(<Icon {...props} />);
expect(toJson(wrapper)).toMatchSnapshot();
});
});
Here is the component file: component.js
class Icon extends React.PureComponent<IconProps> {
render() {
const {
className, icon, size, colour, style, title,
} = this.props;
return (
<React.Fragment>
{icon === 'spinner' ? <LoadingSpinnerSmall /> : (
<span
title={title}
className={`${css.icon} ${css[`icon-${icon}`]} ${css[`size-${size}`]} ${className}`}
style=
/>
)
}
</React.Fragment>
);
}
}
export default Icon;
Aucun commentaire:
Enregistrer un commentaire