chore: add a base directory for TurboSnap (#9258)

ethriel3695 · web-flow · commit 868ae06d4e69 · 2023-08-23T15:12:00.000-03:00
* Add base dir for TurboSnap

* updated main workflow as well

* Add vite configuration

* remove the mergeConfig and return config
diff --git a/.github/workflows/ci.yaml b/.github/workflows/ci.yaml
@@ -568,6 +568,7 @@ jobs:
           # https://www.chromatic.com/docs/github-actions#forked-repositories
           projectToken: 695c25b6cb65
           workingDir: "./site"
+          storybookBaseDir: "./site"
           # Prevent excessive build runs on minor version changes
           skip: "@(renovate/**|dependabot/**)"
           # Run TurboSnap to trace file dependencies to related stories
@@ -593,6 +594,7 @@ jobs:
           buildScriptName: "storybook:build"
           projectToken: 695c25b6cb65
           workingDir: "./site"
+          storybookBaseDir: "./site"
           # Run TurboSnap to trace file dependencies to related stories
           # and tell chromatic to only take snapshots of relevent stories
           onlyChanged: true
diff --git a/site/.storybook/main.js b/site/.storybook/main.js
@@ -1,3 +1,6 @@
+import turbosnap from "vite-plugin-turbosnap"
+import { mergeConfig } from "vite"
+
 module.exports = {
   stories: ["../src/**/*.stories.tsx"],
   addons: [
@@ -11,4 +14,17 @@ module.exports = {
     name: "@storybook/react-vite",
     options: {},
   },
+  async viteFinal(config, { configType }) {
+    config.plugins = config.plugins || []
+    // return the customized config
+    if (configType === "PRODUCTION") {
+      // ignore @ts-ignore because it's not in the vite types yet
+      config.plugins.push(
+        turbosnap({
+          rootDir: config.root || "",
+        }),
+      )
+    }
+    return config
+  },
 }
diff --git a/site/package.json b/site/package.json
@@ -21,7 +21,7 @@
     "playwright:test": "playwright test --config=e2e/playwright.config.ts",
     "gen:provisioner": "protoc --plugin=./node_modules/.bin/protoc-gen-ts_proto --ts_proto_out=./e2e/ --ts_proto_opt=outputJsonMethods=false,outputEncodeMethods=encode-no-creation,outputClientImpl=false,nestJs=false,outputPartialMethods=false,fileSuffix=Generated,suffix=hey -I ../provisionersdk/proto ../provisionersdk/proto/provisioner.proto && pnpm exec prettier --ignore-path '/dev/null' --cache --write './e2e/provisionerGenerated.ts'",
     "storybook": "STORYBOOK=true storybook dev -p 6006",
-    "storybook:build": "storybook build --webpack-stats-json",
+    "storybook:build": "storybook build",
     "test": "jest --selectProjects test",
     "test:ci": "jest --selectProjects test --silent",
     "test:coverage": "jest --selectProjects test --collectCoverage",
@@ -172,7 +172,8 @@
     "ts-node": "10.9.1",
     "ts-proto": "1.156.0",
     "typescript": "5.1.6",
-    "vite-plugin-checker": "0.6.0"
+    "vite-plugin-checker": "0.6.0",
+    "vite-plugin-turbosnap": "1.0.2"
   },
   "browserslist": [
     "chrome 66",
diff --git a/site/pnpm-lock.yaml b/site/pnpm-lock.yaml
