Merge pull request #1035 from storybooks/configure-snapshot-test

Configure snapshot test

Author: Tom Coleman

addons/storyshots/README.md

@@ -100,3 +100,19 @@ initStoryshots({
 ### `framework`
 
 If you are running tests from outside of your app's directory, storyshot's detection of which framework you are using may fail. Pass `"react"` or `"react-native"` to short-circuit this.
+
+### `test`
+
+Run a custom test function for each story, rather than the default (a vanilla snapshot test). See the exports section below for more details.
+
+## Exports
+
+Apart from the default export (`initStoryshots`), Storyshots also exports some named test functions (see the `test` option above):
+
+### `snapshot`
+
+The default, render the story as normal and take a Jest snapshot.
+
+### `renderOnly`
+
+Just render the story, don't check the output at all (useful if you just want to ensure it doesn't error).

addons/storyshots/src/index.js

@@ -1,11 +1,13 @@
-import renderer from 'react-test-renderer';
 import path from 'path';
 import readPkgUp from 'read-pkg-up';
 import addons from '@storybook/addons';
 import runWithRequireContext from './require_context';
 import createChannel from './storybook-channel-mock';
+import { snapshot } from './test-bodies';
 const { describe, it, expect } = global;
 
+export { snapshot, renderOnly } from './test-bodies';
+
 let storybook;
 let configPath;
 
@@ -59,6 +61,8 @@ export default function testStorySnapshots(options = {}) {
   // Added not to break existing storyshots configs (can be removed in a future major release)
   options.storyNameRegex = options.storyNameRegex || options.storyRegex;
 
+  options.test = options.test || snapshot;
+
   for (const group of stories) {
     if (options.storyKindRegex && !group.kind.match(options.storyKindRegex)) {
       continue;
@@ -73,9 +77,7 @@ export default function testStorySnapshots(options = {}) {
 
           it(story.name, () => {
             const context = { kind: group.kind, story: story.name };
-            const renderedStory = story.render(context);
-            const tree = renderer.create(renderedStory).toJSON();
-            expect(tree).toMatchSnapshot();
+            options.test({ story, context });
           });
         }
       });

addons/storyshots/src/test-bodies.js

@@ -0,0 +1,13 @@
+import renderer from 'react-test-renderer';
+import shallow from 'react-test-renderer/shallow';
+
+export function snapshot({ story, context }) {
+  const storyElement = story.render(context);
+  const tree = renderer.create(storyElement).toJSON();
+  expect(tree).toMatchSnapshot();
+}
+
+export function renderOnly({ story, context }) {
+  const storyElement = story.render(context);
+  const tree = renderer.create(storyElement);
+}