diff --git a/addons/storyshots/README.md b/addons/storyshots/README.md index a0e3f70c2c7b..fd27b861524a 100644 --- a/addons/storyshots/README.md +++ b/addons/storyshots/README.md @@ -214,7 +214,20 @@ initStoryshots({suite: 'Image storyshots', test: imageSnapshot({storybookUrl: 'h `beforeScreenshot` receives the [Puppeteer page instance](https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#class-page) and an object: `{ context: {kind, story}, url}`. _kind_ is the kind of the story and the _story_ its name. _url_ is the URL the browser will use to screenshot. `beforeScreenshot` is part of the promise chain and is called after the browser navigation is completed but before the screenshot is taken. It allows for triggering events on the page elements and delaying the screenshot and can be used avoid regressions due to mounting animations. -### Specifying options to _screenshot()_ +### Specifying options to _goto()_ (puppeteer API) + +You might use `getGotoOptions` to specify options when the storybook is navigating to a story (using the `goto` method). Will be passed to [Puppeteer .goto() fn](https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pagegotourl-options) + +```js +import initStoryshots, { imageSnapshot } from '@storybook/addon-storyshots'; +const getGotoOptions = ({context, url}) => { + return { + waitUntil: 'networkidle0', + } +} +initStoryshots({suite: 'Image storyshots', test: imageSnapshot({storybookUrl: 'http://localhost:6006', getGotoOptions})}); +``` +### Specifying options to _screenshot()_ (puppeteer API) You might use `getScreenshotOptions` to specify options for screenshot. Will be passed to [Puppeteer .screenshot() fn](https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pagescreenshotoptions) diff --git a/addons/storyshots/src/test-body-image-snapshot.js b/addons/storyshots/src/test-body-image-snapshot.js index ee8e6d77e42f..cfa45bb93de2 100644 --- a/addons/storyshots/src/test-body-image-snapshot.js +++ b/addons/storyshots/src/test-body-image-snapshot.js @@ -14,6 +14,7 @@ export const imageSnapshot = ({ getMatchOptions = noop, getScreenshotOptions = defaultScreenshotOptions, beforeScreenshot = noop, + getGotoOptions = noop, }) => { let browser; // holds ref to browser. (ie. Chrome) let page; // Hold ref to the page to screenshot. @@ -42,7 +43,7 @@ export const imageSnapshot = ({ expect.assertions(1); return page - .goto(url, { waitUntil: 'networkidle0' }) + .goto(url, getGotoOptions({ context, url })) .catch(e => { logger.error( `ERROR WHILE CONNECTING TO ${url}, did you start or build the storybook first ? A storybook instance should be running or a static version should be built when using image snapshot feature.`,