Mastering React Test-Driven Development

Adding a previous page button

Let's move on to the Previous button:

1. Write out the following test:

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

2. Make that pass by modifying SearchButtons to include the following button, just before the Next button:

<button role="button" id="previous-page">  Previous</button>

3. Write out the following test, which mounts the component, clicks Next, and then clicks Previous. It expects another call to the endpoint to have been made, but this time identical to the initial page—in other words, with no query string:

it('moves back to first page when previous button is clicked', async () => { window.fetch.mockReturnValue(fetchResponseOk(tenCustomers)); ...