test

.github/actions/frontend/marketing/ui-tests/action.yml

@@ -51,10 +51,3 @@ runs:
         path: frontend/apps/marketing/playwright-report
         name: playwright-report
 
-    - name: Run Google Lighthouse Audits
-      uses: treosh/lighthouse-ci-action@2f8dda6cf4de7d73b29853c3f29e73a01e297bd8
-      with:
-        urls: ${{ inputs.MARKETING_BASE_URL || 'http://localhost:3001' }}/en-US/all-the-things
-        uploadArtifacts: true
-        temporaryPublicStorage: true
-        configPath: './frontend/apps/marketing/.lighthouserc.js'

.github/workflows/component-library-ci.yml

@@ -2,11 +2,6 @@ name: Component-Library-CI
 
 on:
   workflow_call:
-    inputs:
-      eyes-batch-id:
-        description: "The consistent batch id for Eyes to use to reference all eyes tests for this PR"
-        required: true
-        type: string
 
 jobs:
     build:
@@ -79,12 +74,10 @@ jobs:
         run: |
           EYES_REPORT=$(COREPACK_ENABLE_DOWNLOAD_PROMPT=0 yarn eyes-storybook)
           echo "$EYES_REPORT"
-
           # Send multiline report to environment var
           echo "EYES_REPORT<<EOF" >> $GITHUB_OUTPUT
           echo "$EYES_REPORT" >> $GITHUB_OUTPUT
           echo "EOF" >> $GITHUB_OUTPUT
-
           # Check if the report was successful, failing if not.
           if echo "$EYES_REPORT" | grep -q "✅"; then
             echo "✅ Eyes report was successful, exiting with 0"
@@ -93,12 +86,10 @@ jobs:
             echo "❌ Eyes report unsuccessful, exiting with 1"
             exit 1
           fi
-
         working-directory: ./frontend/apps/design-system-storybook
         continue-on-error: ${{ github.event_name == 'pull_request' }}
         env:
           APPLITOOLS_API_KEY: ${{ secrets.APPLITOOLS_API_KEY }}
-          APPLITOOLS_BATCH_ID: ${{ inputs.eyes-batch-id }}
 
       - name: Find Report Comment
         if: github.event.pull_request.number
@@ -122,4 +113,4 @@ jobs:
         with:
           comment-id: ${{ steps.eyes-report-comment.outputs.comment-id }}
           edit-mode: replace
-          body: ${{ steps.eyes.outputs.EYES_REPORT }}
+          body: ${{ steps.eyes.outputs.EYES_REPORT }}

.github/workflows/marketing-app-ci.yml

@@ -8,37 +8,53 @@ on:
     paths:
       - 'frontend/**'
 
+env:
+  APPLITOOLS_BATCH_ID: ${{ github.event.pull_request.head.sha || github.sha }}
+
 jobs:
-  # Generate a UUID that will be used in all eyes tests
-  eyes-uuid:
+  # Initializes common variables and environment prior to executing other jobs
+  setup:
     runs-on: ubuntu-24.04
     outputs:
-      eyes-batch-id: ${{ steps.generate-uuid.outputs.uuid }}
+      eyes-batch-id: ${{ steps.eyes.outputs.batch-id }}
+      component-library-changed: ${{ steps.changes.outputs.component-library }}
     steps:
       - name: Generate Eyes Batch ID
-        id: generate-uuid
-        run: echo "uuid=$(uuidgen)" >> $GITHUB_OUTPUT
+        id: eyes
+        run: echo "batch-id=$APPLITOOLS_BATCH_ID" >> $GITHUB_OUTPUT
+
+      # Determine what changed to later skip workflows
+      # Github Actions does not offer conditional runtime path filtering, thus use this action to calculate the
+      # changes. Root level applications (such as marketing) are not skipped as its dependency tree always changes
+      - name: Get Change Sets
+        uses: dorny/paths-filter@de90cc6fb38fc0963ad72b210f1f284cd68cea36 # v3.0.2
+        id: changes
+        with:
+          filters: |
+            component-library:
+              - 'frontend/packages/component-library/**'
+              - 'frontend/packages/component-library-styles/**'
+              - 'frontend/packages/fonts/**'
+              - 'frontend/*'
 
   marketing:
-    needs: eyes-uuid
+    needs: setup
     uses: ./.github/workflows/orig-marketing-app-ci.yml
     secrets: inherit
-    with:
-      eyes-batch-id: ${{ needs.eyes-uuid.outputs.eyes-batch-id }}
 
   component-library:
-    needs: eyes-uuid
+    if: ${{ needs.setup.outputs.component-library-changed == 'true' }}
+    needs: setup
     uses: ./.github/workflows/component-library-ci.yml
     secrets: inherit
-    with:
-      eyes-batch-id: ${{ needs.eyes-uuid.outputs.eyes-batch-id }}
 
-  eyes-close-batch:
-    # Close the eyes batch after all distributed eyes tests have completed
-    needs: [eyes-uuid, marketing, component-library]
+  teardown:
+    needs: [setup, marketing, component-library]
+    if: always()
     runs-on: ubuntu-24.04
     steps:
+      # Close the eyes batch after all distributed eyes tests have completed
       - name: Update Applitools batch status
         shell: bash
         run: |
-          curl -v -X DELETE "https://eyesapi.applitools.com/api/sessions/batches/${{ needs.eyes-uuid.outputs.eyes-batch-id }}/close/bypointerid?apiKey=${{ secrets.APPLITOOLS_API_KEY }}"
+          curl -X POST "https://eyesapi.applitools.com/api/externals/github/servers/github.com/commit/${{ env.APPLITOOLS_BATCH_ID }}/${{ github.run_id }}/complete?apiKey=${{secrets.APPLITOOLS_API_KEY}}"

.github/workflows/orig-marketing-app-ci.yml

@@ -2,11 +2,6 @@ name: Marketing-CI
 
 on:
   workflow_call:
-    inputs:
-      eyes-batch-id:
-        description: "The consistent batch id for Eyes to use to reference all eyes tests for this PR"
-        required: true
-        type: string
 
 defaults:
   run:
@@ -104,5 +99,11 @@ jobs:
           CONTENTFUL_SPACE_ID: ${{ vars.CONTENTFUL_SPACE_ID }}
           CONTENTFUL_TOKEN: ${{ secrets.CONTENTFUL_TOKEN}}
           APPLITOOLS_API_KEY: ${{ secrets.APPLITOOLS_API_KEY}}
-          APPLITOOLS_BATCH_ID: ${{ inputs.eyes-batch-id }}
 
+      - name: Run Google Lighthouse Audits
+        uses: treosh/lighthouse-ci-action@2f8dda6cf4de7d73b29853c3f29e73a01e297bd8
+        with:
+          urls: ${{ inputs.MARKETING_BASE_URL || 'http://localhost:3001' }}/en-US/all-the-things
+          uploadArtifacts: true
+          temporaryPublicStorage: true
+          configPath: './frontend/apps/marketing/.lighthouserc.js'

frontend/apps/design-system-storybook/applitools.config.cjs

@@ -9,8 +9,8 @@ const isDocker = !!process.env.IS_DOCKER || !!process.env.CI;
 module.exports = {
   concurrency: 5,
   showLogs: !!process.env.APPLITOOLS_SHOW_LOGS,
-  appName: 'Code.org Design System',
-  batchName: 'Component Library',
+  appName: 'Design System',
+  batchName: 'Frontend Eyes Tests',
   dontCloseBatches: true,
   browser: [
     {width: 1200, height: 800, name: 'chrome'},

frontend/apps/marketing/README.md

@@ -1,4 +1,4 @@
-# Code.org Marketing Application
+# Code.org Marketing Application..
 
 ## Getting Started
 

frontend/apps/marketing/playwright.config.ts

@@ -25,17 +25,17 @@ export default defineConfig<EyesFixture>({
     /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
     trace: 'retain-on-failure',
     eyesConfig: {
-      appName: 'Code.org Marketing',
+      appName: 'Marketing',
       matchLevel: 'Strict',
       // Runner type: 'ufg' for Ultrafast Grid, 'classic' for Classic runner
       type: 'classic',
       batch: {
-        name: 'Marketing',
+        name: 'Frontend Eyes Tests',
         id: process.env.APPLITOOLS_BATCH_ID,
         notifyOnCompletion: false,
       },
       sendDom: true,
-      failTestsOnDiff: 'afterEach',
+      failTestsOnDiff: 'afterAll',
       branchName: 'staging',
       // Additional configuration options...
     },

frontend/packages/component-library-styles/README.md

@@ -1,4 +1,4 @@
-## Updating FontAwesome Files
+## Updating FontAwesome Files.
 
 If you are looking to update the FontAwesome files in `font.scss`, you'll need to do the following: