Ad
Stateless Component Returns `null` For Shallow Snapshot Testings
I have a stateless component.
I am matching the snapshot for unit tests.
But it returns null
Spec
import React from 'react';
import { shallow } from 'enzyme';
import { shallowToJson } from 'enzyme-to-json';
import StatelessComponent from 'components/elements/StatelessComponent';
describe('<StatelessComponent />', () => {
let wrapper;
beforeEach(() => {
wrapper = shallow(<StatelessComponent />);
});
it ('should render with default props', () => {
expect(shallowToJson(wrapper)).toMatchSnapshot();
});
});
Component
export const StatelessComponent = () => (
<div className={styles['container']}>
<div className={styles['description']}>
<FormattedMessage {...emailErrorInfo} />
</div>
</div>
);
Snapshot
exports[`<StatelessComponent /> should render with default props 1`] = `null`;
Ad
Answer
Exporting the Stateless component as a default solved the issue.
const StatelessComponent = () => (
<div className={styles['container']}>
<div className={styles['description']}>
<FormattedMessage {...emailErrorInfo} />
</div>
</div>
);
export default StatelessComponent
Ad
source: stackoverflow.com
Related Questions
- → Import statement and Babel
- → should I choose reactjs+f7 or f7+vue.js?
- → Uncaught TypeError: Cannot read property '__SECRET_DOM_DO_NOT_USE_OR_YOU_WILL_BE_FIRED' of undefined
- → .tsx webpack compile fails: Unexpected token <
- → React-router: Passing props to children
- → ListView.DataSource looping data for React Native
- → React Native with visual studio 2015 IDE
- → Can't test submit handler in React component
- → React + Flux - How to avoid global variable
- → Webpack, React & Babel, not rendering DOM
- → How do I determine if a new ReactJS session and/or Browser session has started?
- → Alt @decorators in React-Native
- → How to dynamically add class to parent div of focused input field?
Ad