diff --git a/addons/storyshots/storyshots-puppeteer/README.md b/addons/storyshots/storyshots-puppeteer/README.md index 51aebee3cc20..9c793d56f0a5 100644 --- a/addons/storyshots/storyshots-puppeteer/README.md +++ b/addons/storyshots/storyshots-puppeteer/README.md @@ -123,6 +123,8 @@ initStoryshots({ }); ``` +Alternatively, you may set the `SB_CHROMIUM_PATH` environment variable. If both are set, then `chromeExecutablePath` will take precedence. + ### Specifying a custom Puppeteer `browser` instance You might use the async `getCustomBrowser` function to obtain a custom instance of a Puppeteer `browser` object. This will prevent `storyshots-puppeteer` from creating its own `browser`. It will create and close pages within the `browser`, and it is your responsibility to manage the lifecycle of the `browser` itself. diff --git a/addons/storyshots/storyshots-puppeteer/src/config.ts b/addons/storyshots/storyshots-puppeteer/src/config.ts index e8665a396fd1..c6f40fd6bd04 100644 --- a/addons/storyshots/storyshots-puppeteer/src/config.ts +++ b/addons/storyshots/storyshots-puppeteer/src/config.ts @@ -52,7 +52,7 @@ const asyncNoop: () => Promise = async () => undefined; export const defaultCommonConfig: CommonConfig = { storybookUrl: 'http://localhost:6006', - chromeExecutablePath: undefined, + chromeExecutablePath: process.env.SB_CHROMIUM_PATH, getGotoOptions: noop, customizePage: asyncNoop, getCustomBrowser: undefined, diff --git a/docs/workflows/storybook-composition.md b/docs/workflows/storybook-composition.md index 755f48aef517..1dbaca449b53 100644 --- a/docs/workflows/storybook-composition.md +++ b/docs/workflows/storybook-composition.md @@ -23,7 +23,7 @@ In your [`storybook/main.js`](../configure/overview.md#configure-story-rendering
- We would like to point out that there's some limitations to composition. For now addons in composed Storybooks will not work as they do in non composed Storybooks. + We would like to point out that there's some limitations to composition. For now addons in composed Storybooks will not work as they do in non composed Storybooks.
## Compose local Storybooks @@ -70,6 +70,12 @@ So far we've covered how we can use composition with local or published Storyboo npx sb extract ``` +
+ +`sb extract` uses [Puppeteer](https://www.npmjs.com/package/puppeteer), which downloads and installs Chromium. Specify your own locally-installed Chromium executable by setting the environment variable `SB_CHROMIUM_PATH`. + +
+ Using this command will generate a `stories.json` file in the default build directory (`storybook-static`) with information regarding your Storybook. Here's how it might look: diff --git a/lib/cli/src/extract.ts b/lib/cli/src/extract.ts index 5826c15d5b4e..688574be7715 100644 --- a/lib/cli/src/extract.ts +++ b/lib/cli/src/extract.ts @@ -52,7 +52,7 @@ const useLocation: (input: string) => Promise<[string, () => void]> = async (inp const usePuppeteerBrowser: () => Promise = async () => { const args = ['--no-sandbox ', '--disable-setuid-sandbox']; try { - return await puppeteerCore.launch({ args }); + return await puppeteerCore.launch({ args, executablePath: process.env.SB_CHROMIUM_PATH }); } catch (e) { // it's not installed logger.info('installing puppeteer...');