Merge pull request #4285 from yaodingyd/patch-1

fix #2384: support string-only component for vue
storybookjs · Oct 8, 2018 · c845723 · c845723
2 parents b748d76 + c93bcaf
commit c845723
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 1 deletion.
diff --git a/app/vue/src/client/preview/index.js b/app/vue/src/client/preview/index.js
@@ -13,7 +13,12 @@ const decorateStory = (getStory, decorators) =>
   decorators.reduce(
     (decorated, decorator) => context => {
       const story = () => decorated(context);
-      const decoratedStory = decorator(story, context);
+      let decoratedStory = decorator(story, context);
+
+      if (typeof decoratedStory === 'string') {
+        decoratedStory = { template: decoratedStory };
+      }
+
       decoratedStory.components = decoratedStory.components || {};
       decoratedStory.components.story = createWrapperComponent(story());
       return decoratedStory;

diff --git a/examples/vue-kitchen-sink/src/stories/__snapshots__/core-template.stories.storyshot b/examples/vue-kitchen-sink/src/stories/__snapshots__/core-template.stories.storyshot
@@ -0,0 +1,10 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Storyshots Core|Template string only 1`] = `
+<button
+  class="button"
+  style="color: rgb(66, 185, 131); border-color: #42b983;"
+>
+  A Button with square edges!
+</button>
+`;
diff --git a/examples/vue-kitchen-sink/src/stories/core-template.stories.js b/examples/vue-kitchen-sink/src/stories/core-template.stories.js
@@ -0,0 +1,6 @@
+import { storiesOf } from '@storybook/vue';
+
+storiesOf('Core|Template', module).add(
+  'string only',
+  () => '<my-button :rounded="false">A Button with square edges</my-button>'
+);