Merge pull request #57 from storybooks/tests

Add Fragment Tests

example/stories/decorator.js

@@ -12,7 +12,7 @@ const Simple = props => (
 
 storiesOf('Decorator', module)
   .addDecorator(jsxDecorator)
-  .addWithJSX(
+  .add(
     'Simple Array',
     () => (
       <div>
@@ -22,7 +22,7 @@ storiesOf('Decorator', module)
     ),
     { skip: 1 }
   )
-  .addWithJSX(
+  .add(
     'Array with function',
     () => (
       <div>
@@ -33,7 +33,7 @@ storiesOf('Decorator', module)
     ),
     { skip: 1 }
   )
-  .addWithJSX(
+  .add(
     'Array with nested component',
     () => (
       <div>

example/stories/fragments.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import { jsxDecorator } from '../../lib/index';
+
+const Component = () => <div />;
+const Simple = props => (
+  <div>
+    <span>Hello</span>
+    {props.children}
+  </div>
+);
+
+storiesOf('Fragments', module)
+  .addDecorator(jsxDecorator)
+  .add('Simple Fragment', () => (
+    <React.Fragment>
+      <div />
+      <div />
+    </React.Fragment>
+  ))
+  .add('Array', () => [<div key="1" />, <div key="2" />])
+  .add('Fragment Shorthand', () => (
+    <>
+      <div />
+      <div />
+    </>
+  ));

example/stories/index.js

@@ -5,5 +5,6 @@ import './simple';
 import './deep';
 import './decorator';
 import './functions';
+import './fragments';
 import './array';
 import './withProps';

src/__tests__/__snapshots__/index.test.js.snap

@@ -193,6 +193,27 @@ exports[`Storyshots Deep Test With children - Skip and rename 1`] = `
 </div>
 `;
 
+exports[`Storyshots Fragments Array 1`] = `
+Array [
+  <div />,
+  <div />,
+]
+`;
+
+exports[`Storyshots Fragments Fragment Shorthand 1`] = `
+Array [
+  <div />,
+  <div />,
+]
+`;
+
+exports[`Storyshots Fragments Simple Fragment 1`] = `
+Array [
+  <div />,
+  <div />,
+]
+`;
+
 exports[`Storyshots Function as a children Deep function - No options 1`] = `
 <div>
   <div>