Mastering React Test-Driven Development

Adding a next page button

Let's start with the Next button, which the user can click to bring them to the next page of results:

1. Write the following test, which will let us get a Next button onto the page:

it('has a next button', async () => {  await renderAndWait(<CustomerSearch />);  expect(element('button#next-page')).not.toBeNull();});

2. Create a SearchButtons component which renders the Next button in a button-bar div, just as we did in App. I've chosen to extract this into its own component because we'll be expanding on it soon, when we add a Previous button:

const SearchButtons = () => (  <div className="button-bar">    <button role="button" id="next-page">      Next    </button>  </div>);

3. Use that within render. We'll need to wrap the existing ...