Mastering React Test-Driven Development

Selecting from a dropdown

The Git tag for this section is appointment-form.

Let's move on to creating our appointment form. This form is used to book an appointment for a customer. The first field is the service the customer requires: cut, color, blow-dry, and so on:

1. Create a new file, test/AppointmentForm.test.js, with the following test and setup:

import React from 'react';import { createContainer } from './domManipulators';import { AppointmentForm } from '../src/AppointmentForm';describe('AppointmentForm', () => {  let render, container;  beforeEach(() => {    ({ render, container } = createContainer());  });  const form = id =>    container.querySelector(`form[id="${id}"]`);  it('renders a form', () => {    render(<AppointmentForm />); expect(form('appointment')).not.toBeNull(); ...