Core: Implement file formatter

code/lib/core-common/package.json

@@ -65,6 +65,7 @@
     "node-fetch": "^2.0.0",
     "picomatch": "^2.3.0",
     "pkg-dir": "^5.0.0",
+    "prettier-fallback": "npm:prettier@^3",
     "pretty-hrtime": "^1.0.3",
     "resolve-from": "^5.0.0",
     "semver": "^7.3.7",
@@ -80,12 +81,23 @@
     "@types/node": "^18.0.0",
     "@types/node-fetch": "^2.6.4",
     "@types/picomatch": "^2.3.0",
+    "@types/prettier-v2": "npm:@types/prettier@^2",
     "@types/pretty-hrtime": "^1.0.0",
     "mock-fs": "^5.2.0",
+    "prettier-v2": "npm:prettier@^2",
+    "prettier-v3": "npm:prettier@^3",
     "slash": "^5.0.0",
     "type-fest": "~2.19",
     "typescript": "^5.3.2"
   },
+  "peerDependencies": {
+    "prettier": "^2 || ^3"
+  },
+  "peerDependenciesMeta": {
+    "prettier": {
+      "optional": true
+    }
+  },
   "publishConfig": {
     "access": "public"
   },

code/lib/core-common/src/index.ts

@@ -37,6 +37,7 @@ export * from './utils/validate-config';
 export * from './utils/validate-configuration-files';
 export * from './utils/satisfies';
 export * from './utils/strip-abs-node-modules-path';
+export * from './utils/formatter';
 export * from './js-package-manager';
 
 import versions from './versions';

code/lib/core-common/src/utils/__snapshots__/formatter.test.ts.snap

@@ -0,0 +1,76 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`formatter > withPrettierConfig > prettier-v2 > formats content with prettier 1`] = `
+"import type { Meta, StoryObj } from '@storybook/nextjs';
+
+import Component from './foo';
+
+const meta = {
+    component: Component,
+} satisfies Meta<typeof Component>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+"
+`;
+
+exports[`formatter > withPrettierConfig > prettier-v3 > formats content with prettier 1`] = `
+"import type { Meta, StoryObj } from '@storybook/nextjs';
+
+import Component from './foo';
+
+const meta = {
+    component: Component,
+} satisfies Meta<typeof Component>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+"
+`;
+
+exports[`formatter > withoutPrettierConfigAndWithEditorConfig > prettier not available > should return the content formatted by settings of editorconfig 1`] = `
+"import type { Meta, StoryObj } from "@storybook/nextjs";
+
+import Component from "./foo";
+
+const meta = {
+      component: Component,
+} satisfies Meta<typeof Component>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+"
+`;
+
+exports[`formatter > withoutPrettierConfigAndWithEditorConfig > prettier-v2 > formats content with prettier 1`] = `
+"import type { Meta, StoryObj } from "@storybook/nextjs";
+
+import Component from "./foo";
+
+const meta = {
+      component: Component,
+} satisfies Meta<typeof Component>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+"
+`;
+
+exports[`formatter > withoutPrettierConfigAndWithEditorConfig > prettier-v3 > formats content with prettier 1`] = `
+"import type { Meta, StoryObj } from "@storybook/nextjs";
+
+import Component from "./foo";
+
+const meta = {
+      component: Component,
+} satisfies Meta<typeof Component>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+"
+`;

code/lib/core-common/src/utils/__tests-formatter__/withPrettierConfig/.prettierrc

@@ -0,0 +1,6 @@
+{
+    "trailingComma": "es5",
+    "tabWidth": 4,
+    "semi": true,
+    "singleQuote": true
+}

code/lib/core-common/src/utils/__tests-formatter__/withoutEditorConfig/.editorconfig

@@ -0,0 +1,3 @@
+root = true
+
+[*]

code/lib/core-common/src/utils/__tests-formatter__/withoutPrettierConfig/.editorconfig

@@ -0,0 +1,8 @@
+root = true
+
+[*]
+end_of_line = lf
+insert_final_newline = true
+indent_style = space
+indent_size = 6
+

code/lib/core-common/src/utils/formatter.test.ts

@@ -0,0 +1,183 @@
+import { formatFileContent } from './formatter';
+import { describe, it, expect, vi } from 'vitest';
+import path from 'node:path';
+
+const mockPrettier = vi.hoisted(() => ({
+  resolveConfig: vi.fn(),
+  format: vi.fn(),
+  version: vi.fn(),
+}));
+
+vi.mock('prettier', () => ({
+  resolveConfig: mockPrettier.resolveConfig,
+  format: mockPrettier.format,
+  get version() {
+    return mockPrettier.version();
+  },
+}));
+
+const dummyContent = `
+import type { Meta, StoryObj } from '@storybook/nextjs'
+
+import Component from './foo';
+
+  const meta = {
+    component: Component
+  } satisfies Meta<typeof Component>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+`;
+
+describe('formatter', () => {
+  describe('withPrettierConfig', () => {
+    const testPath = path.resolve(__dirname, '__tests-formatter__', 'withPrettierConfig');
+
+    describe('prettier-v2', async () => {
+      const prettierV2 = await import('prettier-v2');
+
+      it('formats content with prettier', async () => {
+        mockPrettier.format.mockImplementation(prettierV2.format);
+        mockPrettier.version.mockReturnValue(prettierV2.version);
+        mockPrettier.resolveConfig.mockImplementation(prettierV2.resolveConfig);
+
+        const filePath = path.resolve(testPath, 'testFile.ts');
+
+        const result = await formatFileContent(filePath, dummyContent);
+
+        expect(result).toMatchSnapshot();
+      });
+    });
+
+    describe('prettier-v3', async () => {
+      const prettierV3 = await import('prettier-v3');
+
+      it('formats content with prettier', async () => {
+        mockPrettier.format.mockImplementation(prettierV3.format);
+        mockPrettier.version.mockReturnValue(prettierV3.version);
+        mockPrettier.resolveConfig.mockImplementation(prettierV3.resolveConfig);
+
+        const filePath = path.resolve(testPath, 'testFile.ts');
+
+        const result = await formatFileContent(filePath, dummyContent);
+
+        expect(result).toMatchSnapshot();
+      });
+    });
+
+    describe('prettier not available', async () => {
+      it('should return the content as is', async () => {
+        mockPrettier.format.mockImplementation(() => {
+          throw new Error('Prettier not available');
+        });
+
+        const filePath = path.resolve(testPath, 'testFile.ts');
+
+        const result = await formatFileContent(filePath, dummyContent);
+
+        expect(result).toBe(dummyContent);
+      });
+    });
+  });
+
+  describe('withoutPrettierConfigAndWithEditorConfig', () => {
+    const testPath = path.resolve(__dirname, '__tests-formatter__', 'withoutPrettierConfig');
+
+    describe('prettier-v2', async () => {
+      const prettierV2 = await import('prettier-v2');
+
+      it('formats content with prettier', async () => {
+        mockPrettier.format.mockImplementation(prettierV2.format);
+        mockPrettier.version.mockReturnValue(prettierV2.version);
+        mockPrettier.resolveConfig.mockImplementation(prettierV2.resolveConfig);
+
+        const filePath = path.resolve(testPath, 'testFile.ts');
+
+        const result = await formatFileContent(filePath, dummyContent);
+
+        expect(result).toMatchSnapshot();
+      });
+    });
+
+    describe('prettier-v3', async () => {
+      const prettierV3 = await import('prettier-v3');
+
+      it('formats content with prettier', async () => {
+        mockPrettier.format.mockImplementation(prettierV3.format);
+        mockPrettier.version.mockReturnValue(prettierV3.version);
+        mockPrettier.resolveConfig.mockImplementation(prettierV3.resolveConfig);
+
+        const filePath = path.resolve(testPath, 'testFile.ts');
+
+        const result = await formatFileContent(filePath, dummyContent);
+
+        expect(result).toMatchSnapshot();
+      });
+    });
+
+    describe('prettier not available', async () => {
+      it('should return the content formatted by settings of editorconfig', async () => {
+        mockPrettier.format.mockImplementation(() => {
+          throw new Error('Prettier not available');
+        });
+
+        const filePath = path.resolve(testPath, 'testFile.ts');
+
+        const result = await formatFileContent(filePath, dummyContent);
+
+        expect(result).toMatchSnapshot();
+      });
+    });
+  });
+
+  describe('withoutPrettierConfigAndWithEditorConfig', () => {
+    const testPath = path.resolve(__dirname, '__tests-formatter__', 'withoutEditorConfig');
+
+    describe('prettier-v2', async () => {
+      const prettierV2 = await import('prettier-v2');
+
+      it('formats content with prettier', async () => {
+        mockPrettier.format.mockImplementation(prettierV2.format);
+        mockPrettier.version.mockReturnValue(prettierV2.version);
+        mockPrettier.resolveConfig.mockResolvedValue(null);
+
+        const filePath = path.resolve(testPath, 'testFile.ts');
+
+        const result = await formatFileContent(filePath, dummyContent);
+
+        expect(result).toBe(dummyContent);
+      });
+    });
+
+    describe('prettier-v3', async () => {
+      const prettierV3 = await import('prettier-v3');
+
+      it('formats content with prettier', async () => {
+        mockPrettier.format.mockImplementation(prettierV3.format);
+        mockPrettier.version.mockReturnValue(prettierV3.version);
+        mockPrettier.resolveConfig.mockResolvedValue(null);
+
+        const filePath = path.resolve(testPath, 'testFile.ts');
+
+        const result = await formatFileContent(filePath, dummyContent);
+
+        expect(result).toBe(dummyContent);
+      });
+    });
+
+    describe('prettier not available', async () => {
+      it('should return the content as is', async () => {
+        mockPrettier.format.mockImplementation(() => {
+          throw new Error('Prettier not available');
+        });
+
+        const filePath = path.resolve(testPath, 'testFile.ts');
+
+        const result = await formatFileContent(filePath, dummyContent);
+
+        expect(result).toBe(dummyContent);
+      });
+    });
+  });
+});