Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Addon-storyshots] Remove default options on "goto" call #3298

Merged
merged 3 commits into from
Mar 27, 2018
Merged

[Addon-storyshots] Remove default options on "goto" call #3298

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
8ab2e16
remove default options on goto call to puppeteer
Mar 27, 2018
9713b4a
Update README for addon-storyshots
Mar 27, 2018
9543644
Merge branch 'master' into fix-3288-storyshots-default-goto-options
danielduan Mar 27, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 14 additions & 1 deletion addons/storyshots/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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)

Expand Down
3 changes: 2 additions & 1 deletion addons/storyshots/src/test-body-image-snapshot.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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.
Expand Down Expand Up @@ -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.`,
Expand Down