Update storybook-tests.yml

.github/workflows/storybook-tests.yml

@@ -1,4 +1,5 @@
 # .github/workflows/storybook-tests.yml
+# Intentionally uses Yarn as there's a bug with npm that causes caching issues for this workflow.
 
 name: 'Storybook Tests'
 
@@ -25,32 +26,32 @@ jobs:
         uses: actions/cache@v3
         with:
           path: |
-            ~/.npm
+            ~/.cache/yarn
             node_modules
-          key: ${{ runner.os }}-npm-${{ hashFiles('**/package-lock.json') }}
+          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
           restore-keys: |
-            ${{ runner.os }}-npm-
+            ${{ runner.os }}-yarn-
 
       - name: Install dependencies
-        run: npm ci
+        run: yarn install --frozen-lockfile
 
       - name: Cache Playwright Dependencies
         id: cache-playwright
         uses: actions/cache@v3
         with:
           path: ~/.cache/ms-playwright
-          key: ${{ runner.os }}-playwright-${{ hashFiles('**/package-lock.json') }}
+          key: ${{ runner.os }}-playwright-${{ hashFiles('**/yarn.lock') }}
           restore-keys: |
             ${{ runner.os }}-playwright-
 
       - name: Install Playwright
         run: npx playwright install --with-deps
 
       - name: Build Storybook
-        run: npm run build-storybook --quiet
+        run: yarn build-storybook --quiet
 
       - name: Serve Storybook and run tests
         run: |
           npx concurrently -k -s first -n "SB,TEST" -c "magenta,blue" \
             "npx http-server storybook-static --port 6006 --silent" \
-            "npx wait-on tcp:6006 && npm run test-storybook"
+            "npx wait-on tcp:6006 && yarn test-storybook"