web: optimize tests by ~120% (#1018)

This is mainly done via sharding, caching & reducing total work:
1. `terser` is turned off when generating test build
2. `nx` distributed cache allows reusing build outputs
3. `playwright` sharding allows running tests in parallel

This can further be improved by using `swc` & `esbuild` during build

.github/workflows/core.tests.yml

@@ -22,20 +22,33 @@ jobs:
 
     steps:
       - uses: actions/checkout@v3
-      - name: Use Node.js 16.x
+
+      - name: Setup Node
         uses: actions/setup-node@v3
         with:
           node-version: 16.x
-          cache: 'npm'
-          cache-dependency-path: '**/package-lock.json'
+          cache: "npm"
+          cache-dependency-path: |
+            apps/mobile/package-lock.json
+            apps/web/package-lock.json
+            packages/core/package-lock.json
+            packages/crypto/package-lock.json
+            packages/crypto-worker/package-lock.json
+            packages/editor-mobile/package-lock.json
+            packages/editor/package-lock.json
+            packages/logger/package-lock.json
+            packages/streamable-fs/package-lock.json
+            packages/theme/package-lock.json
 
       - name: Prepare environment
         run: |
-          npm ci
+          npm ci --no-audit
       - name: Add environment variables
         run: |
           echo "EMAIL=${{ secrets.USER_EMAIL }}" >> $GITHUB_ENV
           echo "PASSWORD='${{ secrets.USER_PASSWORD }}'" >> $GITHUB_ENV
           echo "HASHED_PASSWORD=${{ secrets.USER_HASHED_PASSWORD }}" >> $GITHUB_ENV
+          echo "NX_CLOUD_ACCESS_TOKEN=${{ secrets.NX_CLOUD_ACCESS_TOKEN }}" >> $GITHUB_ENV
+
       - name: Run all @notesnook/core tests
         run: npx nx test:e2e @notesnook/core

.github/workflows/web.tests.yml

@@ -8,7 +8,7 @@ on:
     paths:
       - "apps/web/**"
       # re-run workflow if workflow file changes
-      - ".github/workflows/web.tests.yml" 
+      - ".github/workflows/web.tests.yml"
   pull_request:
     types:
       - "ready_for_review"
@@ -17,15 +17,18 @@ on:
       - "reopened"
 
 jobs:
-  test:
+  build:
+    name: Build
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
-      - name: Use Node.js 16.x
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Setup Node
         uses: actions/setup-node@v3
         with:
           node-version: 16.x
-          cache: 'npm'
+          cache: "npm"
           cache-dependency-path: |
             apps/mobile/package-lock.json
             apps/web/package-lock.json
@@ -37,28 +40,84 @@ jobs:
             packages/logger/package-lock.json
             packages/streamable-fs/package-lock.json
             packages/theme/package-lock.json
+
+      - name: Install packages
+        run: |
+          npm i --ignore-scripts --no-audit
+          npx lerna bootstrap --ignore=@notesnook/mobile -- --no-audit
+
+      - name: Setup environment
+        run: |
+          echo "NX_CLOUD_ACCESS_TOKEN=${{ secrets.NX_CLOUD_ACCESS_TOKEN }}" >> $GITHUB_ENV
+
+      - name: Generate test build
+        run: npm run build:test:web
+
+      - name: Archive build artifact
+        uses: actions/upload-artifact@v2
+        with:
+          name: build
+          path: apps/web/build/**/*
+  test:
+    needs: build
+    name: 🧪 Test (${{ matrix.shard }}/${{ strategy.job-total }})
+    strategy:
+      matrix:
+        shard: [1, 2, 3]
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Download build
+        uses: actions/download-artifact@v3
+        with:
+          name: build
+          path: ./apps/web/build
+
+      - name: Setup Node
+        uses: actions/setup-node@v3
+        with:
+          node-version: 16.x
+          cache: "npm"
+          cache-dependency-path: |
+            apps/mobile/package-lock.json
+            apps/web/package-lock.json
+            packages/core/package-lock.json
+            packages/crypto/package-lock.json
+            packages/crypto-worker/package-lock.json
+            packages/editor-mobile/package-lock.json
+            packages/editor/package-lock.json
+            packages/logger/package-lock.json
+            packages/streamable-fs/package-lock.json
+            packages/theme/package-lock.json
+
+      - name: Install packages
+        run: |
+          npm i --ignore-scripts --no-audit
+          npm install -D @playwright/test
+
+      - name: Validate build extraction
+        run: ls -ld ./apps/web/build/index.html
+
+      - name: Install Playwright Browsers
+        run: npx playwright install chromium --with-deps
+        working-directory: apps/web
+
       - name: Add environment variables
         run: |
           echo "USER_EMAIL=${{ secrets.USER_EMAIL }}" >> $GITHUB_ENV
           echo "CURRENT_USER_PASSWORD=${{ secrets.USER_PASSWORD }}" >> $GITHUB_ENV
           echo "CURRENT_USER_KEY=${{ secrets.USER_KEY }}" >> $GITHUB_ENV
 
-      - name: Prepare environment
-        run: npm ci
+      - name: Run tests
+        run: npx playwright test --shard=${{ matrix.shard }}/${{ strategy.job-total }}
+        working-directory: apps/web
 
-      - name: Install Playwright Browsers
-        run: npx playwright install --with-deps
-        working-directory: ./apps/web
-
-      - name: Generate test build
-        run: npm run build:test:web
-
-      - name: Run all @notesnook/web tests
-        run: npm run test:web
-
-      - uses: actions/upload-artifact@v3
+      - name: Upload test results
+        uses: actions/upload-artifact@v3
         if: failure()
         with:
-          name: test-results
+          name: test-results-${{ matrix.shard }}
           path: apps/web/test-results
           retention-days: 5