build: align tooling with s2-foundations branch

Author: castastrophe

.github/workflows/development.yml

@@ -85,13 +85,15 @@ jobs:
             styles_modified_files: ${{ steps.changed-files.outputs.styles_modified_files }}
             eslint_added_files: ${{ steps.changed-files.outputs.eslint_added_files }}
             eslint_modified_files: ${{ steps.changed-files.outputs.eslint_modified_files }}
+            plugins_modified_files: ${{ steps.changed-files.outputs.plugins_modified_files }}
+            plugins_added_files: ${{ steps.changed-files.outputs.plugins_added_files }}
         permissions:
             pull-requests: read
 
         steps:
             - name: Get changed files
               id: changed-files
-              uses: tj-actions/changed-files@v44
+              uses: tj-actions/changed-files@v45
               with:
                   files_yaml: |
                       styles:
@@ -100,6 +102,8 @@ jobs:
                         - components/*/themes/express.css
                       eslint:
                         - components/*/stories/*.js
+                      plugins:
+                        - plugins/**/*
 
     # -------------------------------------------------------------
     # Lint pre-compiled assets for consistency
@@ -116,6 +120,49 @@ jobs:
             eslint_modified_files: ${{ needs.changed_files.outputs.eslint_modified_files }}
         secrets: inherit
 
+    # -------------------------------------------------------------
+    # Run the test suites for the plugins if there are changes
+    # to any of the plugin files
+    # -------------------------------------------------------------
+    plugin_tests:
+        name: Plugin tests
+        runs-on: ubuntu-latest
+        needs: [changed_files]
+        if: ${{ needs.changed_files.outputs.plugins_added_files != '' || needs.changed_files.outputs.plugins_modified_files != '' }}
+        steps:
+            - name: Check out code
+              uses: actions/checkout@v4
+
+            - name: Use Node LTS version
+              uses: actions/setup-node@v4
+              with:
+                  node-version: 20
+                  cache: yarn
+
+            - name: Enable Corepack
+              run: corepack enable
+
+            ## --- YARN CACHE --- ##
+            - name: Check for cached dependencies
+              continue-on-error: true
+              id: cache-dependencies
+              uses: actions/cache@v4
+              with:
+                  path: |
+                      .cache/yarn
+                      node_modules
+                  key: ubuntu-latest-node20-${{ hashFiles('yarn.lock') }}
+
+            ## --- INSTALL --- ##
+            # If statement isn't needed here b/c yarn will leverage the cache if it exists
+            - name: Install dependencies
+              shell: bash
+              run: yarn install --immutable
+
+            ## --- Run plugins test suites --- ##
+            - name: Run plugin tests
+              run: yarn test:plugins
+
     # -------------------------------------------------------------
     # RUN VISUAL REGRESSION TESTS --- #
     # Run VRT on:
@@ -142,14 +189,8 @@ jobs:
     # -------------------------------------------------------------
     publish_site:
         name: Publish
-        # The build step ensures we are leveraging the cache for the build
-        needs: [vrt]
-        # Note: the goal here is to allow vrt to be skipped but still require the build to succeed
-        if: ${{ always() }}
         uses: ./.github/workflows/publish-site.yml
         with:
             deploy-message: ${{ github.event.pull_request.title }}
             alias: pr-${{ github.event.number }}
-            # Only pass the storybook url if the vrt was successful
-            storybook-url: ${{ needs.vrt.outputs.storybook-url || '' }}
         secrets: inherit

.github/workflows/lint.yml

@@ -76,25 +76,31 @@ jobs:
               shell: bash
               run: yarn install --immutable
 
+              # Components must be built before linting so that the custom properties are available
+              # in the dependencies for passthrough and token verification
+            - name: Build components & ui-icons
+              shell: bash
+              run: yarn build
+
             - name: Lint component styles
               if: ${{ inputs.styles_added_files != '' || inputs.styles_modified_files != '' }}
-              uses: reviewdog/action-stylelint@v1.18.1
+              uses: reviewdog/action-stylelint@v1.30.0
               with:
-                  fail_on_error: true
-                  level: error
-                  reporter: github-pr-check
+                  fail_level: error
                   filter_mode: diff_context
+                  level: error
+                  reporter: github-pr-review
                 #   stylelint_input: "components/*/index.css components/*/themes/*.css"
                   stylelint_input: "${{ inputs.styles_added_files }} ${{ inputs.styles_modified_files }}"
                   stylelint_config: stylelint.config.js
 
             - name: Run eslint on packages and stories
-              uses: reviewdog/action-eslint@v1.20.0
+              uses: reviewdog/action-eslint@v1.33.0
               if: ${{ inputs.eslint_added_files != '' || inputs.eslint_modified_files != '' }}
               with:
-                  fail_on_error: true
+                  fail_level: error
                   level: error
-                  reporter: github-pr-check
+                  reporter: github-pr-review
                   filter_mode: diff_context
                 #   eslint_flags: "components/*/stories/*.js"
                   eslint_flags: "${{ inputs.eslint_added_files }} ${{ inputs.eslint_modified_files }}"

.github/workflows/production.yml

@@ -7,7 +7,6 @@ name: Build and verify production
     # - Publish the PR branch to Netlify
     # -------------------------------------------------------------
 
-
 on:
     push:
         branches: [main, spectrum-two]
@@ -62,11 +61,7 @@ jobs:
     # -------------------------------------------------------------
     publish_site:
         name: Publish
-        # The build step ensures we are leveraging the cache for the build
-        needs: [vrt]
         uses: ./.github/workflows/publish-site.yml
-        with:
-            storybook-url: ${{ needs.vrt.outputs.storybook-url || '' }}
         secrets: inherit
 
     todo_to_issue:

.github/workflows/publish-site.yml

@@ -12,10 +12,6 @@ on:
             alias:
                 required: false
                 type: string
-            storybook-url:
-                required: false
-                type: string
-                default: ''
     workflow_call:
         inputs:
             deploy-message:
@@ -24,10 +20,6 @@ on:
             alias:
                 required: false
                 type: string
-            storybook-url:
-                required: false
-                type: string
-                default: ''
 
 permissions:
     contents: read
@@ -75,22 +67,14 @@ jobs:
               run: yarn install --immutable
 
             ## --- BUILD --- ##
-            - name: Build docs site
-              shell: bash
-              run: yarn build:site
-              env:
-                CHROMATIC_URL: ${{ inputs.storybook-url }}
-
-            - name: Build storybook site
-              if: ${{ ! inputs.storybook-url }}
+            - name: Build storybook
               shell: bash
-              run: yarn nx run storybook:build:docs
+              run: yarn build:docs
 
             ## --- DEPLOY WEBSITE TO NETLIFY --- ##
             - name: Deploy
               uses: nwtgck/actions-netlify@v3
               with:
-                #   publish-dir: site/dist
                   publish-dir: dist
                   production-branch: main
                   production-deploy: false

.github/workflows/release-snapshot.yml

@@ -0,0 +1,55 @@
+name: Release Snapshot
+
+on:
+  workflow_dispatch:
+    inputs:
+      tag:
+        description: "Tag used on changeset version and npm package"
+        required: false
+        type: string
+
+jobs:
+  get-snapshot-tag:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      id-token: write
+    steps:
+      - name: Split branch name
+        id: split
+        env:
+          BRANCH: ${{ github.ref_name }}
+        run: echo "fragment=${BRANCH##*snapshot-}" >> $GITHUB_OUTPUT
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+      - name: Get last author info
+        id: author
+        run: |
+          echo "authorName=$(git log -1 --pretty=format:'%an')" >> $GITHUB_OUTPUT
+          echo "authorEmail=$(git log -1 --pretty=format:'%ae')" >> $GITHUB_OUTPUT
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 18
+          cache: yarn
+      - name: Install Dependencies
+        run: yarn install --frozen-lockfile
+      - name: Create snapshot release and publish to npm
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+          SNAPSHOT_TAG: ${{ inputs.tag || steps.split.outputs.fragment }}
+          USERNAME: ${{ steps.author.outputs.authorName }}
+          EMAIL: ${{ steps.author.outputs.authorEmail }}
+        run: |
+            yarn changeset version --snapshot $SNAPSHOT_TAG && yarn --mode="update-lockfile"
+            yarn ci
+            git config --global user.name "$USERNAME"
+            git config --global user.email "$EMAIL"
+            git add .
+            git commit -m "chore: snapshot release $SNAPSHOT_TAG"
+            npm set //registry.npmjs.org/:_authToken=$NPM_TOKEN
+            yarn changeset publish --tag $SNAPSHOT_TAG
+            git push origin HEAD
+            git push --tags

.github/workflows/release.yml

@@ -5,6 +5,7 @@ on:
     branches:
       - main
       - spectrum-two
+      - s2-foundations-redux
 
 concurrency: ${{ github.workflow }}-${{ github.ref }}
 

.github/workflows/vrt.yml

@@ -1,6 +1,11 @@
 name: Visual regression testing
 
 on:
+    push:
+      branches:
+        - main
+        - "!changeset-release/**"
+        - "!dependabot/**"
     workflow_dispatch:
     workflow_call:
         inputs:
@@ -20,12 +25,12 @@ permissions:
 
 jobs:
     vrt:
+        if: ${{!startsWith(github.ref, 'refs/heads/dependabot/') && !startsWith(github.ref, 'refs/heads/changeset-release/') }}
         name: Chromatic
         runs-on: ubuntu-latest
         timeout-minutes: 20
         outputs:
-            storybook-url: ${{ steps.chromatic.outputs.storybookUrl != 'undefined' && steps.chromatic.outputs.storybookUrl || '' }}
-
+          storybook-url: ${{ steps.chromatic.outputs.storybookUrl != 'undefined' && steps.chromatic.outputs.storybookUrl || '' }}
         steps:
             - name: Check out code
               uses: actions/checkout@v4
@@ -59,7 +64,7 @@ jobs:
 
             - name: Publish to Chromatic
               id: chromatic
-              uses: chromaui/action@v11
+              uses: chromaui/action@latest
               with:
                   projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
                   buildScriptName: ci:storybook
@@ -68,7 +73,8 @@ jobs:
                   exitOnceUploaded: true
                   onlyChanged: true
                   traceChanged: true
-                  untraced: ".github/actions/*/package.json site/package.json generator/package.json"
+                  untraced: ".github/actions/*/package.json generator/package.json"
                   diagnostics: true
+                  autoAcceptChanges: "main"
                   # Lets VRT pass without running so as not to waste snapshots
                   skip: ${{ inputs.skip }}

.gitignore

@@ -1,6 +1,9 @@
 dist
-dist-site
-!tokens/dist
+!tokens/dist/index.css
+!tokens/dist/css/*.css
+
+# Not committing the map assets, these are dev-only
+*.map
 
 # Recommended update re:https://docs.netlify.com/integrations/frameworks/eleventy/
 **/node_modules/**

.husky/commit-msg

@@ -1,4 +1 @@
-#!/usr/bin/env sh
-. "$(dirname -- "$0")/_/husky.sh"
-
 yarn commitlint --edit $1

.husky/pre-commit

@@ -1,4 +1 @@
-#!/usr/bin/env sh
-. "$(dirname -- "$0")/_/husky.sh"
-
 yarn lint-staged --allow-empty --config lint-staged.config.js