Skip to content

Latest commit

 

History

History
49 lines (35 loc) · 1.6 KB

README.md

File metadata and controls

49 lines (35 loc) · 1.6 KB

Getting started with Storybook

Prerequisites

  • A device with NodeJS 18+ Support
  • Sauce Labs Account

Run the demo

  • Install & setup npm dependencies:
npm install
# On your first run, you'll also need to do a one-time setup with Playwright:
npx playwright install
  • Start Storybook locally in a separate terminal window and leave running in the background
npm run storybook
export SAUCE_USERNAME=__YOUR_SAUCE_USER_NAME__
export SAUCE_ACCESS_KEY=__YOUR_SAUCE_ACCESS_KEY__
# You can change the region to upload to via the SAUCE_REGION env variable. See the
# @saucelabs/visual-storybook README for more details on how to customize your run.
  • Run the test
npm run test-storybook
  • Go to https://app.saucelabs.com/visual/builds and select your latest Storybook run
  • Accept all diffs, so they become new baselines.
  • Make some changes in one of the Storybook Stories or, optionally, restart Storybook with a VISUAL_CHECK env to see all styles removed from the Button components for a sample run:
    • VISUAL_CHECK=1 npm run storybook
  • Re-run the tests
  • Open the test or go to https://app.saucelabs.com/visual/builds to review changes.
  • It should detect changes and display differences between the two runs of the various stories

Installation & Usage

View installation and usage instructions on the Sauce Docs website.