navapbc / wic-participant-recertification-portal

https://navapbc.github.io/wic-participant-recertification-portal/
Apache License 2.0
0 stars 1 forks source link

[PRP-238] Add github workflow for manually generating playwright snapshots #27

Closed rocketnova closed 1 year ago

rocketnova commented 1 year ago

Ticket

https://wicmtdp.atlassian.net/browse/PRP-238

Changes

What was added, updated, or removed in this PR.

Context for reviewers

Testing instructions, background context, more in-depth details of the implementation, and anything else you'd like to call out or ask reviewers. Explain how the changes were verified.

This PR introduces a new Github Action that lets you update Playwright snapshots in a linux environment. Because Playwright is running headless browsers, that means that there are minute differences between snapshots created on macOS (our dev environment) vs linux (the environment that we run all our github actions on). The new github action will generate new or update existing snapshots and then commit them back to the feature branch. The new github action will not allow you to run this workflow on main.

The workflow for making new playwright tests will be:

  1. Write your code and write your playwright test (e.g. .spec.ts)
  2. Commit and push your feature branch to github
  3. Go to Actions, select the "Playwright snapshots" action in the left sidebar
  4. Click the "Run workflow" dropdown and select the app you want to update (i.e. participant or staff)
  5. Run the workflow to generate the snapshots and commit to your branch
  6. On your local environment, pull down the new commit git pull origin <feature-branch>
  7. Create your PR in github

This PR also adds the ability to view the test results from failed Playwright CI jobs. You can now download the diff pngs so you can see what Playwright sees.

Testing

Screenshots, GIF demos, code examples or output to help show the changes working as expected. ProTip: you can drag and drop or paste images into this textbox.

It's not possible to run a newly created Github Action as a manual workflow on a branch. So, I modified an existing Github Action to test the "generate linux playwright snapshots" functionality.

Here's an example of the failed Playwright test artifacts:

Here's an example of what a passing Playwright CI job looks like (note that there are no test artifacts):

github-actions[bot] commented 1 year ago

Chromatic_Build : Link to latest build in Chromatic 🌈 Link to storybook build in Chromatic