πŸ§ͺ Full Stack Testing

Intro

πŸ‘¨β€πŸ’Ό Hello, my name is Peter the Product Manager. I'm here to help you get oriented and to give you your assignments for the day. We're going to have you working on testing the Epic Notes app today.
We've got a pretty complicated app here and we want to feel confident that it's going to continue to work far into the future:
  1. Automating our manual testing processes
  2. Using HTTP mocks effectively in our end-to-end tests
  3. Supporting authenticated end-to-end tests
  4. Writing properly scoped unit tests with mocks
  5. Writing component tests for our React components
  6. Writing tests for our custom hooks
  7. Testing Remix routes with the Remix stub
  8. Adding one-off HTTP mocks for testing edge cases
  9. Writing authenticated integration tests
  10. Creating custom assertions
  11. Creating an isolated test database
It's a big job and there's lots to do, so, let's get started!

Tips:

  • We'll be running a lot of scripts in this workshop. You'll want to make certain you're always in the playground directory when you do this.
  • When you change the playground, the playwright UI sometimes gets confused. There's an icon you can click to refresh it, or you can ⌘ + r to reload.
  • If the Playwright UI is saying you don't have any tests, but you definitely do it could be that there's a syntax error in your tests. To check, run playwright without the --ui flag (npx playwright test) and it'll give you more output.
  • Playwright has an awesome VSCode extension you may consider installing.
Over time, some things may change in the workshop material from the videos you watch. You can learn about these changes in the CHANGELOG.md file of the repo.
Edit on GitHub