[1508] Add Playwright for e2e testing (attempt 2)

[seatuna]

Summary

Issue: https://github.com/codeforboston/maple/issues/1508

This PR adds Playwright for e2e testing, a simple test for the MAPLE homepage. A redo of https://github.com/codeforboston/maple/pull/1535

I realized the initial issues I ran into that led me to updating package versions was likely due to using the wrong version of yarn. I started over, set my yarn version to v1.22.19 (same as the CI build), and reinstalled playwright without the extra changes. This is a much simpler PR now!

How to run tests

There are two ways you can run the e2e tests, with the Playwright UI or headless in your terminal. This will automatically start the application so you don't need to do it before running tests.

With Playwright UI

To run the e2e tests with the Playwright UI, run yarn test:e2e. Once the UI pops up and the tests have loaded, press the play button in the "TESTS" bar to run all the tests. To run individual tests or test suites, you can hover over the test name to reveal a play button that will run only that test/suite when clicked.

Headless

To run the e2e tests headless in your terminal, run yarn test:e2e:headless. The results of this test run will show on your terminal, and it will also generate an HTML report that will open in your browser.

Screenshots

Note: My macbook is old and I can't update it anymore. The screenshot shows the webkit test is failing, but it's because the version I have is incompatible 😓

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
maple-dev	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 6, 2024 8:44pm

[mertbagt]