Parallelize CI pipeline (#7001)

.github/actions/pnpm-setup/action.yml

@@ -0,0 +1,21 @@
+# References:
+# - https://github.com/actions/setup-node/blob/main/docs/advanced-usage.md#caching-packages-data
+# - https://github.com/pnpm/action-setup
+
+name: pnpm Setup
+description: Install Node and pnpm, install dependencies
+runs:
+  using: "composite"
+  steps:
+    - uses: pnpm/action-setup@v4
+      with:
+        version: 9
+        run_install: false
+
+    - uses: actions/setup-node@v4
+      with:
+        node-version: '20'
+        cache: 'pnpm'
+
+    - run: pnpm install
+      shell: bash

.github/workflows/ci.yml

@@ -10,65 +10,82 @@ on:
   workflow_dispatch:
 
 jobs:
-  build:
+  build-and-check:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
         with:
           fetch-depth: 0
           persist-credentials: false
+      - uses: ./.github/actions/pnpm-setup
 
-      # - uses: pnpm/action-setup@v4
-      #   with:
-      #     run_install: false
-      #     version: 8
-      # - uses: actions/setup-node@v4
-      #   with:
-      #     cache: pnpm
-      #     node-version: 20
-
-      # https://github.com/pnpm/action-setup#use-cache-to-reduce-installation-time
-      - name: Install Node.js
-        uses: actions/setup-node@v4
-        with:
-          # cache: pnpm
-          node-version: 20
-      - name: Install pnpm
-        uses: pnpm/action-setup@v4
-        id: pnpm-install
-        with:
-          version: 9
-          run_install: false
-      - name: Get pnpm store directory
-        id: pnpm-cache
-        shell: bash
-        run: echo "STORE_PATH=$(pnpm store path)" >> $GITHUB_OUTPUT
-      - uses: actions/cache@v4
-        name: Setup pnpm cache
-        with:
-          path: ${{ steps.pnpm-cache.outputs.STORE_PATH }}
-          key: ${{ runner.os }}-pnpm-store
-          restore-keys: |
-            ${{ runner.os }}-pnpm-store
+      - name: Build
+        run: pnpm -r build
 
-      - name: Install
-        run: pnpm i --no-frozen-lockfile
       - name: Unused
-        run: pnpm -r unused
-      - name: Depcheck
-        run: pnpm -r depcheck
+        run: pnpm -r --parallel unused
+
+      - name: Lint
+        run: pnpm -r --parallel lint
+
       - name: Format
-        run: pnpm -r format
+        run: pnpm -r --parallel format
+
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+          persist-credentials: false
+      - uses: ./.github/actions/pnpm-setup
+
+      - name: Install Playwright Browsers
+        run: pnpm --filter @public-ui/components exec playwright install --with-deps
+
       - name: Build
-        run: pnpm -r build
-      - name: Lint
-        run: pnpm -r lint
-      - name: Test
-        run: pnpm -r --workspace-concurrency=1 test # https://pnpm.io/configuring
+        run: pnpm --filter @public-ui/sample-react^... build
+
+      - name: Unit Tests
+        run: pnpm -r test:unit
+
+       # Tests in sample app are currently failing and hence disabled.
+       # Remove `--filter @public-ui/components` after tests have been fixed in #7003.
+      - name: E2E Test
+        run: pnpm --filter @public-ui/components test:e2e
+
+      - uses: actions/upload-artifact@v4
+        if: failure()
+        name: Upload test reports
+        with:
+          name: reports
+          path: |
+            packages/themes/**/test-results/**/*.png
+            packages/test-tag-name-transformer/test-results/**/*.png
+            packages/components/playwright-report/
+            !**/node_modules
+
+  test-visual:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        package: ['@public-ui/test-tag-name-transformer', '@public-ui/theme-bmf', '@public-ui/theme-default']
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+          persist-credentials: false
+      - uses: ./.github/actions/pnpm-setup
+
       - name: Install Playwright Browsers
         run: pnpm --filter @public-ui/components exec playwright install --with-deps
-      - name: Components E2E Test
-        run: pnpm --filter @public-ui/components e2e
+
+      - name: Build
+        run: pnpm -r build
+
+      - name: Visual Tests
+        run: pnpm --filter=${{ matrix.package }} test:visual
+
       - uses: actions/upload-artifact@v4
         if: failure()
         name: Upload test reports

packages/components/package.json

@@ -62,9 +62,10 @@
 		"lighthouse": "lighthouse --chrome-flags=\"--headless\" --output-path lighthouse.report.html --preset=desktop --quiet",
 		"lint": "tsc --noemit && eslint src",
 		"dev": "cross-env NODE_ENV=development stencil build --prod --watch",
-		"test": "cross-env NODE_ENV=test stencil test --spec --json --outputFile dist/jest-test-results.json",
+		"test": "pnpm test:unit",
+		"test:unit": "cross-env NODE_ENV=test stencil test --spec --json --outputFile dist/jest-test-results.json",
 		"test:watch": "cross-env NODE_ENV=test stencil test --spec --watchAll",
-		"e2e": "playwright test",
+		"test:e2e": "playwright test",
 		"postinstall": "pnpm exec playwright install",
 		"postpack": "mv package.bak.json package.json",
 		"prepack": "npm run build && cp package.json package.bak.json && rimraf dist/collection dist/kolibri/assets/@leanup dist/types/assets/@leanup && node scripts/anonymous.js && node scripts/minify.js",

packages/samples/react/package.json

@@ -18,7 +18,8 @@
 		"serve": "cross-env NODE_ENV=development webpack serve --devtool=source-map",
 		"start": "npm run serve -- --open",
 		"unused": "ts-prune -e src",
-		"e2e": "playwright test",
+		"test:e2e": "playwright test",
+		"test": "pnpm test:e2e",
 		"postinstall": "pnpm exec playwright install"
 	},
 	"dependencies": {

packages/test-tag-name-transformer/package.json

@@ -5,7 +5,8 @@
 	"license": "EUPL-1.2",
   "description": "Performs snapshot testing on the default theme with a tag name transformer enabled.",
   "scripts": {
-    "test": "THEME_MODULE=theme ENABLE_TAG_NAME_TRANSFORMER=true kolibri-visual-test",
+		"test": "pnpm test:visual",
+		"test:visual": "THEME_MODULE=theme ENABLE_TAG_NAME_TRANSFORMER=true kolibri-visual-test",
     "test-update": "THEME_MODULE=theme ENABLE_TAG_NAME_TRANSFORMER=true kolibri-visual-test --update-snapshots theme-snapshots.spec.js"
   },
   "devDependencies": {

packages/themes/bmf/package.json

@@ -12,7 +12,8 @@
 		"prepack": "pnpm build",
 		"start": "npm-run-all --parallel dev serve",
 		"serve": "cross-env THEME_MODULE=\"`pwd`/dist\" THEME_EXPORT=BMF npm --prefix \"node_modules/@public-ui/sample-react/\" start",
-		"test": "cross-env THEME_MODULE=dist THEME_EXPORT=BMF kolibri-visual-test",
+		"test": "pnpm test:visual",
+		"test:visual": "cross-env THEME_MODULE=dist THEME_EXPORT=BMF kolibri-visual-test",
 		"test-update": "cross-env THEME_MODULE=dist THEME_EXPORT=BMF kolibri-visual-test --update-snapshots theme-snapshots.spec.js",
 		"pretest": "pnpm build",
 		"pretest-update": "pnpm build"

packages/themes/default/package.json

@@ -50,7 +50,8 @@
 		"prepack": "pnpm build",
 		"start": "npm-run-all --parallel dev serve",
 		"serve": "cross-env THEME_MODULE=\"`pwd`/dist\" THEME_EXPORT=DEFAULT npm --prefix \"node_modules/@public-ui/sample-react/\" start",
-		"test": "cross-env THEME_MODULE=dist THEME_EXPORT=DEFAULT kolibri-visual-test",
+		"test": "pnpm test:visual",
+		"test:visual": "cross-env THEME_MODULE=dist THEME_EXPORT=DEFAULT kolibri-visual-test",
 		"test-update": "cross-env THEME_MODULE=dist THEME_EXPORT=DEFAULT kolibri-visual-test --update-snapshots theme-snapshots.spec.js",
 		"pretest": "pnpm build",
 		"pretest-update": "pnpm build"