creevey 0.8.0-beta.0 → 0.8.0

package/lib/cjs/server/loaders/webpack/creevey-loader.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = _default;
+exports.default = loader;
 
 var _path = _interopRequireDefault(require("path"));
 
@@ -19,19 +19,17 @@ var _traverse = _interopRequireDefault(require("@babel/traverse"));
 
 var _generator = _interopRequireDefault(require("@babel/generator"));
 
-var _helpers = require("../../storybook/helpers");
-
-var _helpers2 = require("../babel/helpers");
+var _helpers = require("../babel/helpers");
 
 var _logger = require("../../logger");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function transform(ast) {
-  (0, _traverse.default)(ast, { ..._helpers2.commonVisitor,
-    ...(fileType == _helpers2.FileType.Preview ? _helpers2.previewVisitor : undefined),
-    ...(fileType == _helpers2.FileType.Story ? _helpers2.storyVisitor : undefined),
-    ...(isMDX ? _helpers2.mdxVisitor : undefined)
+  (0, _traverse.default)(ast, { ..._helpers.commonVisitor,
+    ...(fileType == _helpers.FileType.Preview ? _helpers.previewVisitor : undefined),
+    ...(fileType == _helpers.FileType.Story ? _helpers.storyVisitor : undefined),
+    ...(isMDX ? _helpers.mdxVisitor : undefined)
   }, undefined, {
     resourcePath,
     fileType,
@@ -76,11 +74,6 @@ function isPreview(context, options) {
 
   const storybookDir = typeof options.storybookDir == 'string' ? toPosix(options.storybookDir) : '';
   const isConfigFile = resourceDir == storybookDir && (resourceName == 'preview' || resourceName == 'config');
-
-  if ((0, _helpers.isStorybookVersionLessThan)(6)) {
-    return isEntry(context) && isConfigFile;
-  }
-
   const issuerResource = getIssuerResource(context);
   return Boolean(issuerResource && entries.has(issuerResource) && isConfigFile);
 }
@@ -105,39 +98,44 @@ const schema = {
     }
   }
 };
-let fileType = _helpers2.FileType.Invalid;
+let fileType = _helpers.FileType.Invalid;
 let isMDX = false;
 let previewPath = '';
 let resourcePath = '';
 const entries = new Set();
 const stories = new Set();
 const reexportedStories = new Map();
-const isTest = process.env.__CREEVEY_ENV__ == 'test';
+
+const isTest = () => process.env.__CREEVEY_ENV__ == 'test';
+
 const defaultOptions = {
-  debug: isTest,
+  get debug() {
+    return isTest();
+  },
+
   storybookDir: process.cwd()
 };
 
-function _default(source) {
+function loader(source) {
   const options = this ? (0, _loaderUtils.getOptions)(this) || defaultOptions : defaultOptions;
   (0, _schemaUtils.validate)(schema, options, {
     name: 'Creevey Stories Loader'
   });
-  fileType = _helpers2.FileType.Invalid;
+  fileType = _helpers.FileType.Invalid;
 
   if (this) {
     const issuerResource = getIssuerResource(this);
     resourcePath = this.resourcePath;
 
     if (isStoryFile(this)) {
-      fileType = _helpers2.FileType.Story;
+      fileType = _helpers.FileType.Story;
       isMDX = _path.default.parse(resourcePath).ext == '.mdx';
       stories.add(this.resourcePath);
     } else if (isPreview(this, options)) {
-      fileType = _helpers2.FileType.Preview;
+      fileType = _helpers.FileType.Preview;
       previewPath = this.resourcePath;
     } else if (isEntry(this)) {
-      fileType = _helpers2.FileType.Entry;
+      fileType = _helpers.FileType.Entry;
       entries.add(this.resourcePath);
       return source;
     } else if (issuerResource && stories.has(issuerResource) && options.debug) {
@@ -146,7 +144,7 @@ function _default(source) {
     }
   }
 
-  if (isTest && !Number.isNaN(Number(process.env.CREEVEY_LOADER_FILE_TYPE))) {
+  if (isTest() && !Number.isNaN(Number(process.env.CREEVEY_LOADER_FILE_TYPE))) {
     fileType = Number(process.env.CREEVEY_LOADER_FILE_TYPE);
   }
 

package/lib/cjs/server/loaders/webpack/dummy-hmr.js

@@ -4,19 +4,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
-var _global$__CREEVEY_HMR;
-
-global.__CREEVEY_HMR_DATA__ = (_global$__CREEVEY_HMR = global.__CREEVEY_HMR_DATA__) !== null && _global$__CREEVEY_HMR !== void 0 ? _global$__CREEVEY_HMR : {};
+global.__CREEVEY_HMR_DATA__ = global.__CREEVEY_HMR_DATA__ ?? {};
 Object.entries(__webpack_require__.m).forEach(([key, moduleFn]) => {
   __webpack_require__.m[key] = new Proxy(moduleFn, {
     apply(target, thisArg, args) {
-      var _global$__CREEVEY_HMR2;
-
       const [module] = args;
       const {
         data
-      } = global.__CREEVEY_HMR_DATA__[module.i] = (_global$__CREEVEY_HMR2 = global.__CREEVEY_HMR_DATA__[module.i]) !== null && _global$__CREEVEY_HMR2 !== void 0 ? _global$__CREEVEY_HMR2 : {
+      } = global.__CREEVEY_HMR_DATA__[module.i] = global.__CREEVEY_HMR_DATA__[module.i] ?? {
         data: {}
       };
       Object.assign(module, {

package/lib/cjs/server/loaders/webpack/mdx-loader.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.webpack = webpack;
 exports.mdxOptions = exports.mdxLoaders = void 0;
+exports.webpack = webpack;
 
 var _helpers = require("../../storybook/helpers");
 
@@ -58,7 +58,7 @@ function webpack(webpackConfig = {}, options = {}) {
     configureJSX = true
   } = options;
   exports.mdxLoaders = mdxLoaders = [{
-    loader: (0, _helpers.isStorybookVersionLessThan)(6, 2) ? (0, _helpers.resolveFromStorybookCore)('babel-loader') : (0, _helpers.resolveFromStorybookBuilderWebpack4)('babel-loader'),
+    loader: (0, _helpers.resolveFromStorybookBuilderWebpack4)('babel-loader'),
     options: createBabelOptions({
       babelOptions,
       mdxBabelOptions,

package/lib/cjs/server/loaders/webpack/start.js

@@ -23,7 +23,7 @@ function startWebpackCompiler() {
 
     webpackCompiler.on('message', message => {
       if (!(0, _types.isWebpackMessage)(message)) return;
-      Object.values(_cluster.default.workers).filter(worker => worker != webpackCompiler).forEach(worker => worker === null || worker === void 0 ? void 0 : worker.send(message));
+      Object.values(_cluster.default.workers ?? {}).filter(worker => worker != webpackCompiler).forEach(worker => worker === null || worker === void 0 ? void 0 : worker.send(message));
 
       switch (message.type) {
         case 'success':

package/lib/cjs/server/logger.js

@@ -3,13 +3,14 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.colors = void 0;
 Object.defineProperty(exports, "getLogger", {
   enumerable: true,
   get: function () {
     return _loglevel.getLogger;
   }
 });
-exports.logger = exports.colors = void 0;
+exports.logger = void 0;
 
 var _chalk = _interopRequireDefault(require("chalk"));
 

package/lib/cjs/server/master/index.js

@@ -105,9 +105,9 @@ async function _default(config, options, resolveApi) {
   });
   runner = await (0, _master.default)(config, {
     watch: options.ui,
-    debug: options.debug
+    debug: options.debug,
+    port: options.port
   });
-  await runner.init();
 
   if (options.saveReport) {
     await copyStatics(config.reportDir);
@@ -132,9 +132,9 @@ async function _default(config, options, resolveApi) {
     }
 
     runner.once('stop', () => {
-      var _runner$status$tests, _runner6;
+      var _runner6;
 
-      const tests = Object.values((_runner$status$tests = (_runner6 = runner) === null || _runner6 === void 0 ? void 0 : _runner6.status.tests) !== null && _runner$status$tests !== void 0 ? _runner$status$tests : {});
+      const tests = Object.values(((_runner6 = runner) === null || _runner6 === void 0 ? void 0 : _runner6.status.tests) ?? {});
       const isSuccess = tests.filter(_types.isDefined).filter(({
         skip
       }) => !skip).every(({

package/lib/cjs/server/master/master.js

@@ -46,6 +46,7 @@ async function master(config, options) {
   } catch (error) {// Ignore error
   }
 
+  await runner.init();
   const tests = await (0, _stories.loadTestsFromStories)(Object.keys(config.browsers), listener => config.storiesProvider(config, options, listener), testsDiff => {
     runner.updateTests(testsDiff);
     (0, _stories.saveTestsJson)(runner.tests, config.reportDir);

package/lib/cjs/server/master/pool.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _cluster = _interopRequireDefault(require("cluster"));
+var _cluster = _interopRequireWildcard(require("cluster"));
 
 var _events = require("events");
 
@@ -15,13 +15,17 @@ var _messages = require("../messages");
 
 var _utils = require("../utils");
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 const FORK_RETRIES = 5;
 
 class Pool extends _events.EventEmitter {
+  workers = [];
+  queue = [];
+  forcedStop = false;
+
   get isRunning() {
     return this.workers.length !== this.freeWorkers.length;
   }
@@ -29,19 +33,6 @@ class Pool extends _events.EventEmitter {
   constructor(config, browser) {
     super();
     this.browser = browser;
-
-    _defineProperty(this, "maxRetries", void 0);
-
-    _defineProperty(this, "config", void 0);
-
-    _defineProperty(this, "workers", []);
-
-    _defineProperty(this, "queue", []);
-
-    _defineProperty(this, "forcedStop", false);
-
-    _defineProperty(this, "failFast", void 0);
-
     this.failFast = config.failFast;
     this.maxRetries = config.maxRetries;
     this.config = config.browsers[browser];
@@ -51,7 +42,7 @@ class Pool extends _events.EventEmitter {
     const poolSize = this.config.limit || 1;
     this.workers = (await Promise.all(Array.from({
       length: poolSize
-    }).map(() => this.forkWorker()))).filter(workerOrError => workerOrError instanceof _cluster.default.Worker);
+    }).map(() => this.forkWorker()))).filter(workerOrError => workerOrError instanceof _cluster.Worker);
     if (this.workers.length != poolSize) throw new Error(`Can't instantiate workers for ${this.browser} due many errors`);
     this.workers.forEach(worker => this.exitHandler(worker));
   }
@@ -151,7 +142,7 @@ class Pool extends _events.EventEmitter {
     worker.once('exit', async () => {
       if (_utils.isShuttingDown.current) return;
       const workerOrError = await this.forkWorker();
-      if (!(workerOrError instanceof _cluster.default.Worker)) throw new Error(`Can't instantiate worker for ${this.browser} due many errors`);
+      if (!(workerOrError instanceof _cluster.Worker)) throw new Error(`Can't instantiate worker for ${this.browser} due many errors`);
       this.exitHandler(workerOrError);
       this.workers[this.workers.indexOf(worker)] = workerOrError;
       this.process();
@@ -168,37 +159,37 @@ class Pool extends _events.EventEmitter {
     return test.retries < this.maxRetries && !this.forcedStop;
   }
 
+  handleTestResult(worker, test, result) {
+    const shouldRetry = result.status == 'failed' && this.shouldRetry(test);
+
+    if (shouldRetry) {
+      test.retries += 1;
+      this.queue[this.failFast ? 'unshift' : 'push'](test);
+    }
+
+    this.sendStatus({
+      id: test.id,
+      status: shouldRetry ? 'retrying' : result.status,
+      result
+    });
+    worker.isRunning = false;
+    setImmediate(() => this.process());
+  }
+
   subscribe(worker, test) {
-    worker.once('message', message => {
-      if (!(0, _types.isWorkerMessage)(message) && !(0, _types.isTestMessage)(message)) return;
-      if (message.type != 'end' && message.type != 'error') return;
-      let result;
-
-      if (message.type == 'error') {
-        this.gracefullyKill(worker);
-        result = {
-          status: 'failed',
-          ...message.payload
-        };
-      } else {
-        result = message.payload;
-      }
-
-      const shouldRetry = result.status == 'failed' && this.shouldRetry(test);
-
-      if (shouldRetry) {
-        test.retries += 1;
-        this.queue[this.failFast ? 'unshift' : 'push'](test);
-      }
-
-      this.sendStatus({
-        id: test.id,
-        status: shouldRetry ? 'retrying' : result.status,
-        result
+    const subscriptions = [(0, _messages.subscribeOnWorker)(worker, 'worker', message => {
+      if (message.type != 'error') return;
+      subscriptions.forEach(unsubscribe => unsubscribe());
+      this.gracefullyKill(worker);
+      this.handleTestResult(worker, test, {
+        status: 'failed',
+        ...message.payload
       });
-      worker.isRunning = false;
-      this.process();
-    });
+    }), (0, _messages.subscribeOnWorker)(worker, 'test', message => {
+      if (message.type != 'end') return;
+      subscriptions.forEach(unsubscribe => unsubscribe());
+      this.handleTestResult(worker, test, message.payload);
+    })];
   }
 
 }

package/lib/cjs/server/master/runner.js

@@ -19,69 +19,44 @@ var _pool = _interopRequireDefault(require("./pool"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 const copyFileAsync = (0, _util.promisify)(_fs.copyFile);
 const mkdirAsync = (0, _util.promisify)(_fs.mkdir);
 
 class Runner extends _events.EventEmitter {
+  pools = {};
+  tests = {};
+
   get isRunning() {
     return Object.values(this.pools).some(pool => pool.isRunning);
   }
 
   constructor(config) {
     super();
+    this.failFast = config.failFast;
+    this.screenDir = config.screenDir;
+    this.reportDir = config.reportDir;
+    this.browsers = Object.keys(config.browsers);
+    this.browsers.map(browser => this.pools[browser] = new _pool.default(config, browser)).map(pool => pool.on('test', this.handlePoolMessage));
+  }
 
-    _defineProperty(this, "failFast", void 0);
-
-    _defineProperty(this, "screenDir", void 0);
-
-    _defineProperty(this, "reportDir", void 0);
-
-    _defineProperty(this, "browsers", void 0);
-
-    _defineProperty(this, "pools", {});
-
-    _defineProperty(this, "tests", {});
-
-    _defineProperty(this, "handlePoolMessage", message => {
-      const {
-        id,
-        status,
-        result
-      } = message;
-      const test = this.tests[id];
-      if (!test) return;
-      const {
-        browser,
-        testName,
-        storyPath,
-        storyId
-      } = test; // TODO Handle 'retrying' status
-
-      test.status = status == 'retrying' ? 'failed' : status;
-
-      if (!result) {
-        this.sendUpdate({
-          tests: {
-            [id]: {
-              id,
-              browser,
-              testName,
-              storyPath,
-              status: test.status,
-              storyId
-            }
-          }
-        });
-        return;
-      }
+  handlePoolMessage = message => {
+    const {
+      id,
+      status,
+      result
+    } = message;
+    const test = this.tests[id];
+    if (!test) return;
+    const {
+      browser,
+      testName,
+      storyPath,
+      storyId
+    } = test; // TODO Handle 'retrying' status
 
-      if (!test.results) {
-        test.results = [];
-      }
+    test.status = status == 'retrying' ? 'failed' : status;
 
-      test.results.push(result);
+    if (!result) {
       this.sendUpdate({
         tests: {
           [id]: {
@@ -90,29 +65,41 @@ class Runner extends _events.EventEmitter {
             testName,
             storyPath,
             status: test.status,
-            results: [result],
             storyId
           }
         }
       });
-      if (this.failFast && status == 'failed') this.stop();
-    });
+      return;
+    }
 
-    _defineProperty(this, "handlePoolStop", () => {
-      if (!this.isRunning) {
-        this.sendUpdate({
-          isRunning: false
-        });
-        this.emit('stop');
+    if (!test.results) {
+      test.results = [];
+    }
+
+    test.results.push(result);
+    this.sendUpdate({
+      tests: {
+        [id]: {
+          id,
+          browser,
+          testName,
+          storyPath,
+          status: test.status,
+          results: [result],
+          storyId
+        }
       }
     });
-
-    this.failFast = config.failFast;
-    this.screenDir = config.screenDir;
-    this.reportDir = config.reportDir;
-    this.browsers = Object.keys(config.browsers);
-    this.browsers.map(browser => this.pools[browser] = new _pool.default(config, browser)).map(pool => pool.on('test', this.handlePoolMessage));
-  }
+    if (this.failFast && status == 'failed') this.stop();
+  };
+  handlePoolStop = () => {
+    if (!this.isRunning) {
+      this.sendUpdate({
+        isRunning: false
+      });
+      this.emit('stop');
+    }
+  };
 
   async init() {
     await Promise.all(Object.values(this.pools).map(pool => pool.init()));

package/lib/cjs/server/master/server.js

@@ -9,12 +9,18 @@ var _path = _interopRequireDefault(require("path"));
 
 var _http = _interopRequireDefault(require("http"));
 
+var _cluster = _interopRequireDefault(require("cluster"));
+
 var _koa = _interopRequireDefault(require("koa"));
 
+var _cors = _interopRequireDefault(require("@koa/cors"));
+
 var _koaStatic = _interopRequireDefault(require("koa-static"));
 
 var _koaMount = _interopRequireDefault(require("koa-mount"));
 
+var _koaBodyparser = _interopRequireDefault(require("koa-bodyparser"));
+
 var _ws = _interopRequireDefault(require("ws"));
 
 var _messages = require("../messages");
@@ -23,10 +29,13 @@ var _types = require("../../types");
 
 var _logger = require("../logger");
 
+var _shared = require("../../shared");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function server(reportDir, port) {
+function server(reportDir, port, ui) {
   let resolveApi = _types.noop;
+  let setStoriesCounter = 0;
   const creeveyApi = new Promise(resolve => resolveApi = resolve);
   const app = new _koa.default();
 
@@ -35,8 +44,71 @@ function server(reportDir, port) {
   const wss = new _ws.default.Server({
     server
   });
-  app.use(async (_, next) => {
-    await creeveyApi;
+  app.use((0, _cors.default)());
+  app.use((0, _koaBodyparser.default)());
+  app.use(async (ctx, next) => {
+    if (ctx.method == 'GET' && ctx.path == '/ping') {
+      ctx.body = 'pong';
+      return;
+    }
+
+    await next();
+  });
+
+  if (ui) {
+    app.use(async (_, next) => {
+      await creeveyApi;
+      await next();
+    });
+  }
+
+  app.use(async (ctx, next) => {
+    if (ctx.method == 'POST' && ctx.path == '/stories') {
+      const {
+        setStoriesCounter: counter,
+        stories
+      } = ctx.request.body;
+      if (setStoriesCounter >= counter) return;
+      const deserializedStories = stories.map(([file, stories]) => [file, stories.map(_shared.deserializeStory)]);
+      setStoriesCounter = counter;
+      (0, _messages.emitStoriesMessage)({
+        type: 'update',
+        payload: deserializedStories
+      });
+      Object.values(_cluster.default.workers ?? {}).filter(_types.isDefined).filter(worker => worker.isConnected()).forEach(worker => (0, _messages.sendStoriesMessage)(worker, {
+        type: 'update',
+        payload: deserializedStories
+      }));
+      return;
+    }
+
+    await next();
+  });
+  app.use(async (ctx, next) => {
+    if (ctx.method == 'POST' && ctx.path == '/capture') {
+      const {
+        workerId,
+        options
+      } = ctx.request.body;
+      const worker = Object.values(_cluster.default.workers ?? {}).filter(_types.isDefined).find(worker => worker.process.pid == workerId); // NOTE: Hypothetical case when someone send to us capture req and we don't have a worker with browser session for it
+
+      if (!worker) return;
+      await new Promise(resolve => {
+        const unsubscribe = (0, _messages.subscribeOnWorker)(worker, 'stories', message => {
+          if (message.type != 'capture') return;
+          unsubscribe();
+          resolve();
+        });
+        (0, _messages.sendStoriesMessage)(worker, {
+          type: 'capture',
+          payload: options
+        });
+      }); // TODO Pass screenshot result to show it in inspector
+
+      ctx.body = 'Ok';
+      return;
+    }
+
     await next();
   });
   app.use((0, _koaStatic.default)(_path.default.join(__dirname, '../../client/web')));
@@ -50,7 +122,9 @@ function server(reportDir, port) {
   void creeveyApi.then(api => {
     api.subscribe(wss);
     wss.on('connection', ws => {
-      ws.on('message', message => api.handleMessage(ws, message));
+      ws.on('message', (message, isBinary) => {
+        api.handleMessage(ws, isBinary ? message : message.toString());
+      });
     });
   });
   return resolveApi;