add chromatic to ci

Author: tariknz

.github/workflows/ci.yml

@@ -55,6 +55,11 @@ jobs:
         name: coverage-report
         path: coverage 
 
+    - name: Run Chromatic
+      run: npm run chromatic
+      env:
+        CHROMATIC_PROJECT_TOKEN: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
+    
     - name: Check if version changed
       id: check_version
       shell: pwsh

package-lock.json

@@ -19,7 +19,8 @@
     "lint": "eslint --ext .ts,.tsx .",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
-    "test": "vitest --coverage"
+    "test": "vitest --coverage",
+    "chromatic": "npx chromatic"
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^3.2.2",
@@ -54,6 +55,7 @@
     "@vitejs/plugin-react": "^4.3.4",
     "@vitest/coverage-v8": "^3.0.9",
     "autoprefixer": "^10.4.20",
+    "chromatic": "^12.0.0",
     "dotenv": "^16.4.5",
     "electron": "35.1.2",
     "eslint": "^9.23.0",