Merge pull request #10 from IT4Change/chromatic

feat(frontend): chromatic + workflow

.github/workflows/frontend.deploy.chromatic.yml

@@ -0,0 +1,19 @@
+name: "frontend:deploy:chromatic"
+on:
+  push:
+    branches:
+      - master
+jobs:
+  build-and-deploy:
+    name: Chromatic - Frontend
+    runs-on: ubuntu-latest
+    env:
+      CHROMATIC_PROJECT_TOKEN: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+
+      - name: Frontend | Build
+        run: npm install && npm run chromatic -- --exit-zero-on-changes

.gitignore

@@ -4,4 +4,5 @@ coverage/
 !.storybook/
 !.vuepress/
 .vuepress/.temp/
-.vuepress/.cache/
+.vuepress/.cache/
+build-storybook.log

README.md

@@ -68,6 +68,20 @@ Docker can be run in production mode:
 docker compose -f docker-compose.yml up
 ```
 
+### Chromatic
+
+In order to use the chromatic workflow you need to provide a `CHROMATIC_PROJECT_TOKEN` in the repository secrets.
+
+If you want to run chromatic from the command line you either have to provide this variable as well
+```bash
+export CHROMATIC_PROJECT_TOKEN=...
+npm run chromatic
+```
+or you have to append it via parameter:
+```bash
+npm run chromatic -- --project-token=...
+```
+
 ## Endpoints
 
 The following endpoints are provided given the right command is executed or all three if `docker compose` is used:

package.json

@@ -51,7 +51,8 @@
     "test:unit:dev": "vitest",
     "test": "npm run test:lint && npm run test:unit",
     "docs:dev": "vuepress dev .",
-    "docs:build": "vuepress build ."
+    "docs:build": "vuepress build .",
+    "chromatic": "npx chromatic --build-script-name storybook:build"
   },
   "dependencies": {
     "@intlify/unplugin-vue-i18n": "^1.5.0",
@@ -92,6 +93,7 @@
     "@vitest/coverage-v8": "^0.34.6",
     "@vue/test-utils": "^2.4.2",
     "@vuepress/bundler-vite": "^2.0.0-rc.0",
+    "chromatic": "^9.1.0",
     "eslint": "^8.53.0",
     "eslint-config-prettier": "^9.0.0",
     "eslint-config-standard": "^17.1.0",