@atlaspack/reporter-dev-server 2.14.5-canary.49 → 2.14.5-canary.490

package/lib/HMRServer.js

@@ -0,0 +1,270 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _Server = require("./Server");
+function _nullthrows() {
+  const data = _interopRequireDefault(require("nullthrows"));
+  _nullthrows = function () {
+    return data;
+  };
+  return data;
+}
+function _url() {
+  const data = _interopRequireDefault(require("url"));
+  _url = function () {
+    return data;
+  };
+  return data;
+}
+function _mimeTypes() {
+  const data = _interopRequireDefault(require("mime-types"));
+  _mimeTypes = function () {
+    return data;
+  };
+  return data;
+}
+function _ws() {
+  const data = _interopRequireDefault(require("ws"));
+  _ws = function () {
+    return data;
+  };
+  return data;
+}
+function _assert() {
+  const data = _interopRequireDefault(require("assert"));
+  _assert = function () {
+    return data;
+  };
+  return data;
+}
+function _utils() {
+  const data = require("@atlaspack/utils");
+  _utils = function () {
+    return data;
+  };
+  return data;
+}
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// @ts-expect-error TS7016
+
+// @ts-expect-error TS7016
+
+// flow-to-ts helpers
+
+// /flow-to-ts helpers
+
+const FS_CONCURRENCY = 64;
+const HMR_ENDPOINT = '/__parcel_hmr';
+const BROADCAST_MAX_ASSETS = 10000;
+class HMRServer {
+  unresolvedError = null;
+  bundleGraph = null;
+  constructor(options) {
+    this.options = options;
+  }
+  async start() {
+    let server = this.options.devServer;
+    if (!server) {
+      let result = await (0, _utils().createHTTPServer)({
+        https: this.options.https,
+        inputFS: this.options.inputFS,
+        outputFS: this.options.outputFS,
+        cacheDir: this.options.cacheDir,
+        listener: (req, res) => {
+          (0, _Server.setHeaders)(res);
+          if (!this.handle(req, res)) {
+            res.statusCode = 404;
+            res.end();
+          }
+        }
+      });
+      server = result.server;
+      server.listen(this.options.port, this.options.host);
+      this.stopServer = result.stop;
+    } else {
+      var _this$options$addMidd, _this$options;
+      (_this$options$addMidd = (_this$options = this.options).addMiddleware) === null || _this$options$addMidd === void 0 || _this$options$addMidd.call(_this$options, (req, res) => this.handle(req, res));
+    }
+    this.wss = new (_ws().default.Server)({
+      server
+    });
+    this.wss.on('connection', ws => {
+      if (this.unresolvedError) {
+        ws.send(JSON.stringify(this.unresolvedError));
+      }
+    });
+    this.wss.on('error', err => this.handleSocketError(err));
+  }
+  handle(req, res) {
+    let {
+      pathname
+    } = _url().default.parse(req.originalUrl || req.url);
+    if (pathname != null && pathname.startsWith(HMR_ENDPOINT)) {
+      let id = pathname.slice(HMR_ENDPOINT.length + 1);
+      let bundleGraph = (0, _nullthrows().default)(this.bundleGraph);
+      let asset = bundleGraph.getAssetById(id);
+      this.getHotAssetContents(asset).then(output => {
+        res.setHeader('Content-Type', _mimeTypes().default.contentType(asset.type));
+        res.end(output);
+      });
+      return true;
+    }
+    return false;
+  }
+  async stop() {
+    if (this.stopServer != null) {
+      await this.stopServer();
+      this.stopServer = null;
+    }
+    this.wss.close();
+  }
+  async emitError(options, diagnostics) {
+    let renderedDiagnostics = await Promise.all(diagnostics.map(d => (0, _utils().prettyDiagnostic)(d, options)));
+
+    // store the most recent error so we can notify new connections
+    // and so we can broadcast when the error is resolved
+    this.unresolvedError = {
+      type: 'error',
+      diagnostics: {
+        ansi: renderedDiagnostics,
+        html: renderedDiagnostics.map((d, i) => {
+          return {
+            message: (0, _utils().ansiHtml)(d.message),
+            stack: (0, _utils().ansiHtml)(d.stack),
+            frames: d.frames.map(f => ({
+              location: f.location,
+              code: (0, _utils().ansiHtml)(f.code)
+            })),
+            hints: d.hints.map(hint => (0, _utils().ansiHtml)(hint)),
+            documentation: diagnostics[i].documentationURL ?? ''
+          };
+        })
+      }
+    };
+    this.broadcast(this.unresolvedError);
+  }
+  async emitUpdate(event) {
+    this.unresolvedError = null;
+    this.bundleGraph = event.bundleGraph;
+    let changedAssets = new Set(event.changedAssets.values());
+    if (changedAssets.size === 0) return;
+    let queue = new (_utils().PromiseQueue)({
+      maxConcurrent: FS_CONCURRENCY
+    });
+    for (let asset of changedAssets) {
+      if (asset.type !== 'js' && asset.type !== 'css') {
+        // If all of the incoming dependencies of the asset actually resolve to a JS asset
+        // rather than the original, we can mark the runtimes as changed instead. URL runtimes
+        // have a cache busting query param added with HMR enabled which will trigger a reload.
+        let runtimes = new Set();
+        let incomingDeps = event.bundleGraph.getIncomingDependencies(asset);
+        let isOnlyReferencedByRuntimes = incomingDeps.every(dep => {
+          let resolved = event.bundleGraph.getResolvedAsset(dep);
+          let isRuntime = (resolved === null || resolved === void 0 ? void 0 : resolved.type) === 'js' && resolved !== asset;
+          if (resolved && isRuntime) {
+            runtimes.add(resolved);
+          }
+          return isRuntime;
+        });
+        if (isOnlyReferencedByRuntimes) {
+          for (let runtime of runtimes) {
+            // @ts-expect-error TS2345
+            changedAssets.add(runtime);
+          }
+          continue;
+        }
+      }
+      queue.add(async () => {
+        let dependencies = event.bundleGraph.getDependencies(asset);
+        let depsByBundle = {};
+        for (let bundle of event.bundleGraph.getBundlesWithAsset(asset)) {
+          let deps = {};
+          for (let dep of dependencies) {
+            let resolved = event.bundleGraph.getResolvedAsset(dep, bundle);
+            if (resolved) {
+              deps[getSpecifier(dep)] = event.bundleGraph.getAssetPublicId(resolved);
+            }
+          }
+          depsByBundle[bundle.id] = deps;
+        }
+        return {
+          id: event.bundleGraph.getAssetPublicId(asset),
+          url: this.getSourceURL(asset),
+          type: asset.type,
+          // No need to send the contents of non-JS assets to the client.
+          output: asset.type === 'js' ? await this.getHotAssetContents(asset) : '',
+          envHash: asset.env.id,
+          outputFormat: asset.env.outputFormat,
+          depsByBundle
+        };
+      });
+    }
+    let assets = await queue.run();
+    if (assets.length >= BROADCAST_MAX_ASSETS) {
+      // Too many assets to send via an update without errors, just reload instead
+      this.broadcast({
+        type: 'reload'
+      });
+    } else {
+      this.broadcast({
+        type: 'update',
+        // @ts-expect-error TS2322
+        assets
+      });
+    }
+  }
+  async getHotAssetContents(asset) {
+    let output = await asset.getCode();
+    let bundleGraph = (0, _nullthrows().default)(this.bundleGraph);
+    if (asset.type === 'js') {
+      let publicId = bundleGraph.getAssetPublicId(asset);
+      output = `parcelHotUpdate['${publicId}'] = function (require, module, exports) {${output}}`;
+    }
+    let sourcemap = await asset.getMap();
+    if (sourcemap) {
+      let sourcemapStringified = await sourcemap.stringify({
+        format: 'inline',
+        sourceRoot: _Server.SOURCES_ENDPOINT + '/',
+        fs: asset.fs
+      });
+      (0, _assert().default)(typeof sourcemapStringified === 'string');
+      output += `\n//# sourceMappingURL=${sourcemapStringified}`;
+      output += `\n//# sourceURL=${encodeURI(this.getSourceURL(asset))}\n`;
+    }
+    return output;
+  }
+  getSourceURL(asset) {
+    let origin = '';
+    if (!this.options.devServer) {
+      origin = `http://${this.options.host || 'localhost'}:${this.options.port}`;
+    }
+    return origin + HMR_ENDPOINT + '/' + asset.id;
+  }
+  handleSocketError(err) {
+    if (err.code === 'ECONNRESET') {
+      // This gets triggered on page refresh, ignore this
+      return;
+    }
+    this.options.logger.warn({
+      origin: '@atlaspack/reporter-dev-server',
+      message: `[${err.code}]: ${err.message}`,
+      stack: err.stack
+    });
+  }
+  broadcast(msg) {
+    const json = JSON.stringify(msg);
+    for (let ws of this.wss.clients) {
+      ws.send(json);
+    }
+  }
+}
+exports.default = HMRServer;
+function getSpecifier(dep) {
+  if (typeof dep.meta.placeholder === 'string') {
+    return dep.meta.placeholder;
+  }
+  return dep.specifier;
+}