@storybook/codemod 7.0.0-beta.2 → 7.0.0-beta.21

package/src/transforms/__tests__/csf-2-to-3.test.ts

@@ -1,4 +1,4 @@
-import { describe, it, expect } from '@jest/globals';
+// import { describe, it, expect } from '@jest/globals';
 import { dedent } from 'ts-dedent';
 import _transform from '../csf-2-to-3';
 
@@ -7,8 +7,10 @@ expect.addSnapshotSerializer({
   test: () => true,
 });
 
-const jsTransform = (source: string) => _transform({ source }, null, {}).trim();
-const tsTransform = (source: string) => _transform({ source }, null, { parser: 'tsx' }).trim();
+const jsTransform = (source: string) =>
+  _transform({ source, path: 'Component.stories.js' }, null, {}).trim();
+const tsTransform = (source: string) =>
+  _transform({ source, path: 'Component.stories.ts' }, null, { parser: 'tsx' }).trim();
 
 describe('csf-2-to-3', () => {
   describe('javascript', () => {

package/src/transforms/csf-2-to-3.ts

@@ -3,7 +3,7 @@ import prettier from 'prettier';
 import * as t from '@babel/types';
 import type { CsfFile } from '@storybook/csf-tools';
 import { formatCsf, loadCsf } from '@storybook/csf-tools';
-import { jscodeshiftToPrettierParser } from '../lib/utils';
+import type { API, FileInfo, Options } from 'jscodeshift';
 
 const logger = console;
 
@@ -89,7 +89,7 @@ const isReactGlobalRenderFn = (csf: CsfFile, storyFn: t.Expression) => {
 const isSimpleCSFStory = (init: t.Expression, annotations: t.ObjectProperty[]) =>
   annotations.length === 0 && t.isArrowFunctionExpression(init) && init.params.length === 0;
 
-function transform({ source }: { source: string }, api: any, options: { parser?: string }) {
+export default function transform({ source, path }: FileInfo, api: API, options: Options) {
   const makeTitle = (userTitle?: string) => {
     return userTitle || 'FIXME';
   };
@@ -165,20 +165,27 @@ function transform({ source }: { source: string }, api: any, options: { parser?:
     return acc;
   }, []);
   csf._ast.program.body = updatedBody;
-  const output = formatCsf(csf);
-
-  const prettierConfig = prettier.resolveConfig.sync('.', { editorconfig: true }) || {
-    printWidth: 100,
-    tabWidth: 2,
-    bracketSpacing: true,
-    trailingComma: 'es5',
-    singleQuote: true,
-  };
+  let output = formatCsf(csf);
 
-  return prettier.format(output, {
-    ...prettierConfig,
-    parser: jscodeshiftToPrettierParser(options?.parser),
-  });
+  try {
+    const prettierConfig = prettier.resolveConfig.sync('.', { editorconfig: true }) || {
+      printWidth: 100,
+      tabWidth: 2,
+      bracketSpacing: true,
+      trailingComma: 'es5',
+      singleQuote: true,
+    };
+
+    output = prettier.format(output, {
+      ...prettierConfig,
+      // This will infer the parser from the filename.
+      filepath: path,
+    });
+  } catch (e) {
+    logger.log(`Failed applying prettier to ${path}.`);
+  }
+
+  return output;
 }
 
-export default transform;
+export const parser = 'tsx';

package/tsconfig.json

@@ -1,7 +1,9 @@
 {
   "extends": "../../tsconfig.json",
   "compilerOptions": {
-    "skipLibCheck": true
+    "skipLibCheck": true,
+    "allowJs": true
   },
-  "include": ["src/**/*"]
+  "include": ["src/**/*"],
+  "exclude": ["node_modules", "__testfixtures__", "__tests__"]
 }