Playwright

πŸ‘¨β€πŸ’Ό One of the most important features of our app is the search functionality you'll find on . So we're going to put our first test there. Here's what we're going to test:
  • Go to the home page
  • Type "kody" in the search input at the top and hit search
  • Verify we went to the user's page and that kody appears as an item in the list of results
  • Type something we know shouldn't show any results
  • Verify no results are displayed
We also want to make sure that if they type in a search term that doesn't match any user we display the right message.
In this exercise, we're going to rely on the fact that we have a user in our seeded database called "Kody". But you really don't want to do that! We'll improve upon this in the next step.
It could help to have the file open as a reference as you try to write the test. That said, Kody 🐨 will be in the file to guide you step-by-step here.
πŸ§β€β™‚οΈ I've already configured Playwright for us. You'll find the config in . If you want to learn more about the configuration options, knock yourself out with this reference.
Playwright-specific commands must be run in playground directory. If you're currently in the workshop's root directory, simply run cd playground to get there.
To start running the test, open up a terminal in the playground directory and run:
npx playwright test --ui
This will start your dev server and open up the playwright UI. If you've not seen it before, definitely take some time to learn about all the options in the UI before getting started.