Try to run screenshot tests in CI (#596)

* Try to run screenshot tests in CI

* Fix script

* Try to fix script again

* Try to fix script again 2

* Try to fix script again 3

Author: ncamera

.github/workflows/install-and-deploy.yml

@@ -19,6 +19,10 @@ on:
         description: "Use cache node modules"
         required: false
         type: boolean
+      tests:
+        description: "Screenshot tests for the design system"
+        required: false
+        type: boolean
 
 jobs:
   install:
@@ -52,6 +56,12 @@ jobs:
         run: yarn
         working-directory: ${{ inputs.package }}
 
+      # Validate the common package, only for Mercury
+      - name: validate (common package)
+        if: ${{ inputs.tests == true }}
+        run: yarn test
+        working-directory: "packages/common"
+
       - name: validate
         run: yarn validate.ci
         working-directory: ${{ inputs.package }}

.github/workflows/node.js.yml

@@ -12,6 +12,7 @@ jobs:
     with:
       node-version: "20.x"
       cache: true
+      tests: false
       publish: false
       package: "packages/unanimo"
 
@@ -20,6 +21,7 @@ jobs:
     with:
       node-version: "20.x"
       cache: true
+      tests: true
       publish: false
       package: "packages/mercury"
 
@@ -28,5 +30,6 @@ jobs:
     with:
       node-version: "20.x"
       cache: true
+      tests: false
       publish: false
       package: "packages/svg-sass-generator"

.github/workflows/npmpublish.yml

@@ -86,6 +86,7 @@ jobs:
     with:
       node-version: "20.x"
       cache: false
+      tests: false
       publish: true
       package: "packages/unanimo"
     secrets: inherit
@@ -97,6 +98,7 @@ jobs:
     with:
       node-version: "20.x"
       cache: false
+      tests: true
       publish: true
       package: "packages/mercury"
     secrets: inherit
@@ -108,6 +110,7 @@ jobs:
     with:
       node-version: "20.x"
       cache: false
+      tests: false
       publish: true
       package: "packages/svg-sass-generator"
     secrets: inherit

packages/common/src/tests/screenshot/compare-images.ts

@@ -82,7 +82,7 @@ export const compareImages = async (
     reader.onerror = reject;
   });
 
-  if (mismatchedPixels !== 0) {
+  if (mismatchedPixels !== 0 && !process.env.CI) {
     await server.commands.writeFile(diffFileName, base64String, {
       encoding: "base64"
     });

packages/common/src/tests/screenshot/screenshot.ts

@@ -234,23 +234,26 @@ export const runScreenshotTest = (
               if (shouldUpdateScreenshotOnMismatch) {
                 return Promise.allSettled([
                   // Replace the expected base64
-                  server.commands.writeFile(
-                    screenshotPaths.base64,
-                    currentScreenshot.base64,
-                    { encoding: "utf-8" }
-                  ),
+                  !process.env.CI &&
+                    server.commands.writeFile(
+                      screenshotPaths.base64,
+                      currentScreenshot.base64,
+                      { encoding: "utf-8" }
+                    ),
 
                   cleanupScreenshots()
                 ]);
               }
 
               // Store the .newBase64 to properly update the expected value
               // if necessary
-              await server.commands.writeFile(
-                screenshotPaths.newBase64,
-                currentScreenshot.base64,
-                { encoding: "utf-8" }
-              );
+              if (!process.env.CI) {
+                await server.commands.writeFile(
+                  screenshotPaths.newBase64,
+                  currentScreenshot.base64,
+                  { encoding: "utf-8" }
+                );
+              }
 
               // Throw the error, otherwise
               assert.fail(
@@ -267,10 +270,13 @@ export const runScreenshotTest = (
 
               if (shouldAddNewScreenshots) {
                 // Replace the expected base64
-                return server.commands.writeFile(
-                  screenshotPaths.base64,
-                  currentScreenshot.base64,
-                  { encoding: "utf-8" }
+                return (
+                  !process.env.CI &&
+                  server.commands.writeFile(
+                    screenshotPaths.base64,
+                    currentScreenshot.base64,
+                    { encoding: "utf-8" }
+                  )
                 );
               }