Merge pull request #2557 from storybooks/CI-angular

CI: test that angular example works

.circleci/config.yml

@@ -68,6 +68,11 @@ jobs:
           command: |
             cd examples/vue-kitchen-sink
             yarn build-storybook
+      - run:
+          name: "Build angular-cli"
+          command: |
+            cd examples/angular-cli
+            yarn build-storybook
 
       - run:
           name: "Run react kitchen-sink"
@@ -81,6 +86,12 @@ jobs:
             cd examples/vue-kitchen-sink
             yarn storybook
           background: true
+      - run:
+          name: "Run angular-cli"
+          command: |
+            cd examples/angular-cli
+            yarn storybook
+          background: true
       - run:
           name: Workaround for https://github.com/GoogleChrome/puppeteer/issues/290
           command: sh ./scripts/workaround-puppeteer-issue-290.sh

examples/angular-cli/.storybook/config.js

@@ -3,7 +3,12 @@
 import { configure } from '@storybook/angular';
 
 function loadStories() {
+  // put welcome screen at the top of the list so it's the first one displayed
   require('../src/stories');
+
+  // automatically import all story ts files that end with *.stories.ts
+  const req = require.context('../src/stories', true, /\.stories\.ts$/)
+  req.keys().forEach((filename) => req(filename))
 }
 
 configure(loadStories, module);

examples/angular-cli/package.json

@@ -9,7 +9,7 @@
     "test": "ng test",
     "lint": "ng lint",
     "e2e": "ng e2e",
-    "storybook": "start-storybook -p 9009 -s src/assets",
+    "storybook": "start-storybook -p 9008 -s src/assets",
     "build-storybook": "build-storybook -s src"
   },
   "private": true,

examples/angular-cli/src/stories/index.ts

@@ -25,8 +25,6 @@ import { ServiceComponent } from './moduleMetadata/service.component'
 import { NameComponent } from './name.component';
 import { CustomPipePipe } from './custom.pipe';
 
-import './customControlValueAccessor/custom-cva-component.stories';
-
 storiesOf('Welcome', module)
   .add('to Storybook', () => ({
     component: Welcome,

integration/examples.test.js

@@ -9,6 +9,10 @@ const examples = [
     name: 'vue-kitchen-sink',
     port: 9009,
   },
+  {
+    name: 'angular-cli',
+    port: 9008,
+  },
 ];
 
 examples.forEach(({ name, port }) => {