diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml new file mode 100644 index 0000000..aafa2e6 --- /dev/null +++ b/.github/workflows/chromatic.yml @@ -0,0 +1,27 @@ +# Name of our action +name: "Chromatic" +# The event that will trigger the action +on: push + +# What the action will do +jobs: + test: + # The operating system it will run on + runs-on: ubuntu-latest + # The list of steps that the action will go through + steps: + - uses: actions/checkout@v2 + with: + #👇 Fetches all history so Chromatic can compare against previous builds + fetch-depth: 0 + - uses: actions/setup-node@v3 + with: + #👇 Sets the version of Node.js to use + node-version: 16 + - run: yarn + #👇 Adds Chromatic as a step in the workflow + - uses: chromaui/action@v1 + # Options required for Chromatic's GitHub Action + with: + #👇 Chromatic projectToken, see https://storybook.js.org/tutorials/design-systems-for-developers/react/en/review/ to obtain it + projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }} diff --git a/package.json b/package.json index 48889e7..dea70ea 100644 --- a/package.json +++ b/package.json @@ -25,7 +25,8 @@ "test": "react-scripts test", "eject": "react-scripts eject", "storybook": "storybook dev -p 6006", - "build-storybook": "storybook build" + "build-storybook": "storybook build", + "chromatic": "npx chromatic --project-token=chpt_9acad79f015c66e" }, "eslintConfig": { "extends": [ @@ -57,6 +58,7 @@ "@storybook/react": "^8.2.9", "@storybook/react-webpack5": "^8.2.9", "@storybook/test": "^8.2.9", + "chromatic": "^11.7.1", "eslint-plugin-storybook": "^0.8.0", "prop-types": "^15.8.1", "storybook": "^8.2.9", diff --git a/yarn.lock b/yarn.lock index 41cd65c..dc356d5 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4163,7 +4163,7 @@ chownr@^2.0.0: resolved "https://registry.yarnpkg.com/chownr/-/chownr-2.0.0.tgz#15bfbe53d2eab4cf70f18a8cd68ebe5b3cb1dece" integrity sha512-bIomtDF5KGpdogkLd9VspvFzk9KfpyyGlS8YFVZl7TGPBHL5snIOnxeshwVgPteQ9b4Eydl+pVbIyE1DcvCWgQ== -chromatic@^11.4.0: +chromatic@^11.4.0, chromatic@^11.7.1: version "11.7.1" resolved "https://registry.yarnpkg.com/chromatic/-/chromatic-11.7.1.tgz#9de59dd9d0e2a847627bccd959f05881335b524e" integrity sha512-LvgPimdQdnQB07ZDxLEC2KtxgYeqTw0X71GA7fi3zhgtKLxZcE+BSZ/5I9rrQp1V8ydmfElfw0ZwnUH4fVgUAQ==