Addon-docs: Support non-story exports in module format (#7185)

Addon-docs: Support non-story exports in module format

lib/components/src/blocks/PropsTable/PropRow.stories.tsx

@@ -7,6 +7,7 @@ import { DocsPageWrapper } from '../DocsPage';
 export default {
   Component: PropRow,
   title: 'Docs|PropRow',
+  excludeStories: /.*Def$/,
   decorators: [
     getStory => (
       <DocsPageWrapper>
@@ -18,49 +19,49 @@ export default {
   ],
 };
 
-const stringDef = {
+export const stringDef = {
   name: 'someString',
   type: { name: 'string' },
   required: true,
   description: 'someString description',
   defaultValue: 'fixme',
 };
 
-const longNameDef = {
+export const longNameDef = {
   ...stringDef,
   name: 'reallyLongStringThatTakesUpSpace',
 };
 
-const longDescDef = {
+export const longDescDef = {
   ...stringDef,
   description: 'really long description that takes up a lot of space. sometimes this happens.',
 };
 
-const numberDef = {
+export const numberDef = {
   name: 'someNumber',
   type: { name: 'number' },
   required: false,
   description: 'someNumber description',
   defaultValue: 0,
 };
 
-const objectDef = {
+export const objectDef = {
   name: 'someObject',
   type: { name: 'objectOf', value: { name: 'number' } },
   required: false,
   description: 'A simple `objectOf` propType.',
   defaultValue: { value: '{ key: 1 }', computed: false },
 };
 
-const arrayDef = {
+export const arrayDef = {
   name: 'someOArray',
   type: { name: 'arrayOf', value: { name: 'number' } },
   required: false,
   description: 'array of a certain type',
   defaultValue: { value: '[1, 2, 3]', computed: false },
 };
 
-const complexDef = {
+export const complexDef = {
   name: 'someComplex',
   type: {
     name: 'objectOf',

lib/components/src/blocks/PropsTable/PropsTable.stories.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { PropsTable, PropsTableError } from './PropsTable';
 import { DocsPageWrapper } from '../DocsPage';
-import * as rowStories from './PropRow.stories';
+import { stringDef, numberDef } from './PropRow.stories';
 
 export default {
   Component: PropsTable,
@@ -13,6 +13,4 @@ export const error = () => <PropsTable error={PropsTableError.NO_COMPONENT} />;
 
 export const empty = () => <PropsTable rows={[]} />;
 
-const { row: stringRow } = rowStories.string().props;
-const { row: numberRow } = rowStories.number().props;
-export const normal = () => <PropsTable rows={[stringRow, numberRow]} />;
+export const normal = () => <PropsTable rows={[stringDef, numberDef]} />;

lib/core/src/client/preview/start.js

@@ -21,6 +21,20 @@ const classes = {
   ERROR: 'sb-show-errordisplay',
 };
 
+function matches(storyKey, arrayOrRegex) {
+  if (Array.isArray(arrayOrRegex)) {
+    return arrayOrRegex.includes(storyKey);
+  }
+  return storyKey.match(arrayOrRegex);
+}
+
+export function isExportStory(key, { includeStories, excludeStories }) {
+  return (
+    (!includeStories || matches(key, includeStories)) &&
+    (!excludeStories || !matches(key, excludeStories))
+  );
+}
+
 function showMain() {
   document.body.classList.remove(classes.NOPREVIEW);
   document.body.classList.remove(classes.ERROR);
@@ -283,7 +297,7 @@ export default function start(render, { decorateStory } = {}) {
         );
       }
 
-      const { default: meta, ...examples } = fileExports;
+      const { default: meta, ...exports } = fileExports;
       const kindName = meta.title;
 
       if (previousExports[filename]) {
@@ -307,10 +321,12 @@ export default function start(render, { decorateStory } = {}) {
         kind.addParameters(meta.parameters);
       }
 
-      Object.keys(examples).forEach(key => {
-        const example = examples[key];
-        const { title = example.title || key, parameters } = example;
-        kind.add(title, example, parameters);
+      Object.keys(exports).forEach(key => {
+        if (isExportStory(key, meta)) {
+          const story = exports[key];
+          const { title = story.title || key, parameters } = story;
+          kind.add(title, story, parameters);
+        }
       });
 
       previousExports[filename] = fileExports;

lib/core/src/client/preview/start.test.js

@@ -2,7 +2,7 @@
 import { history, document, window } from 'global';
 
 import Events from '@storybook/core-events';
-import start from './start';
+import start, { isExportStory } from './start';
 
 jest.mock('@storybook/client-logger');
 jest.mock('global', () => ({
@@ -142,3 +142,37 @@ describe('STORY_INIT', () => {
     expect(store.setSelection).toHaveBeenCalledWith({ storyId: 'kind--story' });
   });
 });
+
+describe('story filters for module exports', () => {
+  it('should include all stories when there are no filters', () => {
+    expect(isExportStory('a', {})).toBeTruthy();
+  });
+
+  it('should filter stories by arrays', () => {
+    expect(isExportStory('a', { includeStories: ['a'] })).toBeTruthy();
+    expect(isExportStory('a', { includeStories: [] })).toBeFalsy();
+    expect(isExportStory('a', { includeStories: ['b'] })).toBeFalsy();
+
+    expect(isExportStory('a', { excludeStories: ['a'] })).toBeFalsy();
+    expect(isExportStory('a', { excludeStories: [] })).toBeTruthy();
+    expect(isExportStory('a', { excludeStories: ['b'] })).toBeTruthy();
+
+    expect(isExportStory('a', { includeStories: ['a'], excludeStories: ['a'] })).toBeFalsy();
+    expect(isExportStory('a', { includeStories: [], excludeStories: [] })).toBeFalsy();
+    expect(isExportStory('a', { includeStories: ['a'], excludeStories: ['b'] })).toBeTruthy();
+  });
+
+  it('should filter stories by regex', () => {
+    expect(isExportStory('a', { includeStories: /a/ })).toBeTruthy();
+    expect(isExportStory('a', { includeStories: /.*/ })).toBeTruthy();
+    expect(isExportStory('a', { includeStories: /b/ })).toBeFalsy();
+
+    expect(isExportStory('a', { excludeStories: /a/ })).toBeFalsy();
+    expect(isExportStory('a', { excludeStories: /.*/ })).toBeFalsy();
+    expect(isExportStory('a', { excludeStories: /b/ })).toBeTruthy();
+
+    expect(isExportStory('a', { includeStories: /a/, excludeStories: ['a'] })).toBeFalsy();
+    expect(isExportStory('a', { includeStories: /.*/, excludeStories: /.*/ })).toBeFalsy();
+    expect(isExportStory('a', { includeStories: /a/, excludeStories: /b/ })).toBeTruthy();
+  });
+});