feat(ci): Migrate Storybook CircleCI jobs to GH Actions (#5102)

Dottenpixel · web-flow · commit 8a3857f57880 · 2022-11-16T16:54:15.000-08:00
* clean up vrt bits from CircleCI config

* make init and prepare jobs

* make build-storybook job

* make publish-storybook job

* remove storybook jobs from CircleCI config

* fix deployments step
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -4,17 +4,6 @@
 #
 version: 2.1
 
-parameters:
-  run_labeled_workflow:
-    type: boolean
-    default: false
-  triggering_label:
-    type: string
-    default: ""
-  vrt_mode:
-    type: string
-    default: ""
-
 orbs:
   node: circleci/node@4.7.0
   heroku: circleci/heroku@1.2.2
@@ -107,57 +96,6 @@ commands:
             echo "=============================="
             echo
 
-  prepare-vrt:
-    description: 'Prepare VRT environment'
-    steps:
-      - checkout
-
-      - attach_workspace:
-          at: workspace
-
-      - node/install-npm
-      - vrt-set-env-vars
-      - add-applitools
-      - node/install-packages
-      - browser-tools/install-chrome
-      - browser-tools/install-chromedriver
-
-      - run:
-          name: 'Prepare Storybook'
-          command: 'npm run storybook:prepare'
-
-  vrt-set-env-vars:
-    description: 'Set VRT environment variables'
-    steps:
-      - set-github-pr-number
-      - run: printenv | sort
-
-      - run:
-          name: 'Set environment variables'
-          command: |
-            echo 'export APPLITOOLS_BATCH_ID=${CIRCLE_SHA1}' >> $BASH_ENV
-            echo 'export APPLITOOLS_BATCH_NAME="PR #${PR_NUMBER} (${CIRCLE_USERNAME})"' >> $BASH_ENV
-            echo 'export APPLITOOLS_DONT_CLOSE_BATCHES="true"' >> $BASH_ENV
-            echo 'export APPLITOOLS_BATCH_NOTIFY="true"' >> $BASH_ENV
-            echo 'export REVIEW_APP_NAME=slds-storybook-pr-${PR_NUMBER}' >> $BASH_ENV
-
-  vrt-close-batch:
-    description: 'Notify Applitools that tests have completed'
-    steps:
-      - run:
-          name: 'Applitools: close batch'
-          command: |
-            export GITHUB_SERVER=github.com
-            url="https://salesforceuxeyesapi.applitools.com/api/externals/github/servers/${GITHUB_SERVER}/commit/${CIRCLE_SHA1}/complete?apiKey=${APPLITOOLS_API_KEY}"
-            curl -X POST $url -H "Content-Type: application/json" --data "{'serverId': '${GITHUB_SERVER}', 'commitSha': '${CIRCLE_SHA1}'}" -v -L
-
-  add-applitools:
-    description: 'Add Applitools eyes-storybook module'
-    steps:
-      - run:
-          name: Add Applitools eyes-storybook module
-          command: 'npm i @applitools/eyes-storybook@latest --save-dev --package-lock-only'
-
   get-pr-number:
     description: 'Get Github pull-request number'
     steps:
@@ -195,23 +133,6 @@ commands:
               fi
             fi
 
-  launch-static-storybook:
-    description: 'Launch local static Storybook server'
-    steps:
-      - attach_workspace:
-          at: workspace
-      - run:
-          name: Decompress Storybook archive
-          command: 'tar -xvf workspace/storybook.tar.gz'
-      - run:
-          name: Start server
-          command: 'npx http-server .www'
-          background: true
-      - run:
-          name: Poll until server is up
-          shell: /bin/sh
-          command: 'curl --connect-timeout 2 --max-time 2 --retry 50 --retry-delay 0 --retry-max-time 300 --retry-connrefused --ipv4 -q "http://localhost:8080"'
-
 jobs:
   # Init bits & bobs subsequent jobs require
   init:
@@ -228,6 +149,7 @@ jobs:
           name: Retrieve Github deployments
           command: |
             gh api /repos/salesforce-ux/design-system-internal/deployments --field ref=${CIRCLE_SHA1} --method GET | jq "map({ status: .statuses_url, url: .payload.web_url})" > workspace/gh-deployments.json
+            cat workspace/gh-deployments.json
 
       - run:
           name: Set Github deployments to "in progress"
@@ -373,86 +295,6 @@ jobs:
                 "salesforce_version": "'"$SALESFORCE_VERSION"'"
             }'
 
-  # Build static Storybook
-  build-storybook:
-    executor: slds-executor
-    resource_class: medium+
-
-    steps:
-      - checkout
-      - attach_workspace:
-          at: workspace
-      - copy-tokens-from-workspace
-      - node/install-npm
-      - node/install-packages:
-          # version cache here to remove conflict between this job and other concurrent jobs (init, prepare, etc).
-          cache-version: standard
-
-      - run:
-          name: Build static Storybook
-          command: 'npm run storybook:build'
-          environment:
-            NODE_OPTIONS: --openssl-legacy-provider
-
-      - run:
-          name: Archive static Storybook
-          command: 'tar -czvf workspace/storybook.tar.gz .www/ Procfile config/nginx.conf.erb heroku-start.sh app.json'
-
-      - persist_to_workspace:
-          root: workspace
-          paths:
-            - storybook.tar.gz
-
-  # Publish Storybook to Heroku review app
-  publish-storybook:
-    executor: slds-executor
-    resource_class: small
-
-    steps:
-      - attach_workspace:
-          at: workspace
-
-      - run:
-          name: 'Only proceed if we have a Storybook app to update'
-          command: |
-            export HEROKU_RELEASE_STORYBOOK_APP_NAME=$(cat workspace/heroku-release-storybook-app-name.txt)
-            if [[ ${HEROKU_RELEASE_STORYBOOK_APP_NAME} == "false" ]]; then
-            circleci step halt
-            fi
-
-      - vrt-set-env-vars
-
-      # Heroku
-      - heroku/install
-      - run:
-          name: 'Install Heroku Build CLI plugin'
-          command: 'heroku plugins:install heroku-builds'
-
-      - run:
-          name: 'Deploy to Heroku'
-          command: |
-            export HEROKU_RELEASE_STORYBOOK_APP_NAME=$(cat workspace/heroku-release-storybook-app-name.txt)
-            if [[ ${HEROKU_RELEASE_STORYBOOK_APP_NAME} != "false" &&  ${PR_NUMBER} == "" ]]; then
-            export PUBLISH_STORYBOOK_TO=${HEROKU_RELEASE_STORYBOOK_APP_NAME}
-            else
-            export PUBLISH_STORYBOOK_TO=${REVIEW_APP_NAME}
-            fi
-            echo "=============================="
-            echo ${PUBLISH_STORYBOOK_TO}
-            echo "=============================="
-            heroku buildpacks -a ${PUBLISH_STORYBOOK_TO} | grep "https://github.com/salesforce-ux/heroku-buildpack-nginx.git#dse" || heroku buildpacks:set https://github.com/salesforce-ux/heroku-buildpack-nginx.git#dse -a ${PUBLISH_STORYBOOK_TO}
-            heroku builds:create --source-tar workspace/storybook.tar.gz -a ${PUBLISH_STORYBOOK_TO}
-
-      - gh/install
-      - run:
-          name: Set Github deployments to "success"
-          command: |
-            for row in $(jq -r '.[] | select(.url | contains("storybook")) | @base64' workspace/gh-deployments.json); do
-              export STATUS_URL=$(echo ${row} | base64 --decode | jq -r ".status" | sed 's/https:\/\/api.github.com//')
-              export SITE_URL=$(echo ${row} | base64 --decode | jq -r ".url")
-              gh api ${STATUS_URL} -f state=success -f environment_url=${SITE_URL} -H "Accept: application/vnd.github.ant-man-preview+json"
-            done
-
   # Build & publish SLDS site (review app or upcoming/core-main/core-patch)
   publish-site:
     executor: slds-executor
@@ -538,18 +380,6 @@ workflows:
               only: /.*/
           requires:
             - init
-      - build-storybook:
-          context: ux-eng-keys
-          # do not run for future version tags (X.X.X-*)
-          filters:
-            tags:
-              ignore: /^v\d+\.\d+\.\d+-.+$/
-          requires:
-            - prepare
-      - publish-storybook:
-          context: ux-eng-keys
-          requires:
-            - build-storybook
       - framework-build:
           context: ux-eng-keys
           requires:
diff --git a/.github/actions/build-tokens/action.yml b/.github/actions/build-tokens/action.yml
@@ -0,0 +1,7 @@
+name: build-tokens
+runs:
+  using: composite
+  steps:
+  - name: Build Tokens
+    run: npm run gulp -- generate:tokens:all
+    shell: bash
diff --git a/.github/actions/copy-tokens-from-workspace/action.yml b/.github/actions/copy-tokens-from-workspace/action.yml
@@ -0,0 +1,7 @@
+name: copy-tokens-from-workspace
+runs:
+  using: composite
+  steps:
+  - name: Decompress design-tokens
+    run: tar -xvf workspace/artifact/design-tokens.tar
+    shell: bash
diff --git a/.github/actions/copy-tokens-to-workspace/action.yml b/.github/actions/copy-tokens-to-workspace/action.yml
@@ -0,0 +1,7 @@
+name: copy-tokens-to-workspace
+runs:
+  using: composite
+  steps:
+  - name: Compress design-tokens
+    run: tar -cvf workspace/design-tokens.tar design-tokens/
+    shell: bash
diff --git a/.github/actions/set-heroku-app-name/action.yml b/.github/actions/set-heroku-app-name/action.yml
@@ -0,0 +1,65 @@
+name: set-heroku-app-name
+outputs:
+  HEROKU_APP_NAME:
+    value: ${{ steps.which-app.outputs.HEROKU_APP_NAME }}
+  HEROKU_RELEASE_STORYBOOK_APP_NAME:
+    value: ${{ steps.which-app.outputs.HEROKU_RELEASE_STORYBOOK_APP_NAME }}
+runs:
+  using: composite
+  steps:
+  - name: Set which app to deploy to on Heroku
+    id: which-app
+    # if on default branch without a tag
+    #   then publish to UPCOMING
+    #
+    # if on default branch and tag of X.X.X-*
+    #   then publish to CORE-MAIN
+    #
+    # if on any branch and tag of X.X.X
+    #   then publish to CORE-PATCH
+    #
+    # All other cases publish to the review app
+    run: |-
+      export CURRENT_DEFAULT_BRANCH=`git remote show origin | grep "HEAD branch" | cut -d ":" -f 2 | xargs`
+      echo 'HEROKU_RELEASE_STORYBOOK_APP_NAME=false' >> $GITHUB_OUTPUT
+      if [[ "${{ github.ref }}" = "${CURRENT_DEFAULT_BRANCH}" ]] ; then
+        echo "Publishing to UPCOMING..."
+        echo 'HEROKU_APP_NAME=${HEROKU_APP_UPCOMING}' >> $GITHUB_OUTPUT
+        echo 'HEROKU_RELEASE_STORYBOOK_APP_NAME=storybook-upcoming' >> $GITHUB_OUTPUT
+      elif [[ ${{ github.ref }} =~ ^v[0-9]+\.[0-9]+\.[0-9]+-.+$ ]] ; then
+        echo "Publishing to CORE-MAIN..."
+        echo 'HEROKU_APP_NAME=${HEROKU_APP_CORE_MAIN}' >> $GITHUB_OUTPUT
+        echo 'HEROKU_RELEASE_STORYBOOK_APP_NAME=storybook-core-main' >> $GITHUB_OUTPUT
+      elif [[ ${{ github.ref }} =~ ^v[0-9]+\.[0-9]+\.[0-9]+$ ]] ; then
+        echo "Publishing to CORE-PATCH..."
+        echo 'HEROKU_APP_NAME=${HEROKU_APP_CORE_PATCH}' >> $GITHUB_OUTPUT
+        echo 'HEROKU_RELEASE_STORYBOOK_APP_NAME=storybook-core-patch' >> $GITHUB_OUTPUT
+      else
+        echo "Publishing to pull-request review app..."
+        echo 'HEROKU_APP_NAME=slds-review-site-pr-${{ github.event.pull_request.number }}' >> $GITHUB_OUTPUT
+        echo 'HEROKU_RELEASE_STORYBOOK_APP_NAME=true' >> $GITHUB_OUTPUT
+      fi
+    shell: bash
+  - run: printenv | sort
+    shell: bash
+  - run: |-
+      HEROKU_APP_NAME=${{ steps.which-app.outputs.HEROKU_APP_NAME }}
+      HEROKU_RELEASE_STORYBOOK_APP_NAME=${{ steps.which-app.outputs.HEROKU_RELEASE_STORYBOOK_APP_NAME }}
+      echo $HEROKU_APP_NAME > workspace/heroku-app-name.txt
+      echo $HEROKU_RELEASE_STORYBOOK_APP_NAME > workspace/heroku-release-storybook-app-name.txt
+    shell: bash
+  - name: Show HEROKU_APP_NAME value
+    run: |-
+      echo
+      echo "PR_NUMBER = ${{ github.event.pull_request.number }}"
+      echo
+      echo "HEROKU_APP_NAME=============================="
+      cat workspace/heroku-app-name.txt
+      echo "============================================="
+      echo
+      echo
+      echo "HEROKU_RELEASE_STORYBOOK_APP_NAME============"
+      cat workspace/heroku-release-storybook-app-name.txt
+      echo "============================================="
+      echo
+    shell: bash
diff --git a/.github/workflows/storybook.yml b/.github/workflows/storybook.yml
