Merge pull request #85 from chanzuckerberg/ah-playwright-browsers

Install Playwright browsers

.github/workflows/tests.yml

@@ -30,8 +30,5 @@ jobs:
       - name: Prepare for Integration Tests
         run: npm run demo:build
 
-      - name: Install playwright browsers
-        run: npx playwright install chromium --with-deps
-
       - name: Integration Tests
         run: npm run test:integrationOnly

CHANGELOG.md

@@ -2,6 +2,8 @@
 
 ## Unreleased
 
+- [fix] Automatically install Chromium and add note about installing other browsers [#85](https://github.com/chanzuckerberg/axe-storybook-testing/pull/85)
+
 # 7.1.2 (2023-08-07)
 
 - [fix] Update most deps [#82](https://github.com/chanzuckerberg/axe-storybook-testing/pull/82)

README.md

@@ -41,35 +41,31 @@ This project adheres to the [Contributor Covenant code of conduct](https://www.c
 # via npm
 npm install --save-dev @chanzuckerberg/axe-storybook-testing
 
-# or, if using Yarn
+# or with Yarn
 yarn add --dev @chanzuckerberg/axe-storybook-testing
 ```
 
 ## Usage
 
 To use:
 
-1. Create a static Storybook build. Normally you'll do this with the [`storybook build` command](https://storybook.js.org/docs/react/api/cli-options#build).
-2. Run `axe-storybook`, which will analyze the static build.
-
-To make this as easy as possible to use, we recommend adding a script to your package.json that does this in one step.
-
-```jsonc
-// In package.json
-"scripts": {
-  "storybook:axe": "storybook build && axe-storybook"
-},
-```
-
-Then you can run the tests with
-
-```sh
-# If using npm
-npm run storybook:axe
-
-# or, if using Yarn
-yarn storybook:axe
-```
+1. Add a script that creates a storybook build and then executes the axe-storybook command
+   ```jsonc
+   // In package.json
+   "scripts": {
+     "test:axe": "storybook build && axe-storybook"
+   },
+   ```
+
+2. Run the tests by calling the script from the previous step
+   ```sh
+   npm run test:axe
+   ```
+
+3. (Optional) Install more browsers. By default Chromium is installed. If you want to also use Firefox and/or Safari, install them with:
+   ```sh
+   npx playwright install
+   ```
 
 ## Options
 

package.json

@@ -44,6 +44,7 @@
     "validate": "npm run lint && npm run types && npm run test"
   },
   "dependencies": {
+    "@playwright/browser-chromium": "^1.39.0",
     "http-server": "^14.1.1",
     "indent-string": "^4.0.0",
     "lodash": "^4.17.21",