feat: supportof for include.exclude stories on kind

ccontrols · Mar 15, 2020 · 3645c68 · 3645c68
1 parent 7b2d215
commit 3645c68
Show file tree

Hide file tree

Showing 18 changed files with 311 additions and 96 deletions.
diff --git a/core/instrument/src/babel/extract-attributes.ts b/core/instrument/src/babel/extract-attributes.ts
@@ -4,46 +4,52 @@ interface StoryAttribute {
   name: string;
   value: any;
 }
-const nodeToAttribute = (node: any): StoryAttribute | undefined => {
-  const value = node.value || node;
-  const name = node.key ? node.key.name : node.name;
-  if (value) {
-    switch (value.type) {
+const nodeToValue = (node: any): any => {
+  if (node) {
+    switch (node.type) {
       case 'BooleanLiteral':
       case 'NumericLiteral':
-      case 'StringLiteral': {
-        return {
-          value: value.value,
-          name,
-        };
-      }
+      case 'StringLiteral':
+        return node.value;
       case 'Identifier':
-        return {
-          value: value.name,
-          name,
-        };
+        return node.name;
+      case 'Property':
+        return node.name;
+
+      case 'Literal':
+        return node.raw;
+      case 'RegExpLiteral':
+        const value = node.raw ?? node.extra ? node.extra.raw : undefined;
+        // remove leading trailing slashes for string to reg xonversion
+        return typeof value === 'string'
+          ? value.replace(/^\/|\/$/g, '')
+          : value;
       case 'MemberExpression':
-        return {
-          value: `${value.object.name}.${value.property.name}`,
-          name,
-        };
-      case 'ObjectExpression': {
-        const val = extractAttributes(value);
-        if (val) {
-          return {
-            value: val,
-            name,
-          };
+        return `${node.object.name}.${node.property.name}`;
+      case 'ObjectExpression':
+        return extractAttributes(node);
+      case 'ArrayExpression':
+        if (Array.isArray(node.elements)) {
+          return node.elements.map((v: any) => nodeToValue(v));
         }
         break;
-      }
       default:
         // console.log(property.value);
         return undefined;
     }
   }
   return undefined;
 };
+const nodeToAttribute = (node: any): StoryAttribute | undefined => {
+  const value = node.value || node;
+  const name = node.key ? node.key.name : node.name;
+  const retVal = nodeToValue(value);
+  return retVal !== undefined
+    ? name
+      ? { value: retVal, name }
+      : retVal
+    : undefined;
+};
 export const extractAttributes = (
   node: any,
 ): StoryAttributes | any | undefined => {

diff --git a/core/instrument/src/index.ts b/core/instrument/src/index.ts
@@ -95,7 +95,40 @@ const parseSource = async (
   const kindsNames = Object.keys(store.kinds);
   for (let i = 0; i < kindsNames.length; i += 1) {
     const kind: StoriesKind = store.kinds[kindsNames[i]];
-
+    if (store.stories) {
+      let includedStories = Object.keys(store.stories);
+      const { attributes } = kind;
+      const { includeStories, excludeStories } = attributes || {};
+      if (includeStories) {
+        if (Array.isArray(includeStories)) {
+          includedStories = includedStories.filter(
+            name => includeStories.indexOf(name) > -1,
+          );
+        } else {
+          const match = new RegExp(includeStories);
+          includedStories = includedStories.filter(name => {
+            return name.match(match);
+          });
+        }
+      }
+      if (excludeStories) {
+        if (Array.isArray(excludeStories)) {
+          includedStories = includedStories.filter(
+            name => excludeStories.indexOf(name) === -1,
+          );
+        } else {
+          const match = new RegExp(excludeStories);
+          includedStories = includedStories.filter(name => !name.match(match));
+        }
+      }
+      if (includeStories || excludeStories) {
+        for (var key in store.stories) {
+          if (includedStories.indexOf(key) === -1) {
+            delete store.stories[key];
+          }
+        }
+      }
+    }
     const repository = await packageInfo(filePath, options.stories.package);
     if (repository) {
       kind.repository = repository;

diff --git a/core/instrument/test/__snapshots__/csf-exclude-stories.test.ts.snap b/core/instrument/test/__snapshots__/csf-exclude-stories.test.ts.snap
@@ -0,0 +1,189 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`csf-exclude-stories exclude-stories-array.js 1`] = `
+Object {
+  "components": Object {},
+  "kinds": Object {
+    "Storybook/Blocks/EXCLUDEStoryArray": Object {
+      "attributes": Object {
+        "excludeStories": Array [
+          "story1",
+          "story2",
+        ],
+        "title": "Storybook/Blocks/EXCLUDEStoryArray",
+      },
+      "components": Object {},
+      "repository": Object {
+        "browse": "https://github.com/ccontrols/component-controls/tree/master/core/instrument/test/fixtures/csf/exclude-stories/exclude-stories-array.js",
+        "docs": "https://github.com/ccontrols/component-controls/tree/master#readme",
+        "issues": "https://github.com/ccontrols/component-controls/issues",
+      },
+      "title": "Storybook/Blocks/EXCLUDEStoryArray",
+    },
+  },
+  "stories": Object {
+    "story3": Object {
+      "arguments": Array [],
+      "loc": Object {
+        "end": Object {
+          "column": 30,
+          "line": 8,
+        },
+        "start": Object {
+          "column": 22,
+          "line": 8,
+        },
+      },
+      "name": "story3",
+      "source": "() => {}",
+    },
+  },
+}
+`;
+
+exports[`csf-exclude-stories exclude-stories-regex.js 1`] = `
+Object {
+  "components": Object {},
+  "kinds": Object {
+    "Storybook/Blocks/ExcludeStoryRegex": Object {
+      "attributes": Object {
+        "excludeStories": "story(2|3)",
+        "title": "Storybook/Blocks/ExcludeStoryRegex",
+      },
+      "components": Object {},
+      "repository": Object {
+        "browse": "https://github.com/ccontrols/component-controls/tree/master/core/instrument/test/fixtures/csf/exclude-stories/exclude-stories-regex.js",
+        "docs": "https://github.com/ccontrols/component-controls/tree/master#readme",
+        "issues": "https://github.com/ccontrols/component-controls/issues",
+      },
+      "title": "Storybook/Blocks/ExcludeStoryRegex",
+    },
+  },
+  "stories": Object {
+    "story1": Object {
+      "arguments": Array [],
+      "loc": Object {
+        "end": Object {
+          "column": 30,
+          "line": 6,
+        },
+        "start": Object {
+          "column": 22,
+          "line": 6,
+        },
+      },
+      "name": "story1",
+      "source": "() => {}",
+    },
+  },
+}
+`;
+
+exports[`csf-exclude-stories include-stories-array.js 1`] = `
+Object {
+  "components": Object {},
+  "kinds": Object {
+    "Storybook/Blocks/IncludeStoryArray": Object {
+      "attributes": Object {
+        "includeStories": Array [
+          "story1",
+          "story2",
+        ],
+        "title": "Storybook/Blocks/IncludeStoryArray",
+      },
+      "components": Object {},
+      "repository": Object {
+        "browse": "https://github.com/ccontrols/component-controls/tree/master/core/instrument/test/fixtures/csf/exclude-stories/include-stories-array.js",
+        "docs": "https://github.com/ccontrols/component-controls/tree/master#readme",
+        "issues": "https://github.com/ccontrols/component-controls/issues",
+      },
+      "title": "Storybook/Blocks/IncludeStoryArray",
+    },
+  },
+  "stories": Object {
+    "story1": Object {
+      "arguments": Array [],
+      "loc": Object {
+        "end": Object {
+          "column": 30,
+          "line": 6,
+        },
+        "start": Object {
+          "column": 22,
+          "line": 6,
+        },
+      },
+      "name": "story1",
+      "source": "() => {}",
+    },
+    "story2": Object {
+      "arguments": Array [],
+      "loc": Object {
+        "end": Object {
+          "column": 30,
+          "line": 7,
+        },
+        "start": Object {
+          "column": 22,
+          "line": 7,
+        },
+      },
+      "name": "story2",
+      "source": "() => {}",
+    },
+  },
+}
+`;
+
+exports[`csf-exclude-stories include-stories-regex.js 1`] = `
+Object {
+  "components": Object {},
+  "kinds": Object {
+    "Storybook/Blocks/IncludeStoryRegex": Object {
+      "attributes": Object {
+        "includeStories": "story(2|3)",
+        "title": "Storybook/Blocks/IncludeStoryRegex",
+      },
+      "components": Object {},
+      "repository": Object {
+        "browse": "https://github.com/ccontrols/component-controls/tree/master/core/instrument/test/fixtures/csf/exclude-stories/include-stories-regex.js",
+        "docs": "https://github.com/ccontrols/component-controls/tree/master#readme",
+        "issues": "https://github.com/ccontrols/component-controls/issues",
+      },
+      "title": "Storybook/Blocks/IncludeStoryRegex",
+    },
+  },
+  "stories": Object {
+    "story2": Object {
+      "arguments": Array [],
+      "loc": Object {
+        "end": Object {
+          "column": 30,
+          "line": 7,
+        },
+        "start": Object {
+          "column": 22,
+          "line": 7,
+        },
+      },
+      "name": "story2",
+      "source": "() => {}",
+    },
+    "story3": Object {
+      "arguments": Array [],
+      "loc": Object {
+        "end": Object {
+          "column": 30,
+          "line": 8,
+        },
+        "start": Object {
+          "column": 22,
+          "line": 8,
+        },
+      },
+      "name": "story3",
+      "source": "() => {}",
+    },
+  },
+}
+`;
diff --git a/core/instrument/test/__snapshots__/csf-story-kind.test.ts.snap b/core/instrument/test/__snapshots__/csf-story-kind.test.ts.snap
@@ -59,16 +59,6 @@ Object {
         "docs": "https://github.com/ccontrols/component-controls/tree/master#readme",
         "issues": "https://github.com/ccontrols/component-controls/issues",
       },
-      "source": "export default {
-  title: 'Storybook/Blocks/ControlsTable',
-  parameters: {
-    component: ControlsTable,
-    addonControls: {
-      smart: false,
-    },
-  },
-};
-",
       "title": "Storybook/Blocks/ControlsTable",
     },
   },
@@ -108,21 +98,6 @@ Object {
         "docs": "https://github.com/ccontrols/component-controls/tree/master#readme",
         "issues": "https://github.com/ccontrols/component-controls/issues",
       },
-      "source": "export default {
-  title: 'Storybook/Kind',
-  component: ControlsTable,
-  parameters: {
-    controls: {
-      name: {
-        type: ControlTypes.TEXT,
-        label: 'Name',
-        value: 'Mark',
-        order: 9999,
-      },
-    },
-  },
-};
-",
       "title": "Storybook/Kind",
     },
   },
@@ -144,10 +119,6 @@ Object {
         "docs": "https://github.com/ccontrols/component-controls/tree/master#readme",
         "issues": "https://github.com/ccontrols/component-controls/issues",
       },
-      "source": "export default {
-  title: 'Storybook/Blocks/ControlsTable',
-};
-",
       "title": "Storybook/Blocks/ControlsTable",
     },
   },

diff --git a/core/instrument/test/__snapshots__/csf-toggle.test.ts.snap b/core/instrument/test/__snapshots__/csf-toggle.test.ts.snap
@@ -28,35 +28,6 @@ Object {
         "docs": "https://github.com/ccontrols/component-controls/tree/master#readme",
         "issues": "https://github.com/ccontrols/component-controls/issues",
       },
-      "source": "import React from 'react';
-import { Toggle } from './Toggle';
-
-export default {
-  title: 'Components/Toggle',
-  component: Toggle,
-};
-
-export const allToggles = () => {
-  const [checked, setChecked] = React.useState(false);
-  return (
-    <div>
-      <p>Default toggle</p>
-      <Toggle checked={checked} onChange={check => setChecked(check)} />
-      <br />
-      <p>Custom labels</p>
-      <Toggle
-        checked={checked}
-        labels={{
-          true: 'YES',
-          false: 'NO!',
-        }}
-        onChange={check => setChecked(check)}
-      />
-      <br />
-    </div>
-  );
-};
-",
       "title": "Components/Toggle",
     },
   },