👷 #31 - Add storybook tests to ci.

.github/workflows/ci.yml

@@ -12,7 +12,31 @@ on:
   workflow_dispatch:
 
 jobs:
-  build-and-test:
+  tests:
+    name: Serve storybook and run tests
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version-file: '.nvmrc'
+          cache: yarn
+
+      - name: Build Storybook docs
+        run: |
+          yarn install
+          npx playwright install --with-deps
+          yarn build-storybook --quiet
+
+      - name: Serve storybook and run tests
+        run: |
+          ls -la
+          npx concurrently -k -s first -n "SB,TEST" -c "magenta,blue" \
+            "npx http-server storybook-static --port 6006 --quiet" \
+            "npx wait-on -l http://127.0.0.1:6006 && npm test"
+
+  build:
     name: Create 'production' build
     runs-on: ubuntu-latest
 
@@ -29,10 +53,6 @@ jobs:
       - name: Build library
         run: yarn build
 
-      # TODO: Not set up/configured yet
-      # - name: Run tests
-      #   run: yarn test
-
       - name: Store build artifact
         uses: actions/upload-artifact@v3
         with:

package.json

@@ -19,8 +19,9 @@
     "build:cjs": "tsc --module commonjs --outDir dist/cjs",
     "build:storybook": "build-storybook --webpack-stats-json",
     "build": "npm-run-all build:*",
-    "test": "run-s test:lint",
+    "test": "run-s test:lint test:storybook",
     "test:lint": "eslint src/**/*.ts[x]",
+    "test:storybook": "test-storybook",
     "checkformat": "prettier --check 'src/**/*.{js,scss,ts,tsx,mdx}'",
     "format": "prettier --write 'src/**/*.{js,scss,ts,tsx,mdx}'",
     "start": "start-storybook -p 6006",
@@ -53,6 +54,7 @@
     "@storybook/jest": "^0.0.10",
     "@storybook/manager-webpack5": "^6.5.16",
     "@storybook/react": "^6.5.16",
+    "@storybook/test-runner": "^0.10.0",
     "@storybook/testing-library": "^0.0.13",
     "@trivago/prettier-plugin-sort-imports": "^4.1.1",
     "@types/react": "^18.0.28",