Skip to content

Instantly share code, notes, and snippets.

@jonkemp
Last active Mar 4, 2022
Embed
What would you like to do?
React Component in Next.js with Styled Components, Enzyme, Jest and Storybook [Template]
import React from 'react';
import styled from 'styled-components';
import PropTypes from 'prop-types';
const HelloWorld = () => {
return <Wrapper />;
};
export default HelloWorld;
HelloWorld.propTypes = {};
HelloWorld.displayName = 'HelloWorld';
const Wrapper = styled.div``;
import React from 'react';
import HelloWorld from './HelloWorld';
import { shallow, render } from 'enzyme';
import toJson from 'enzyme-to-json';
describe('<HelloWorld/>', () => {
it('renders and displays a div', () => {
const wrapper = shallow(<HelloWorld />);
expect(wrapper).toHaveLength(1);
});
it('renders and displays properly', () => {
const wrapper = toJson(render(<HelloWorld />));
expect(wrapper).toMatchSnapshot();
});
});
import React from 'react';
import HelloWorld from './HelloWorld';
export default {
title: 'HelloWorld',
component: HelloWorld,
args: {}
};
const Template = args => (
<HelloWorld {...args} />
);
export const Primary = Template.bind({});
Primary.args = {};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment