React Testing and Deployment - 401-advanced-javascript-billybunn/seattle-javascript-401d29 GitHub Wiki

Testing with Enzyme

Shallow rendering

Shallow rendering is a way to test a single React component by itself as a single unit. It's a way to make sure the component isn't influencing any parent/child/sibling components.

Use shallow rendering in test by bringing it in from Enzyme.:

import { shallow } from 'enzyme';

Then call the function like this:

const wrapper = shallow(<MyComponent />);

Static rendering

Use static rendering to examine the actual HTML structure of components.

Use shallow rendering in test by bringing it in from Enzyme.:

import { render } from 'enzyme';

Then call the function like this:

const wrapper = render(<MyComponent />);

Full mounting

Full mounting or DOM rendering is done when you have components that interact with one another.

Use shallow rendering in test by bringing it in from Enzyme:

import { mount } from 'enzyme';

Snapshot testing

Snapshot testing involves rendering your UI, saving a "snapshot" of it at that point, run a test on your component, then compare it to the snapshot.

Continuous deployments with AWS