• Practice TDD workflow to create a simple CRUD app with React
• Use Enzyme's shallow function to test React components without their child components
• Write assertions using Jest
• Use sinon to create stubs/spies

TDD is a requirement in modern software development. The functional nature of React, combined with helpful libraries like enzyme make the React TDD workflow very appealing. However, without practice developers might be tempted to fall back to pre-TDD ways. This exercise gives students practice with the TDD workflow and enzyme.

1. Fork this repo.
2. Clone your fork.
3. Run yarn install.
4. Run yarn test and verify existing tests pass.
5. Run yarn start to view app in the browser.

This repo contains an empty react app. Your job is to implement the following user stories in TDD fashion:

1. Given a browser, when I browse to the site, then I see an "Add Person" button.
2. Given I see the "Add Person" button, when I click it, then I am taken to an Add Person page.
3. Given I am on the Add Person page, when I fill in the fields and click "Add", I am taken back to the list page.
4. Given that I have added a person, when I am on the list page, then I see my people.
5. Given that I see people in the list, when I click a person, I am taken to a Person Edit page.
6. Given I am on the person edit page, when I change a persons name and click Save, then I am taken back to the list page.
7. Given that I have made updates to people, when I am on the list page, I should see the modified information.
8. Given that I am on the edit page, then I see a delete button.
9. Given that I am on the edit page, when I click the delete button, then I am taken back to the list page.
10. Given that I have deleted a person, when I am on the list page, then I no longer see the deleted people.

Tips:

• Use simulate to simulate text change and click events
• Use sinon to stub the onEdit() call
• Verify the stub was called with the correct arguments.
• Use controlled components for input.

• Jest assertions
• Shallow rendering with Enzyme
• Shallow docs on GitHub
• Shallow find
• Shallow simulate
• Sinon docs