wip: add utils and support for storybook v7 tests only

percy · Oct 25, 2023 · c23158d · c23158d
1 parent c252c87
commit c23158d
Show file tree

Hide file tree

Showing 8 changed files with 9,192 additions and 10,823 deletions.
diff --git a/package.json b/package.json
@@ -24,7 +24,7 @@
     "clean": "git clean -Xdf -e !node_modules -e !node_modules/**",
     "lint": "eslint --ignore-path .gitignore .",
     "readme": "percy-cli-readme",
-    "pretest": "node ./test/pretest.js",
+    "pretest": "storybook build --config-dir=./test/.storybook --output-dir=./test/.storybook-build --loglevel error",
     "test": "yarn test:env jasmine --config=./test/jasmine.json",
     "test:env": "cross-env NODE_ENV=test NODE_OPTIONS='--loader=./test/loader.js'",
     "test:coverage": "nyc yarn test"
@@ -45,7 +45,7 @@
     "@babel/eslint-parser": "^7.19.1",
     "@babel/eslint-plugin": "^7.19.1",
     "@babel/preset-env": "^7.22.9",
-    "@storybook/react": "^6.5.13",
+    "@storybook/react": "^7.5.0",
     "@storybook/react-webpack5": "^7.5.0",
     "babel-eslint": "^10.0.3",
     "babel-plugin-istanbul": "^6.1.1",

diff --git a/src/start.js b/src/start.js
@@ -1,5 +1,6 @@
 import command from '@percy/cli-command';
 import * as common from './common.js';
+import { checkStorybookVersion } from './utils.js';
 
 export const start = command('start', {
   description: 'Run start-storybook to snapshot stories',
@@ -31,12 +32,12 @@ export const start = command('start', {
   let { takeStorybookSnapshots } = yield import('./snapshots.js');
   let { default: { spawn } } = yield import('cross-spawn');
   let { host, port } = flags;
-  let storybookVersion = process.env.STORYBOOK_VERSION || '6';
+  let storybookVersion = await checkStorybookVersion();
 
-  let args = storybookVersion === '7' ? ['dev'] : [];
+  let args = storybookVersion === 7 ? ['dev'] : [];
   args = args.concat(['--ci', `--host=${host}`, `--port=${port}`, ...argv]);
 
-  let storybookBinary = storybookVersion === '7' ? 'storybook' : 'start-storybook';
+  let storybookBinary = storybookVersion === 7 ? 'storybook' : 'start-storybook';
 
   log.info(`Running "${storybookBinary} ${args.join(' ')}"`);
 

diff --git a/src/utils.js b/src/utils.js
@@ -1,4 +1,19 @@
 import { request, createRootResource, yieldTo } from '@percy/cli-command/utils';
+import spawn from 'cross-spawn';
+
+// check storybook version
+export function checkStorybookVersion() {
+  return new Promise((resolve, reject) => {
+    spawn('storybook', ['--version'])
+      .on('exit', (code) => { if (code === 0) resolve(7); })
+      .on('error', (err) => {
+        if (err.code === 'ENOENT') {
+          resolve(6);
+        }
+        reject(err);
+      });
+  });
+}
 
 // Transforms authorization credentials into a basic auth header and returns all config request
 // headers with the additional authorization header if not already set.

diff --git a/test/.storybook/main.js b/test/.storybook/main.js
@@ -1,16 +1,10 @@
-let storybookVersion = process.env.STORYBOOK_VERSION || '6';
-let config = {
+module.exports = {
   stories: ['*.stories.js'],
   features: {
     postcss: false
-  }
-};
-
-if(storybookVersion === '7'){
-  config['framework'] = {
+  },
+  framework: {
     name: '@storybook/react-webpack5',
     options: {}
   }
-}
-
-module.exports = config
+};
diff --git a/test/.storybook/mainV6.js b/test/.storybook/mainV6.js
@@ -0,0 +1,6 @@
+module.exports = {
+  stories: ['*.stories.js'],
+  features: {
+    postcss: false
+  }
+};
diff --git a/test/pretest.js b/test/pretest.js
diff --git a/test/storybook.test.js b/test/storybook.test.js
@@ -3,6 +3,7 @@ import spawn from 'cross-spawn';
 import { request } from '@percy/cli-command/utils';
 import { api, logger, setupTest, createTestServer } from '@percy/cli-command/test/helpers';
 import { storybook } from '../src/index.js';
+import { checkStorybookVersion } from '../src/utils.js';
 
 describe('percy storybook', () => {
   let server, proc;
@@ -16,14 +17,14 @@ describe('percy storybook', () => {
       default: () => [200, 'text/html', '<p>Not Storybook</p>']
     });
 
-    let storybookVersion = process.env.STORYBOOK_VERSION || '6';
-    let args = storybookVersion === '7' ? ['dev'] : [];
+    let storybookVersion = await checkStorybookVersion();
+    let args = storybookVersion === 7 ? ['dev'] : [];
     args = args.concat([
       '--config-dir=./test/.storybook',
       '--port=9000',
       '--ci'
     ]);
-    let storybookBinary = storybookVersion === '7' ? 'storybook' : 'start-storybook';
+    let storybookBinary = storybookVersion === 7 ? 'storybook' : 'start-storybook';
 
     proc = spawn(storybookBinary, args, { stdio: 'inherit' });