Merge pull request #9834 from davidgoli/support-jsx-preview-files

Storyshots: Fix support for jsx/tsx config files

__mocks__/fs.js

@@ -14,10 +14,14 @@ function __setMockFiles(newMockFiles) {
 // file list set via __setMockFiles
 const readFileSync = (filePath = '') => mockFiles[filePath];
 const existsSync = filePath => !!mockFiles[filePath];
+const lstatSync = filePath => ({
+  isFile: () => !!mockFiles[filePath],
+});
 
 // eslint-disable-next-line no-underscore-dangle
 fs.__setMockFiles = __setMockFiles;
 fs.readFileSync = readFileSync;
 fs.existsSync = existsSync;
+fs.lstatSync = lstatSync;
 
 module.exports = fs;

addons/storyshots/storyshots-core/src/frameworks/configure.test.ts

@@ -0,0 +1,52 @@
+import { getPreviewFile, getMainFile } from './configure';
+
+// eslint-disable-next-line global-require, jest/no-mocks-import
+jest.mock('fs', () => require('../../../../../__mocks__/fs'));
+const setupFiles = (files: Record<string, string>) => {
+  // eslint-disable-next-line no-underscore-dangle, global-require
+  require('fs').__setMockFiles(files);
+};
+
+describe('preview files', () => {
+  it.each`
+    filepath
+    ${'preview.ts'}
+    ${'preview.tsx'}
+    ${'preview.js'}
+    ${'preview.jsx'}
+    ${'config.ts'}
+    ${'config.tsx'}
+    ${'config.js'}
+    ${'config.jsx'}
+  `('resolves a valid preview file from $filepath', ({ filepath }) => {
+    setupFiles({ [`test/${filepath}`]: 'true' });
+
+    expect(getPreviewFile('test/')).toEqual(`test/${filepath}`);
+  });
+
+  it('returns false when none of the paths exist', () => {
+    setupFiles(Object.create(null));
+
+    expect(getPreviewFile('test/')).toEqual(false);
+  });
+});
+
+describe('main files', () => {
+  it.each`
+    filepath
+    ${'main.ts'}
+    ${'main.tsx'}
+    ${'main.js'}
+    ${'main.jsx'}
+  `('resolves a valid main file path from $filepath', ({ filepath }) => {
+    setupFiles({ [`test/${filepath}`]: 'true' });
+
+    expect(getMainFile('test/')).toEqual(`test/${filepath}`);
+  });
+
+  it('returns false when none of the paths exist', () => {
+    setupFiles(Object.create(null));
+
+    expect(getPreviewFile('test/')).toEqual(false);
+  });
+});

addons/storyshots/storyshots-core/src/frameworks/configure.ts

@@ -21,41 +21,17 @@ interface Output {
   files: string[];
 }
 
-const getPreviewFile = (configDir: string): string | false => {
-  const preview = path.join(configDir, 'preview.js');
-  const previewTS = path.join(configDir, 'preview.ts');
-  const config = path.join(configDir, 'config.js');
-  const configTS = path.join(configDir, 'config.ts');
-
-  if (isFile(previewTS)) {
-    return previewTS;
-  }
-  if (isFile(preview)) {
-    return preview;
-  }
-  if (isFile(configTS)) {
-    return configTS;
-  }
-  if (isFile(config)) {
-    return config;
-  }
+const supportedExtensions = ['ts', 'tsx', 'js', 'jsx'];
 
-  return false;
-};
+const resolveFile = (configDir: string, supportedFilenames: string[]) =>
+  supportedFilenames
+    .flatMap(filename => supportedExtensions.map(ext => path.join(configDir, `${filename}.${ext}`)))
+    .find(isFile) || false;
 
-const getMainFile = (configDir: string): string | false => {
-  const main = path.join(configDir, 'main.js');
-  const mainTS = path.join(configDir, 'main.ts');
+export const getPreviewFile = (configDir: string): string | false =>
+  resolveFile(configDir, ['preview', 'config']);
 
-  if (isFile(mainTS)) {
-    return mainTS;
-  }
-  if (isFile(main)) {
-    return main;
-  }
-
-  return false;
-};
+export const getMainFile = (configDir: string): string | false => resolveFile(configDir, ['main']);
 
 function getConfigPathParts(input: string): Output {
   const configDir = path.resolve(input);