I am trying to test Layout component which also has a child component passed via props. here is the code I have so far including layout component and test file:
LayoutOne.js
import React from 'react';
import PropTypes from 'prop-types';
const LayoutOne = props => {
const {children} = props;
return(
<main className="main-content" data-test="layoutOneComponent">
{children}
</main>
);
};
LayoutOne.propTypes = {
children: PropTypes.node.isRequired
};
export default LayoutOne;
layout-one.test.js
import React from 'react';
import { shallow } from 'enzyme';
import LayoutOne from './LayoutOne';
import {testing} from '../../utils';
const TestComponent = () => (<div>my test component</div>);
describe('LayoutOne component', () => {
describe('checking prop types', () => {
it('should not throw a warning', () => {
const simulateProps = {
children: <TestComponent/>
};
const errorMsg = testing.checkProps(LayoutOne, simulateProps);
expect(errorMsg).toBeUndefined();
});
});
describe('renders', () => {
let wrapped;
beforeEach(() => {
wrapped = shallow(
<PublicMinimal>
<TestComponent/>
</PublicMinimal>
);
});
it('should render without errors', () => {
expect(testing.getByTestAttr(wrapped, 'layoutOneComponent').length).toEqual(1);
});
});
});
to note, child component will have it's own separate tests so my question is whether or not more testing should be done within LayoutOne test file in order to test child somehow ? what's the best practice for more thorough testing ?
Aucun commentaire:
Enregistrer un commentaire