chore: Enable image-snapshots generation via Github Actions CI (#1831)

Author: Luke Bowerman

.github/pull_request_template.md

@@ -34,7 +34,7 @@ jobs:
 
       - name: Create canary release
         run: |
-          yarn lerna version prerelease --conventional-commits --no-git-tag-version --no-push --preid canary --yes --exact
+          yarn lerna version prerelease --conventional-commits --preid canary --yes --exact
           git config --local user.email "[email protected]"
           git config --local user.name "GitHub Action"
           git commit -am "chore: Publish"

.github/workflows/canary.yml

@@ -12,7 +12,7 @@ jobs:
     name: "Lint: ESLint + Prettier, Stylelint, Typescript"
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v1
+      - uses: actions/checkout@v2
       - uses: c-hive/gha-yarn-cache@v1
       - run: yarn install
       - run: yarn prebuild
@@ -28,7 +28,7 @@ jobs:
     name: "Tests: Jest + RTL"
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v1
+      - uses: actions/checkout@v2
       - uses: c-hive/gha-yarn-cache@v1
       - run : yarn --silent
       - run: yarn test
@@ -41,7 +41,7 @@ jobs:
     name: "Build: ES & Typescript"
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v1
+      - uses: actions/checkout@v2
       - uses: c-hive/gha-yarn-cache@v1
       - run : yarn --silent
       - run: yarn build
@@ -50,7 +50,7 @@ jobs:
     runs-on: ubuntu-latest
     if: github.event.pull_request.draft == false
     steps:
-      - uses: actions/checkout@v1
+      - uses: actions/checkout@v2
       - uses: c-hive/gha-yarn-cache@v1
       - run : yarn --silent
       - run: yarn prebuild
@@ -60,17 +60,36 @@ jobs:
     runs-on: ubuntu-latest
     if: github.event.pull_request.draft == false
     steps:
-      - uses: actions/checkout@v1
+      - uses: actions/checkout@v2
       - uses: c-hive/gha-yarn-cache@v1
       - run : yarn --silent
       - run: yarn prebuild
       - run: yarn workspace storybook build
   image-snapshots:
     name: "Image Snapshots"
-    if: false # Disabled until snapshot issues can be resolved
     runs-on: ubuntu-latest
+    if: github.event.pull_request.draft == false
     steps:
-      - uses: actions/checkout@v1
+      - uses: actions/checkout@v2
+        with:
+          ref: ${{ github.event.pull_request.head.ref }}
       - uses: c-hive/gha-yarn-cache@v1
       - run : yarn --silent
       - run: yarn test:image-snapshots
+        id: snapshots
+    # If snapshots failed, build fresh ones and open a PR to help out our friends
+      - name: Fresh snapshots
+        if: ${{ always() && (steps.snapshots.outcome == 'failure') }}
+        run: yarn test:image-snapshots-update
+        id: snapshots-update
+      - name: Create Pull Request
+        if: ${{ always() && (steps.snapshots-update.outcome == 'success') }}
+        uses: peter-evans/create-pull-request@v3
+        with:
+          commit-message: "chore: image-snapshot updates"
+          branch: "${{ github.event.pull_request.head.ref }}-snapshot-updates"
+          delete-branch: true
+          title: "chore: snapshot-updates for \"${{ github.event.pull_request.title }}\""
+          body: Image snapshot updates for the PR \"${{ github.event.pull_request.title }}\""
+          labels: image-snapshots
+          reviewers: "${{ github.payload.pull_request.sender.login }}"

.github/workflows/ci.yml

@@ -46,15 +46,19 @@
     "lint-staged": "yarn exec lint-staged",
     "pretest": "yarn prebuild",
     "test": "yarn jest",
+
     "storybook": "yarn workspace storybook develop",
     "storybook-docs": "yarn workspace storybook develop-docs",
     "storybook-workspaces-build": "yarn lerna run storybook-build --scope '@looker/*' --stream --parallel",
+
     "storyshots-prep": "export storybookBuildMode=fast && yarn pretest && yarn storybook-workspaces-build",
     "pretest:image-snapshots": "yarn storyshots-prep",
     "test:image-snapshots": "yarn jest --config jest-image-snapshots.config.js",
-    "test:image-snapshots-update": "rm -rf packages/*/snapshots && yarn test:image-snapshots",
+    "test:image-snapshots-update": "rm -rf packages/*/snapshots && yarn jest -u --config jest-image-snapshots.config.js",
+
     "pretest:a11y": "yarn storyshots-prep",
     "test:a11y": "yarn jest --config jest-a11y.config.js",
+
     "website-canary": "./config/website-canary.sh",
     "website-latest": "./config/website-latest.sh"
   },

README.md

@@ -3,3 +3,5 @@
     padding: 0 !important; /* stylelint-disable-line declaration-no-important */
   }
 </style>
+<link rel="preconnect" href="https://fonts.gstatic.com">
+<link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;500;600;700&family=Roboto:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap" rel="stylesheet">