Chromatic CLI
Publishes your Storybook to Chromatic and kicks off tests if they're enabled.
Documentation
next
version
Using a From time to time we pre-publish a next
version of the package to test new features. To use the
next branch you can either:
npx
Using Change your script to use the next
dist-tag:
npx chromatic@next --project-token ...
package.json
Using a dependency in Update to the latest next
version with:
yarn add --dev chromatic@next
# or
npm i --save-dev chromatic@next
Using the github action
Use our chromatic-next
action:
- uses: chromaui/action-next@v1
Contributing
Contributions of any kind are welcome! We're available to chat via the Intercom widget on the documentation site.
Compatibility & versioning
Compatibility is guaranteed between this package and Chromatic like so:
- Production Chromatic ensures itโs compatible with whatโs on npm
- What's on the main branch is equal to what's published on npm
- This package ensures itโs compatible with production Chromatic
To facilitate upgrading in the future, removing and adding features, this is the process:
- Any new features will have to be on Chromatic production before they could be used in this package
- We can add feature flags to be able to test new functionality
- Chromatic production can not remove any features this package depends on until after the usage has been removed from this package in addition to a grace period to allow users to upgrade
Building and running locally
- Ensure all dependencies are installed with
yarn install
- Build + watch the code locally:
yarn dev
- Run a build of all the CLI's stories against a Chromatic project:
yarn chromatic -t <token>
.
Running against staging
CHROMATIC_INDEX_URL=https://index.staging-chromatic.com yarn chromatic -t 253df72b53d2
Running against development
To test against a local development version of the Chromatic stack, use
CHROMATIC_INDEX_URL=https://index.dev-chromatic.com yarn chromatic -t <token>
To only test a small number of test stories as a smoke test, use:
SMOKE_TEST=1 CHROMATIC_INDEX_URL=https://index.dev-chromatic.com yarn chromatic -t <token>
Publishing a new version to npm
Before publishing, make sure you've done the following:
- Updated CHANGELOG.md
- Committed and pushed everything (clean working directory)
- Decide on the proper semver bump (major/minor/patch)
- Decide on the proper tag (canary/next/latest)
We have three types of releases:
canary
releases are intended for testing purposes and should not be used in production, as they may only work against a staging or dev environment.next
releases should be valid, working releases that can potentially be used by early adopters of new features, for example to handle a support request.latest
releases are the general audience production releases, used by most people.
For GitHub Actions, we publish
chromaui/action-canary
andchromaui/action-next
, which contain the latestcanary
ornext
release, respectively. Alatest
release will also automatically updatechromaui/action-next
(besideschromaui/action
), in order to keep users who happen to depend onchromaui/action-next
up to date with thelatest
release.
A script is provided to create new releases:
yarn release <major|minor|patch> <canary|next|latest> [--dry-run]
This script ensures the version is bumped properly, the tag is set correctly and the corresponding GitHub Action is updated.
Examples:
yarn release patch canary
Releases e.g. 6.6.1-canary.0
.
yarn release major latest
Releases e.g. 7.0.0
.