chore: run cypress on vercel previews (#3651)

* chore: switch to running cypress on deployments

* chore: what do I have access to?

* chore: move to running cypress in dev mode

* chore: variables

* chore: run site via cypress actions

* chore: secrets for search

.github/workflows/on_deployment_status_cypress.yml

@@ -0,0 +1,63 @@
+name: Cypress Deployment Checks
+
+on:
+  deployment_status:
+
+jobs:
+  # run this job first to create a single timestamped id for all percy batches on parallel machines
+  percy-batch-id:
+    runs-on: ubuntu-latest
+    # persist job results to other jobs in the workflow
+    outputs:
+      result: ${{ steps.percy-batch-id.outputs.result }}
+    steps:
+      # persist step results to other steps in the job
+      - name: Create Percy Batch ID
+        id: percy-batch-id
+        # adding a timestamp makes the batch id more unique for re-runs
+        run: echo "result=${{ github.run_id }}-$(date +%s)" >> $GITHUB_OUTPUT
+
+  cypress_on_deployment:
+    name: Website tests
+    runs-on: ubuntu-latest
+    needs: percy-batch-id
+    if: github.event_name == 'deployment_status' && github.event.deployment_status.state == 'success' && startsWith(github.event.deployment_status.environment_url, 'https://paste-docs')
+    strategy:
+      fail-fast: false
+      matrix:
+        containers: [1, 2, 3]
+    env:
+      CYPRESS_CACHE_FOLDER: ./node_modules/cypress
+      CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
+      GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      PERCY_TOKEN: ${{ secrets.PERCY_TOKEN }}
+      USE_CYPRESS_VRT: false
+
+    steps:
+      - name: Checkout Repo
+        uses: actions/checkout@v3
+
+      - name: Setup Node.js 20.5
+        uses: actions/setup-node@v3
+        with:
+          node-version: 20.5.x
+
+      - name: Percy Batch ID
+        run: echo "${{ needs.percy-batch-id.outputs.result }}"
+
+      # Run cypress on merge to main aong with VRT to create our new baelines
+      - name: Cypress run with site VRT on main
+        uses: cypress-io/github-action@v4
+        if: ${{ github.ref == 'refs/heads/main' }}
+        with:
+          record: true
+          parallel: true
+          group: "Paste Actions with VRT Parallel"
+          config: baseUrl=${{ github.event.deployment_status.environment_url }}
+          # enabled percy to run cypress for VRT
+          command-prefix: "percy exec --parallel -- npx"
+        env:
+          USE_CYPRESS_VRT: true
+          PERCY_PARALLEL_NONCE: ${{ needs.percy-batch-id.outputs.result }}
+          PERCY_PARALLEL_TOTAL: 3
+          CYPRESS_BASE_URL: ${{ github.event.deployment_status.environment_url }}

.github/workflows/on_merge_to_main.yml

@@ -138,96 +138,3 @@ jobs:
           STORYBOOK_GITHUB_SHA: ${{ github.sha }}
           # https://github.com/storybookjs/builder-vite/issues/409#issuecomment-1199236279
           NODE_OPTIONS: --max-old-space-size=6144
-
-  # run this job first to create a single timestamped id for all percy batches on parallel machines
-  percy-batch-id:
-    runs-on: ubuntu-latest
-    # persist job results to other jobs in the workflow
-    outputs:
-      result: ${{ steps.percy-batch-id.outputs.result }}
-    steps:
-      # persist step results to other steps in the job
-      - name: Create Percy Batch ID
-        id: percy-batch-id
-        # adding a timestamp makes the batch id more unique for re-runs
-        run: echo "result=${{ github.run_id }}-$(date +%s)" >> $GITHUB_OUTPUT
-
-  # run cypress against main so we can create Percy baselines with the latest code
-  cypress:
-    name: Website tests
-    runs-on: ubuntu-latest
-    needs: percy-batch-id
-    strategy:
-      fail-fast: false
-      matrix:
-        containers: [1, 2, 3]
-    env:
-      CYPRESS_CACHE_FOLDER: ./node_modules/cypress
-      CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
-      GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-      PERCY_TOKEN: ${{ secrets.PERCY_TOKEN }}
-      USE_CYPRESS_VRT: true
-
-    steps:
-      - name: Checkout Repo
-        uses: actions/checkout@v3
-        with:
-          fetch-depth: 0
-
-      - uses: nrwl/nx-set-shas@v3
-
-      - name: Setup Node.js 20.5
-        uses: actions/setup-node@v3
-        with:
-          node-version: 20.5.x
-
-      - name: Get yarn cache directory path
-        id: yarn-cache-dir-path
-        run: echo "dir=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT
-
-      - name: Percy Batch ID
-        run: echo "${{ needs.percy-batch-id.outputs.result }}"
-
-      - name: Load Yarn cache
-        uses: actions/cache@v3
-        id: yarn_cache_id
-        with:
-          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
-          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
-          restore-keys: |
-            ${{ runner.os }}-yarn
-
-      - name: Node modules cache
-        uses: actions/cache@v3
-        id: node_modules_cache_id
-        with:
-          path: |
-            node_modules
-            */*/node_modules
-          key: ${{ runner.os }}-${{ hashFiles('**/yarn.lock') }}
-
-      - name: Install Dependencies
-        if: steps.yarn_cache_id.outputs.cache-hit != 'true' || steps.node_modules_cache_id.outputs.cache-hit != 'true'
-        run: yarn install --immutable
-
-      - name: Wait for Netlify
-        uses: hharnisc/[email protected]
-        id: waitForDeployment
-        with:
-          site_id: ${{ secrets.NETLIFY_SITE_ID }}
-        env:
-          NETLIFY_TOKEN: ${{ secrets.NETLIFY_TOKEN }}
-
-      - name: Cypress run with site VRT
-        uses: cypress-io/github-action@v4
-        with:
-          record: true
-          parallel: true
-          group: "Paste Actions with VRT Parallel"
-          config: baseUrl=${{ steps.waitForDeployment.outputs.url }}
-          # enabled percy to run cypress for VRT
-          command-prefix: "percy exec --parallel -- npx"
-        env:
-          PERCY_PARALLEL_NONCE: ${{ needs.percy-batch-id.outputs.result }}
-          PERCY_PARALLEL_TOTAL: 3
-          CYPRESS_BASE_URL: ${{ steps.waitForDeployment.outputs.url }}

.github/workflows/on_pull_request_cypress.yml

@@ -31,11 +31,21 @@ jobs:
       CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
       GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
       PERCY_TOKEN: ${{ secrets.PERCY_TOKEN }}
+      AIRTABLE_APIKEY: ${{ secrets.AIRTABLE_APIKEY }}
+      AIRTABLE_BASEID: ${{ secrets.AIRTABLE_BASEID }}
+      OPENAI_API_KEY: ${{ secrets.OPENAI_API_KEY }}
+      CYPRESS_BASE_URL: http://localhost:3000
+      SUPABASE_KEY: ${{ secrets.SUPABASE_STAGING_KEY }}
+      SUPABASE_URL: ${{ secrets.SUPABASE_STAGING_URL }}
       USE_CYPRESS_VRT: false
 
     steps:
       - name: Checkout Repo
         uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+
+      - uses: nrwl/nx-set-shas@v3
 
       - name: Setup Node.js 20.5
         uses: actions/setup-node@v3
@@ -46,9 +56,6 @@ jobs:
         id: yarn-cache-dir-path
         run: echo "dir=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT
 
-      - name: Percy Batch ID
-        run: echo "${{ needs.percy-batch-id.outputs.result }}"
-
       - name: Load Yarn cache
         uses: actions/cache@v3
         id: yarn_cache_id
@@ -71,37 +78,36 @@ jobs:
         if: steps.yarn_cache_id.outputs.cache-hit != 'true' || steps.node_modules_cache_id.outputs.cache-hit != 'true'
         run: yarn install --immutable
 
-      - name: Wait for Netlify
-        uses: hharnisc/[email protected]
-        id: waitForDeployment
-        with:
-          site_id: ${{ secrets.NETLIFY_SITE_ID }}
-        env:
-          NETLIFY_TOKEN: ${{ secrets.NETLIFY_TOKEN }}
+      - name: Build packages
+        run: yarn build
+
+      - name: Percy Batch ID
+        run: echo "${{ needs.percy-batch-id.outputs.result }}"
 
       - name: Cypress run
         uses: cypress-io/github-action@v4
         if: ${{ !contains(github.event.pull_request.labels.*.name, '🕵🏻‍♀️ Run website visual regression') }}
         with:
           record: true
           parallel: true
+          start: yarn start:website
+          wait-on: "http://localhost:3000"
           group: "Paste Actions Parallel"
-          config: baseUrl=${{ steps.waitForDeployment.outputs.url }}
-        env:
-          CYPRESS_BASE_URL: ${{ steps.waitForDeployment.outputs.url }}
+          config: baseUrl=http://localhost:3000
 
       - name: Cypress run with site VRT
         uses: cypress-io/github-action@v4
         if: ${{ contains(github.event.pull_request.labels.*.name, '🕵🏻‍♀️ Run website visual regression') }}
         with:
           record: true
           parallel: true
+          start: yarn start:website
+          wait-on: "http://localhost:3000"
           group: "Paste Actions with VRT Parallel"
-          config: baseUrl=${{ steps.waitForDeployment.outputs.url }}
+          config: baseUrl=http://localhost:3000
           # enabled percy to run cypress for VRT
           command-prefix: "percy exec --parallel -- npx"
         env:
           USE_CYPRESS_VRT: true
           PERCY_PARALLEL_NONCE: ${{ needs.percy-batch-id.outputs.result }}
           PERCY_PARALLEL_TOTAL: 3
-          CYPRESS_BASE_URL: ${{ steps.waitForDeployment.outputs.url }}