Storybook: Open browser automatically on run

[evandavis]

Hi, I'm trying to use the open-browser-webpack-plugin to launch my storybook in the browser as soon as it's ready. However, when I use this plugin, the server hangs and doesn't render anything.

I opened an issue on that repo as well because I'm not sure where the problem lies. (My suspicion is that it's something in the way that plugin unregisters after build conflicting with the HMR plugin?)

Here's the webpack config I'm using in my storybook:

const OpenBrowserPlugin = require('open-browser-webpack-plugin');

module.exports = {
  plugins: [
    new OpenBrowserPlugin({url: 'http://localhost:9001/'})
  ]
};

Thanks!

[arunoda]

@evandavis I haven't used this plugin personally.
But I assume, this is something related to plugin itself.

[ericandrewlewis]

Hey there,

the Webpack team added this option to webpack-dev-server which I think is swell. Maybe Storybook can do similar? so then start-storybook --open could open the browser automatically on start?

[texttechne]

Was a bug in the open-browser-webpack-plugin. See: baldore/open-browser-webpack-plugin/issues/11
@evandavis This ticket can be closed then, right?

[evandavis]

@texttechne correct, fixed in https://github.com/baldore/open-browser-webpack-plugin/issues/11.

[ericandrewlewis]

@shilman are you into adding this as an option to storybook itself? I'd be down to work on it :)

[shilman]

@ericandrewlewis i'm not familiar with that webpack plugin, but if it works well, sure that would be a great addition! thanks!

[nathanmcwpe]

found a quick fix that does this, however the browser loads and waits until the build is finished, but if you can deal with that:

first install the openurl package

then edit /node_modules/.bin/start-storybook and add the line (under require('../dist/server');):

require("openurl").open("http://localhost:9009")