How to use the @storybook/addon-storyshots-puppeteer.imageSnapshot function in @storybook/addon-storyshots-puppeteer

To help you get started, we’ve selected a few @storybook/addon-storyshots-puppeteer examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github storybookjs / storybook / examples / official-storybook / image-snapshots / storyshots-image.runner.js View on Github external
// Image snapshots
// We do screenshots against the static build of the storybook.
// For this test to be meaningful, you must build the static version of the storybook *before* running this test suite.
const pathToStorybookStatic = path.join(__dirname, '../', 'storybook-static');

if (!fs.existsSync(pathToStorybookStatic)) {
  logger.error(
    'You are running image snapshots without having the static build of storybook. Please run "yarn run build-storybook" before running tests.'
  );
} else {
  initStoryshots({
    suite: 'Image snapshots',
    storyKindRegex: /^Addons\|Storyshots/,
    framework: 'react',
    configPath: path.join(__dirname, '..'),
    test: imageSnapshot({
      storybookUrl: `file://${pathToStorybookStatic}`,
      getMatchOptions: () => ({
        failureThreshold: 0.02, // 2% threshold,
        failureThresholdType: 'percent',
      }),
    }),
  });
}
github rwieruch / visual-regression-testing-react-storybook / test / jest.setup.js View on Github external
import registerRequireContextHook from 'babel-plugin-require-context-hook/register';
import initStoryshots from '@storybook/addon-storyshots';
import { imageSnapshot } from '@storybook/addon-storyshots-puppeteer';

registerRequireContextHook();
initStoryshots({
  suite: 'Storyshots',
  test: imageSnapshot({
    storybookUrl: 'http://localhost:9001',
  }),
});

@storybook/addon-storyshots-puppeteer

Image snapshots addition to StoryShots based on puppeteer

MIT
Latest version published 9 months ago

Package Health Score

59 / 100
Full package analysis