Writing great tests

The first test now looks like this:

it('renders the customer first name', () => {
  customer = { firstName: 'Ashley' };
  render(<Appointment customer={customer} />);
  expect(container.textContent).toMatch('Ashley');
});

This is concise and clearly readable.

A good test has three distinct sections:

• Arrange: Sets up test dependencies
• Act: Executes production code under test
• Assert: Checks expectations are met

A great test is not just good but is also the following:

• Short
• Descriptive
• Independent of other tests
• Has no side-effects

Red, green, refactor

We’ve covered a lot of ground, and we have gone into excruciating detail for a very simple test. All of the ground...