chore: refactor instrument options

ccontrols · Mar 6, 2020 · 925baea · 925baea
1 parent 5dc5bf6
commit 925baea
Show file tree

Hide file tree

Showing 10 changed files with 103 additions and 86 deletions.
diff --git a/core/instrument/.eslintignore b/core/instrument/.eslintignore
@@ -1 +1,2 @@
 dist
+test/examples/
diff --git a/core/instrument/src/babel/extract-component.ts b/core/instrument/src/babel/extract-component.ts
@@ -1,5 +1,3 @@
-import * as resolve from 'resolve';
-import * as parser from '@babel/parser';
 import { File } from '@babel/types';
 import {
   StoriesStore,
@@ -9,6 +7,7 @@ import {
 } from '@component-controls/specification';
 import { followImports } from './follow-imports';
 import { packageInfo } from '../project/packageInfo';
+import { InstrumentOptions } from '../types';
 
 const componentFromParams = (
   parameters?: StoryArguments,
@@ -47,16 +46,14 @@ export const extractComponent = async (
   componentName: string,
   filePath: string,
   source?: string,
-  parserOptions?: parser.ParserOptions,
-  resolveOptions?: resolve.SyncOpts,
+  optiomns?: InstrumentOptions,
   initialAST?: File,
 ): Promise<StoryComponent | undefined> => {
   const follow = followImports(
     componentName,
     filePath,
     source,
-    parserOptions,
-    resolveOptions,
+    optiomns,
     initialAST,
   );
   return follow
@@ -75,8 +72,7 @@ export const extractSotreComponent = async (
   store: StoriesStore,
   filePath: string,
   source: string,
-  parserOptions?: parser.ParserOptions,
-  resolveOptions?: resolve.SyncOpts,
+  optiomns?: InstrumentOptions,
   initialAST?: File,
 ) => {
   const kinds = Object.keys(store.kinds);
@@ -89,8 +85,7 @@ export const extractSotreComponent = async (
         componentName,
         filePath,
         source,
-        parserOptions,
-        resolveOptions,
+        optiomns,
         initialAST,
       );
       if (component) {
@@ -107,8 +102,7 @@ export const extractSotreComponent = async (
         componentName,
         filePath,
         source,
-        parserOptions,
-        resolveOptions,
+        optiomns,
         initialAST,
       );
       if (component) {

diff --git a/core/instrument/src/babel/follow-imports.ts b/core/instrument/src/babel/follow-imports.ts
@@ -12,6 +12,7 @@ import {
   ExportType,
   EXPORT_ALL,
 } from './extract-exports';
+import { InstrumentOptions } from '../types';
 
 export interface FollowImportType {
   exportedAs: string;
@@ -25,13 +26,13 @@ export const followImports = (
   importName: string,
   filePath: string,
   fileSource?: string,
-  parserOptions?: parser.ParserOptions,
-  resolveOptions?: resolve.SyncOpts,
+  options?: InstrumentOptions,
   initialAST?: File,
 ): FollowImportType | undefined => {
+  const { parser: parserOptions, resolve: resolveOptions } = options || {};
+
   const source = fileSource || fs.readFileSync(filePath, 'utf8');
   const ast = initialAST || parser.parse(source, parserOptions);
-
   const baseImportedName = importName.split('.')[0];
 
   const exports: ExportTypes = {
@@ -61,8 +62,7 @@ export const followImports = (
         findExport.internalName,
         resolvedFilePath,
         undefined,
-        parserOptions,
-        resolveOptions,
+        options,
       );
       return imported ? { ...imported, from: findExport.from } : undefined;
     }
@@ -84,8 +84,7 @@ export const followImports = (
           baseImportedName,
           resolvedFilePath,
           undefined,
-          parserOptions,
-          resolveOptions,
+          options,
         );
       }
       return { ...foundInExportAll, from: e.from };
@@ -96,6 +95,7 @@ export const followImports = (
   const imports: ImportTypes = {};
   traverse(ast, traverseImports(imports));
   const findImport = imports[baseImportedName];
+
   if (findImport) {
     try {
       const resolvedFilePath = resolve.sync(findImport.from, {
@@ -106,12 +106,13 @@ export const followImports = (
         findImport.importedName,
         resolvedFilePath,
         undefined,
-        parserOptions,
-        resolveOptions,
+        options,
       );
-      return imported ? { ...imported, from: findImport.from } : undefined;
+      return imported
+        ? { ...imported, from: findImport.from }
+        : { exportedAs: findImport.importedName, from: findImport.from };
     } catch (e) {
-      //non-exxsiting file
+      //non-existing file
       return { exportedAs: findImport.importedName, from: findImport.from };
     }
   }

diff --git a/core/instrument/src/index.ts b/core/instrument/src/index.ts
@@ -3,8 +3,7 @@ const mdx = require('@mdx-js/mdx');
 import { toId, storyNameFromExport } from '@storybook/csf';
 import traverse from '@babel/traverse';
 import generate from '@babel/generator';
-import * as resolve from 'resolve';
-import prettier, { Options, ResolveConfigOptions } from 'prettier';
+import prettier from 'prettier';
 import parserBabel from 'prettier/parser-babylon';
 import {
   StoriesStore,
@@ -18,30 +17,43 @@ import { extractMDXStories } from './babel/mdx-stories';
 import { removeMDXAttributes } from './babel/remove-mdx-attributes';
 import { extractSotreComponent } from './babel/extract-component';
 import { packageInfo } from './project/packageInfo';
+import {
+  InstrumentOptions,
+  defaultParserOptions,
+  defaultResolveOptions,
+} from './types';
 
-type TraverseFn = (stories: StoriesStore) => any;
-
-export type PrettierOptions = Options & {
-  resolveConfigOptions?: ResolveConfigOptions;
-};
+export * from './types';
 
-export const defaultResolveOptions: resolve.SyncOpts = {
-  extensions: ['.js', '.jsx', '.ts', '.tsx', '.vue', '.mjs', '.es', '.es6'],
-};
+type TraverseFn = (stories: StoriesStore) => any;
 
-export const defaultParserOptions: parser.ParserOptions = {
-  sourceType: 'module',
-  plugins: ['jsx', 'typescript'],
-};
 const parseSource = async (
   code: string,
   traverseFn: TraverseFn,
   originalSource: string,
   filePath: string,
-  parserOptions?: parser.ParserOptions,
-  prettierOptions?: PrettierOptions,
-  resolveOptions?: resolve.SyncOpts,
+  options?: InstrumentOptions,
 ): Promise<StoriesStore> => {
+  const {
+    parser: parserOptions,
+    prettier: prettierOptions,
+    resolve: resolveOptions,
+    component: componentOptions,
+  } = options || {};
+
+  const mergedOptions = {
+    parser: {
+      ...defaultParserOptions,
+      ...parserOptions,
+    },
+    resolve: {
+      ...defaultResolveOptions,
+      ...resolveOptions,
+    },
+    prettier: prettierOptions,
+    component: componentOptions,
+  };
+
   const prettify = async (c: string): Promise<string> => {
     if (prettierOptions !== false) {
       const { resolveConfigOptions, ...otherOptions } = prettierOptions || {};
@@ -64,11 +76,7 @@ const parseSource = async (
     }
   };
   const source = await prettify(code);
-  const mergedParserOptions = {
-    ...defaultParserOptions,
-    ...parserOptions,
-  };
-  const ast = parser.parse(source, mergedParserOptions);
+  const ast = parser.parse(source, mergedOptions.parser);
   const store: StoriesStore = {
     stories: {},
     kinds: {},
@@ -94,17 +102,7 @@ const parseSource = async (
       {},
     );
   }
-  await extractSotreComponent(
-    store,
-    filePath,
-    source,
-    mergedParserOptions,
-    {
-      ...defaultResolveOptions,
-      ...resolveOptions,
-    },
-    ast,
-  );
+  await extractSotreComponent(store, filePath, source, mergedOptions, ast);
   const kindsNames = Object.keys(store.kinds);
   for (let i = 0; i < kindsNames.length; i += 1) {
     const kind: StoriesKind = store.kinds[kindsNames[i]];
@@ -162,27 +160,21 @@ const parseSource = async (
 export const parseCSF = async (
   source: string,
   filePath: string,
-  parserOptions?: parser.ParserOptions,
-  prettierOptions?: PrettierOptions,
-  resolveOptions?: resolve.SyncOpts,
+  options?: InstrumentOptions,
 ): Promise<StoriesStore> => {
   return await parseSource(
     source,
     extractCSFStories,
     source,
     filePath,
-    parserOptions,
-    prettierOptions,
-    resolveOptions,
+    options,
   );
 };
 
 export const parseMDX = async (
   source: string,
   filePath: string,
-  parserOptions?: parser.ParserOptions,
-  prettierOptions?: PrettierOptions,
-  resolveOptions?: resolve.SyncOpts,
+  options?: InstrumentOptions,
 ): Promise<StoriesStore> => {
   const code = await mdx(source);
 
@@ -200,8 +192,6 @@ export const parseMDX = async (
     extractMDXStories,
     source,
     filePath,
-    parserOptions,
-    prettierOptions,
-    resolveOptions,
+    options,
   );
 };
diff --git a/core/instrument/src/types.ts b/core/instrument/src/types.ts
@@ -0,0 +1,34 @@
+import * as parser from '@babel/parser';
+import * as resolve from 'resolve';
+import { Options, ResolveConfigOptions } from 'prettier';
+
+export type PrettierOptions = Options & {
+  resolveConfigOptions?: ResolveConfigOptions;
+};
+
+export const defaultResolveOptions: resolve.SyncOpts = {
+  extensions: ['.js', '.jsx', '.ts', '.tsx', '.vue', '.mjs', '.es', '.es6'],
+};
+
+export const defaultParserOptions: parser.ParserOptions = {
+  sourceType: 'module',
+  plugins: ['jsx', 'typescript'],
+};
+
+export interface ComponentOptions {
+  resolveComponent?: (
+    componentName: string,
+    FilePath: string,
+  ) => string | undefined;
+}
+
+export type ParserOptions = parser.ParserOptions;
+
+export type ResolveOptions = resolve.SyncOpts;
+
+export interface InstrumentOptions {
+  parser?: parser.ParserOptions;
+  prettier?: PrettierOptions;
+  resolve?: ResolveOptions;
+  component?: ComponentOptions;
+}
diff --git a/core/instrument/test/__snapshots__/extract-component.test.ts.snap b/core/instrument/test/__snapshots__/extract-component.test.ts.snap
@@ -1,8 +1,8 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`extract-component non-existing-file.js 1`] = `
+exports[`extract-component node-modules.js 1`] = `
 Object {
-  "from": "./Button",
+  "from": "theme-ui",
   "loc": undefined,
   "name": "Button",
   "repository": undefined,

diff --git a/core/instrument/test/examples/extract-component/node-modules.js b/core/instrument/test/examples/extract-component/node-modules.js
@@ -0,0 +1 @@
+import { Button } from 'theme-ui';
diff --git a/core/instrument/test/extract-component.test.ts b/core/instrument/test/extract-component.test.ts
@@ -5,18 +5,17 @@ import { extractComponent } from '../src/babel/extract-component';
 
 describe('extract-component', () => {
   const folderName = path.join(__dirname, 'examples', 'extract-component');
-  const fileNames = fs.readdirSync(folderName);
+  const fileNames = fs
+    .readdirSync(folderName)
+    .filter(fn => fn === 'node-modules.js');
   fileNames.forEach(file => {
     const fileName = path.join(folderName, file);
     it(file, async () => {
       expect(
-        await extractComponent(
-          'Button',
-          fileName,
-          undefined,
-          defaultParserOptions,
-          defaultResolveOptions,
-        ),
+        await extractComponent('Button', fileName, undefined, {
+          parser: defaultParserOptions,
+          resolve: defaultResolveOptions,
+        }),
       ).toMatchSnapshot();
     });
   });

diff --git a/core/instrument/test/extract-exports.test.ts b/core/instrument/test/extract-exports.test.ts
@@ -4,7 +4,7 @@ import { defaultParserOptions } from '../src/index';
 import { extractExports } from '../src/babel/extract-exports';
 
 describe('extract-exports', () => {
-  const extractExportsForFile = fileName => {
+  const extractExportsForFile = (fileName: string) => {
     const content = fs.readFileSync(path.join(__dirname, fileName), 'utf8');
     return extractExports(content, defaultParserOptions);
   };

diff --git a/core/instrument/test/follow-imports.test.ts b/core/instrument/test/follow-imports.test.ts
@@ -6,13 +6,10 @@ describe('follow-imports', () => {
     importName: string,
     fileName: string,
   ) => {
-    return followImports(
-      importName,
-      require.resolve(fileName),
-      undefined,
-      defaultParserOptions,
-      defaultResolveOptions,
-    );
+    return followImports(importName, require.resolve(fileName), undefined, {
+      parser: defaultParserOptions,
+      resolve: defaultResolveOptions,
+    });
   };
   it('simple import', () => {
     expect(