set up storybook-chrome-screenshot

.gitignore

@@ -40,3 +40,4 @@ testem.log
 # System Files
 .DS_Store
 Thumbs.db
+__screenshots__/

.storybook/addons.js

@@ -3,3 +3,4 @@
 import '@storybook/addon-actions/register';
 import '@storybook/addon-links/register';
 import '@storybook/addon-notes/register';
+import 'storybook-chrome-screenshot/register';

.storybook/config.js

@@ -1,11 +1,14 @@
 /* eslint-disable import/no-extraneous-dependencies, import/no-unresolved, import/extensions */
 
-import { configure } from '@storybook/angular';
+import { configure, addDecorator } from '@storybook/angular';
+import { initScreenshot } from 'storybook-chrome-screenshot';
 
 // automatically import all files ending in *.stories.js
 const req = require.context('../stories', true, /.stories.js$/);
 function loadStories() {
   req.keys().forEach((filename) => req(filename));
 }
 
+addDecorator(initScreenshot);
+
 configure(loadStories, module);

package.json

@@ -10,6 +10,7 @@
     "lint": "ng lint",
     "e2e": "ng e2e",
     "storybook": "start-storybook -p 6006",
+    "screenshot": "storybook-chrome-screenshot -p 6007",
     "build-storybook": "build-storybook"
   },
   "private": true,
@@ -31,10 +32,14 @@
     "@angular/cli": "1.5.4",
     "@angular/compiler-cli": "^5.0.0",
     "@angular/language-service": "^5.0.0",
+    "@storybook/addon-actions": "^3.3.3",
+    "@storybook/addon-links": "^3.3.3",
+    "@storybook/addon-notes": "^3.3.3",
     "@storybook/angular": "^3.3.3",
     "@storybook/cli": "^3.3.3",
     "@types/jasmine": "~2.5.53",
     "@types/jasminewd2": "~2.0.2",
+    "@types/lodash-es": "^4.17.0",
     "@types/node": "~6.0.60",
     "codelyzer": "^4.0.1",
     "jasmine-core": "~2.6.2",
@@ -46,12 +51,9 @@
     "karma-jasmine": "~1.1.0",
     "karma-jasmine-html-reporter": "^0.2.2",
     "protractor": "~5.1.2",
+    "storybook-chrome-screenshot": "^0.9.0",
     "ts-node": "~3.2.0",
     "tslint": "~5.7.0",
-    "typescript": "~2.4.2",
-    "@storybook/addon-notes": "^3.3.3",
-    "@storybook/addon-actions": "^3.3.3",
-    "@storybook/addon-links": "^3.3.3",
-    "@types/lodash-es": "^4.17.0"
+    "typescript": "~2.4.2"
   }
 }

stories/index.stories.js

@@ -2,13 +2,14 @@ import { storiesOf } from '@storybook/angular';
 import { withNotes } from '@storybook/addon-notes';
 import { action } from '@storybook/addon-actions';
 import { linkTo } from '@storybook/addon-links';
+import { withScreenshot } from 'storybook-chrome-screenshot';
 
 import { Welcome, Button } from '@storybook/angular/demo';
 
-storiesOf('Welcome', module).add('to Storybook', () => ({
+storiesOf('Welcome', module).add('to Storybook', withScreenshot()(() => ({
   component: Welcome,
   props: {},
-}));
+})));
 
 storiesOf('Button', module)
   .add('with text', () => ({