storybookjs/storybook

Are there plans for @storybook/html and @storybook/addon-info to play nicely?

Pickra opened this issue · 6 comments

Currently using @storybook/html and @storybook/addon-info breaks storybook. The combo gets an error Expecting an HTML snippet or DOM node from the story.

I would like to use @storybook/html to build HTML/CSS components and have the copy code to the clipboard feature from @storybook/addon-info. The other options in addon-info would be great too, but copy to the clipboard is my primary use case.

There are 2 closed issues that reference my needs #3985 + #2187. The latter mentions using vue, I attempted this but found it adds undesired complexity.

I appreciate all the work that has gone into storybook. Thank you to all the maintainers for their effort. I am unsure if I am able to work on this feature, I'm just curious if this has any priority.

Here is an example of how I'd like to use @storybook/html + @storybook/addon-info in a story...

import { storiesOf } from '@storybook/html';
import { withInfo } from '@storybook/addon-info';

storiesOf('My little pony', module)
  .addDecorator(withInfo)
  .add('Twilight Sparkle', () => `<div>Twilight Sparkle</div>`)

// OR

storiesOf('Unicorns', module)
  .add('Twilight Sparkle', withInfo('Twilight Sparkle')(() => `<div>Twilight Sparkle</div>`))

...and the desired result
screen shot 2018-11-22 at 12 22 14 pm

Thank you.

@Pickra Not in its current form. We're working on a much better approach to solving the problems addon-info addresses that will work with all frameworks. Unfortunately we don't have a timeline for that yet.

Cool @shilman, thanks for the speedy response.

stale commented

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

Hey @shilman, I just wanted to mention that @kgroat and I built a solution in case anyone else was looking for something.
https://github.com/Pickra/copy-code-block
Thanks again!

Very cool! Wanna PR this to docs? we have a section for 3rd party addons.

Will be fixed in #1147