[Idea] A mode with no iframe : debug mode

[ritz078]

When I switch to fullscreen mode iframe is still there and some intermediate code. Though UI wise I have no problem but when profiling and testing the performance I have following problems :

1. A major part of profiling consists of manager.js code.

1. I want to optimize my component's code but it depends on react-storybook code on which I have no control. I would like to have a debug mode where I just have the component on a single page with only my code (no extra storybook code). It should be just a HTML with my component rendered on that. This is how I think it should be UX wise. A button on the top right of each story which opens the component in the new tab with only my story code (and decorator of course). Codepen's debug mode can be taken as an example.

[thani-sh]

Hi @ritz078
We've moved all our UI code to [kadirahq/storybook-ui] repo. The pop-out issue can be discussed there. Until it's ready, I think you can use the preview iframe html file directly (example).

[arunoda]

@ritz078 I think this is important. And @mnmtanish gives an example. You can simply get the iframe content directly.

You need to build a URL like this: http://kadira-samples.github.io/react-button/iframe.html?dataId=whatever&selectedKind=Button&selectedStory=custom%20styles

Let's introduce another shortcut to get this URL in the storybook-ui.

[ritz078]

A button will be better. You can also put a shortcut if you want but additional to the button.

@mnmtanish I know about the repo but the thing is there's very fewer chance people will go there and post issues. We can't expect the users to identify the module and post the issue there. So maybe add a label for it here itself ?

[joscha]

refs #266

[arunoda]

@joscha Thanks for the mention. I couldn't find it :)

[arunoda]

I think we've a solution for this issue.
Anyway, we'll add a proper section of different kinds of testing to docs soon.
Then it'll have a section for this.