@atlaspack/runtime-browser-hmr 2.14.5-canary.2 → 2.14.5-canary.200

package/src/loaders/{hmr-runtime.js → hmr-runtime.ts}

@@ -1,4 +1,3 @@
-// @flow
 /* global HMR_HOST, HMR_PORT, HMR_ENV_HASH, HMR_SECURE, HMR_USE_SSE, chrome, browser, __parcel__import__, __parcel__importScripts__, ServiceWorkerGlobalScope */
 
 /*::
@@ -49,56 +48,85 @@ declare var globalThis: typeof self;
 declare var ServiceWorkerGlobalScope: Object;
 */
 
+// flow-to-ts helpers
+export type SetComplement<A, B extends A> = A extends B ? never : A;
+export type Diff<T extends U, U extends object> = Pick<
+  T,
+  SetComplement<keyof T, keyof U>
+>;
+// /flow-to-ts helpers
+
 var OVERLAY_ID = '__parcel__error__overlay__';
 
+// @ts-expect-error TS2339
 var OldModule = module.bundle.Module;
 
-function Module(moduleName) {
+function Module(moduleName: any) {
+  // @ts-expect-error TS2683
   OldModule.call(this, moduleName);
+  // @ts-expect-error TS2683
   this.hot = {
+    // @ts-expect-error TS2339
     data: module.bundle.hotData[moduleName],
     _acceptCallbacks: [],
     _disposeCallbacks: [],
+    // @ts-expect-error TS7006
     accept: function (fn) {
       this._acceptCallbacks.push(fn || function () {});
     },
+    // @ts-expect-error TS7006
     dispose: function (fn) {
       this._disposeCallbacks.push(fn);
     },
   };
+  // @ts-expect-error TS2339
   module.bundle.hotData[moduleName] = undefined;
 }
+// @ts-expect-error TS2339
 module.bundle.Module = Module;
+// @ts-expect-error TS2339
 module.bundle.hotData = {};
 
+// @ts-expect-error TS7034
 var checkedAssets /*: {|[string]: boolean|} */,
+  // @ts-expect-error TS7034
+  disposedAssets /*: {|[string]: boolean|} */,
+  // @ts-expect-error TS7034
   assetsToDispose /*: Array<[ParcelRequire, string]> */,
+  // @ts-expect-error TS7034
   assetsToAccept /*: Array<[ParcelRequire, string]> */;
 
 function getHostname() {
   return (
+    // @ts-expect-error TS2304
     HMR_HOST ||
+    // @ts-expect-error TS2304
     (location.protocol.indexOf('http') === 0 ? location.hostname : 'localhost')
   );
 }
 
 function getPort() {
+  // @ts-expect-error TS2304
   return HMR_PORT || location.port;
 }
 
 // eslint-disable-next-line no-redeclare
+// @ts-expect-error TS2339
 var parent = module.bundle.parent;
 if ((!parent || !parent.isParcelRequire) && typeof WebSocket !== 'undefined') {
   var hostname = getHostname();
   var port = getPort();
   var protocol =
+    // @ts-expect-error TS2304
     HMR_SECURE ||
+    // @ts-expect-error TS2304
     (location.protocol == 'https:' &&
       !['localhost', '127.0.0.1', '0.0.0.0'].includes(hostname))
       ? 'wss'
       : 'ws';
 
   var ws;
+  // @ts-expect-error TS2304
   if (HMR_USE_SSE) {
     ws = new EventSource('/__parcel_hmr');
   } else {
@@ -106,7 +134,7 @@ if ((!parent || !parent.isParcelRequire) && typeof WebSocket !== 'undefined') {
       ws = new WebSocket(
         protocol + '://' + hostname + (port ? ':' + port : '') + '/',
       );
-    } catch (err) {
+    } catch (err: any) {
       if (err.message) {
         console.error(err.message);
       }
@@ -116,24 +144,33 @@ if ((!parent || !parent.isParcelRequire) && typeof WebSocket !== 'undefined') {
 
   // Web extension context
   var extCtx =
+    // @ts-expect-error TS2304
     typeof browser === 'undefined'
-      ? typeof chrome === 'undefined'
+      ? // @ts-expect-error TS2304
+        typeof chrome === 'undefined'
         ? null
-        : chrome
-      : browser;
+        : // @ts-expect-error TS2304
+          chrome
+      : // @ts-expect-error TS2304
+        browser;
 
   // Safari doesn't support sourceURL in error stacks.
   // eval may also be disabled via CSP, so do a quick check.
   var supportsSourceURL = false;
   try {
     (0, eval)('throw new Error("test"); //# sourceURL=test.js');
-  } catch (err) {
+  } catch (err: any) {
     supportsSourceURL = err.stack.includes('test.js');
   }
 
-  // $FlowFixMe
-  ws.onmessage = async function (event /*: {data: string, ...} */) {
-    checkedAssets = ({} /*: {|[string]: boolean|} */);
+  // @ts-expect-error TS2339
+  ws.onmessage = async function (
+    event: {
+      data: string;
+    } /*: {data: string, ...} */,
+  ) {
+    checkedAssets = {} /*: {|[string]: boolean|} */;
+    disposedAssets = {} /*: {|[string]: boolean|} */;
     assetsToAccept = [];
     assetsToDispose = [];
 
@@ -143,19 +180,23 @@ if ((!parent || !parent.isParcelRequire) && typeof WebSocket !== 'undefined') {
       fullReload();
     } else if (data.type === 'update') {
       // Remove error overlay if there is one
+      // @ts-expect-error TS2304
       if (typeof document !== 'undefined') {
         removeErrorOverlay();
       }
 
       let assets = data.assets.filter(
+        // @ts-expect-error TS7006
         (asset) => asset.envHash === HMR_ENV_HASH,
       );
 
       // Handle HMR Update
+      // @ts-expect-error TS7006
       let handled = assets.every((asset) => {
         return (
           asset.type === 'css' ||
           (asset.type === 'js' &&
+            // @ts-expect-error TS2339
             hmrAcceptCheck(module.bundle.root, asset.id, asset.depsByBundle))
         );
       });
@@ -165,31 +206,26 @@ if ((!parent || !parent.isParcelRequire) && typeof WebSocket !== 'undefined') {
 
         // Dispatch custom event so other runtimes (e.g React Refresh) are aware.
         if (
+          // @ts-expect-error TS2304
           typeof window !== 'undefined' &&
           typeof CustomEvent !== 'undefined'
         ) {
+          // @ts-expect-error TS2304
           window.dispatchEvent(new CustomEvent('parcelhmraccept'));
         }
 
         await hmrApplyUpdates(assets);
 
-        // Dispose all old assets.
-        let processedAssets = ({} /*: {|[string]: boolean|} */);
-        for (let i = 0; i < assetsToDispose.length; i++) {
-          let id = assetsToDispose[i][1];
-
-          if (!processedAssets[id]) {
-            hmrDispose(assetsToDispose[i][0], id);
-            processedAssets[id] = true;
-          }
-        }
+        hmrDisposeQueue();
 
         // Run accept callbacks. This will also re-execute other disposed assets in topological order.
-        processedAssets = {};
+        let processedAssets: Record<string, any> = {};
         for (let i = 0; i < assetsToAccept.length; i++) {
+          // @ts-expect-error TS7005
           let id = assetsToAccept[i][1];
 
           if (!processedAssets[id]) {
+            // @ts-expect-error TS7005
             hmrAccept(assetsToAccept[i][0], id);
             processedAssets[id] = true;
           }
@@ -214,22 +250,23 @@ if ((!parent || !parent.isParcelRequire) && typeof WebSocket !== 'undefined') {
         );
       }
 
+      // @ts-expect-error TS2304
       if (typeof document !== 'undefined') {
         // Render the fancy html overlay
         removeErrorOverlay();
         var overlay = createErrorOverlay(data.diagnostics.html);
-        // $FlowFixMe
+        // @ts-expect-error TS2304
         document.body.appendChild(overlay);
       }
     }
   };
   if (ws instanceof WebSocket) {
-    ws.onerror = function (e) {
+    ws.onerror = function (e: any) {
       if (e.message) {
         console.error(e.message);
       }
     };
-    ws.onclose = function (e) {
+    ws.onclose = function (e: CloseEvent) {
       if (process.env.ATLASPACK_BUILD_ENV !== 'test') {
         console.warn('[parcel] 🚨 Connection to the HMR server was lost');
       }
@@ -238,6 +275,7 @@ if ((!parent || !parent.isParcelRequire) && typeof WebSocket !== 'undefined') {
 }
 
 function removeErrorOverlay() {
+  // @ts-expect-error TS2304
   var overlay = document.getElementById(OVERLAY_ID);
   if (overlay) {
     overlay.remove();
@@ -245,7 +283,20 @@ function removeErrorOverlay() {
   }
 }
 
-function createErrorOverlay(diagnostics) {
+function createErrorOverlay(
+  diagnostics: Array<
+    Partial<
+      Diff<
+        // @ts-expect-error TS2304
+        AnsiDiagnosticResult,
+        {
+          codeframe: string;
+        }
+      >
+    >
+  >,
+) {
+  // @ts-expect-error TS2304
   var overlay = document.createElement('div');
   overlay.id = OVERLAY_ID;
 
@@ -254,7 +305,8 @@ function createErrorOverlay(diagnostics) {
 
   for (let diagnostic of diagnostics) {
     let stack = diagnostic.frames.length
-      ? diagnostic.frames.reduce((p, frame) => {
+      ? // @ts-expect-error TS7006
+        diagnostic.frames.reduce((p, frame) => {
           return `${p}
 <a href="/__parcel_launch_editor?file=${encodeURIComponent(
             frame.location,
@@ -273,6 +325,7 @@ ${frame.code}`;
         <pre>${stack}</pre>
         <div>
           ${diagnostic.hints
+            // @ts-expect-error TS7006
             .map((hint) => '<div>💡 ' + hint + '</div>')
             .join('')}
         </div>
@@ -293,20 +346,27 @@ ${frame.code}`;
 }
 
 function fullReload() {
+  // @ts-expect-error TS2304
   if ('reload' in location) {
+    // @ts-expect-error TS2304
     location.reload();
   } else if (extCtx && extCtx.runtime && extCtx.runtime.reload) {
     extCtx.runtime.reload();
   }
 }
 
-function getParents(bundle, id) /*: Array<[ParcelRequire, string]> */ {
+function getParents(
+  // @ts-expect-error TS2304
+  bundle: ParcelRequire,
+  id: string,
+) /*: Array<[ParcelRequire, string]> */ {
   var modules = bundle.modules;
   if (!modules) {
     return [];
   }
 
-  var parents = [];
+  // @ts-expect-error TS2304
+  var parents: Array<[ParcelRequire, string]> = [];
   var k, d, dep;
 
   for (k in modules) {
@@ -326,38 +386,40 @@ function getParents(bundle, id) /*: Array<[ParcelRequire, string]> */ {
   return parents;
 }
 
-function updateLink(link) {
+function updateLink(link: HTMLElement) {
+  // @ts-expect-error TS2339
   var href = link.getAttribute('href');
 
   if (!href) {
     return;
   }
+  // @ts-expect-error TS2339
   var newLink = link.cloneNode();
   newLink.onload = function () {
+    // @ts-expect-error TS2339
     if (link.parentNode !== null) {
-      // $FlowFixMe
+      // @ts-expect-error TS2339
       link.parentNode.removeChild(link);
     }
   };
-  newLink.setAttribute(
-    'href',
-    // $FlowFixMe
-    href.split('?')[0] + '?' + Date.now(),
-  );
-  // $FlowFixMe
+  newLink.setAttribute('href', href.split('?')[0] + '?' + Date.now());
+  // @ts-expect-error TS18047
   link.parentNode.insertBefore(newLink, link.nextSibling);
 }
 
+// @ts-expect-error TS7034
 var cssTimeout = null;
 function reloadCSS() {
+  // @ts-expect-error TS7005
   if (cssTimeout) {
     return;
   }
 
   cssTimeout = setTimeout(function () {
+    // @ts-expect-error TS18047
+    var document = window.document;
     var links = document.querySelectorAll('link[rel="stylesheet"]');
     for (var i = 0; i < links.length; i++) {
-      // $FlowFixMe[incompatible-type]
       var href /*: string */ = links[i].getAttribute('href');
       var hostname = getHostname();
       var servedFromHMRServer =
@@ -368,6 +430,7 @@ function reloadCSS() {
           : href.indexOf(hostname + ':' + getPort());
       var absolute =
         /^https?:\/\//i.test(href) &&
+        // @ts-expect-error TS18047
         href.indexOf(location.origin) !== 0 &&
         !servedFromHMRServer;
       if (!absolute) {
@@ -379,38 +442,60 @@ function reloadCSS() {
   }, 50);
 }
 
-function hmrDownload(asset) {
+// @ts-expect-error TS2304
+function hmrDownload(asset: HMRAsset) {
   if (asset.type === 'js') {
+    // @ts-expect-error TS18047
     if (typeof document !== 'undefined') {
+      // @ts-expect-error TS18047
       let script = document.createElement('script');
       script.src = asset.url + '?t=' + Date.now();
       if (asset.outputFormat === 'esmodule') {
         script.type = 'module';
       }
-      return new Promise((resolve, reject) => {
-        script.onload = () => resolve(script);
-        script.onerror = reject;
-        document.head?.appendChild(script);
-      });
+      return new Promise(
+        (
+          resolve: (
+            result: Promise<HTMLScriptElement> | HTMLScriptElement,
+          ) => void,
+          reject: (error?: any) => void,
+        ) => {
+          script.onload = () => resolve(script);
+          script.onerror = reject;
+          // @ts-expect-error TS18047
+          document.head?.appendChild(script);
+        },
+      );
+      // @ts-expect-error TS2304
     } else if (typeof importScripts === 'function') {
       // Worker scripts
       if (asset.outputFormat === 'esmodule') {
+        // @ts-expect-error TS2304
         return __parcel__import__(asset.url + '?t=' + Date.now());
       } else {
-        return new Promise((resolve, reject) => {
-          try {
-            __parcel__importScripts__(asset.url + '?t=' + Date.now());
-            resolve();
-          } catch (err) {
-            reject(err);
-          }
-        });
+        return new Promise(
+          (
+            resolve: (result: Promise<undefined> | undefined) => void,
+            reject: (error?: any) => void,
+          ) => {
+            try {
+              // @ts-expect-error TS2304
+              __parcel__importScripts__(asset.url + '?t=' + Date.now());
+              // @ts-expect-error TS2794
+              resolve();
+            } catch (err: any) {
+              reject(err);
+            }
+          },
+        );
       }
     }
   }
 }
 
-async function hmrApplyUpdates(assets) {
+// @ts-expect-error TS2304
+async function hmrApplyUpdates(assets: Array<HMRAsset>) {
+  // @ts-expect-error TS7017
   global.parcelHotUpdate = Object.create(null);
 
   let scriptsToRemove;
@@ -423,13 +508,15 @@ async function hmrApplyUpdates(assets) {
     // This path is also taken if a CSP disallows eval.
     if (!supportsSourceURL) {
       let promises = assets.map((asset) =>
-        hmrDownload(asset)?.catch((err) => {
+        hmrDownload(asset)?.catch((err: any) => {
           // Web extension fix
           if (
             extCtx &&
             extCtx.runtime &&
             extCtx.runtime.getManifest().manifest_version == 3 &&
+            // @ts-expect-error TS2304
             typeof ServiceWorkerGlobalScope != 'undefined' &&
+            // @ts-expect-error TS2304
             global instanceof ServiceWorkerGlobalScope
           ) {
             extCtx.runtime.reload();
@@ -443,14 +530,18 @@ async function hmrApplyUpdates(assets) {
     }
 
     assets.forEach(function (asset) {
+      // @ts-expect-error TS2339
       hmrApply(module.bundle.root, asset);
     });
   } finally {
+    // @ts-expect-error TS7017
     delete global.parcelHotUpdate;
 
     if (scriptsToRemove) {
+      // @ts-expect-error TS7006
       scriptsToRemove.forEach((script) => {
         if (script) {
+          // @ts-expect-error TS18047
           document.head?.removeChild(script);
         }
       });
@@ -458,7 +549,12 @@ async function hmrApplyUpdates(assets) {
   }
 }
 
-function hmrApply(bundle /*: ParcelRequire */, asset /*:  HMRAsset */) {
+function hmrApply(
+  // @ts-expect-error TS2304
+  bundle: ParcelRequire /*: ParcelRequire */,
+  // @ts-expect-error TS2304
+  asset: HMRAsset /*:  HMRAsset */,
+) {
   var modules = bundle.modules;
   if (!modules) {
     return;
@@ -476,8 +572,10 @@ function hmrApply(bundle /*: ParcelRequire */, asset /*:  HMRAsset */) {
         for (let dep in oldDeps) {
           if (!deps[dep] || deps[dep] !== oldDeps[dep]) {
             let id = oldDeps[dep];
+            // @ts-expect-error TS2339
             let parents = getParents(module.bundle.root, id);
             if (parents.length === 1) {
+              // @ts-expect-error TS2339
               hmrDelete(module.bundle.root, id);
             }
           }
@@ -490,16 +588,21 @@ function hmrApply(bundle /*: ParcelRequire */, asset /*:  HMRAsset */) {
         (0, eval)(asset.output);
       }
 
-      // $FlowFixMe
+      // @ts-expect-error TS7017
       let fn = global.parcelHotUpdate[asset.id];
       modules[asset.id] = [fn, deps];
-    } else if (bundle.parent) {
+    }
+
+    // Always traverse to the parent bundle, even if we already replaced the asset in this bundle.
+    // This is required in case modules are duplicated. We need to ensure all instances have the updated code.
+    if (bundle.parent) {
       hmrApply(bundle.parent, asset);
     }
   }
 }
 
-function hmrDelete(bundle, id) {
+// @ts-expect-error TS2304
+function hmrDelete(bundle: ParcelRequire, id: string) {
   let modules = bundle.modules;
   if (!modules) {
     return;
@@ -508,8 +611,9 @@ function hmrDelete(bundle, id) {
   if (modules[id]) {
     // Collect dependencies that will become orphaned when this module is deleted.
     let deps = modules[id][1];
-    let orphans = [];
+    let orphans: Array<string> = [];
     for (let dep in deps) {
+      // @ts-expect-error TS2339
       let parents = getParents(module.bundle.root, deps[dep]);
       if (parents.length === 1) {
         orphans.push(deps[dep]);
@@ -522,6 +626,7 @@ function hmrDelete(bundle, id) {
 
     // Now delete the orphans.
     orphans.forEach((id) => {
+      // @ts-expect-error TS2339
       hmrDelete(module.bundle.root, id);
     });
   } else if (bundle.parent) {
@@ -530,25 +635,36 @@ function hmrDelete(bundle, id) {
 }
 
 function hmrAcceptCheck(
-  bundle /*: ParcelRequire */,
-  id /*: string */,
-  depsByBundle /*: ?{ [string]: { [string]: string } }*/,
+  // @ts-expect-error TS2304
+  bundle: ParcelRequire /*: ParcelRequire */,
+  id: string /*: string */,
+  depsByBundle:
+    | {
+        [key: string]: {
+          [key: string]: string;
+        };
+      }
+    | null
+    | undefined /*: ?{ [string]: { [string]: string } }*/,
 ) {
   if (hmrAcceptCheckOne(bundle, id, depsByBundle)) {
     return true;
   }
 
   // Traverse parents breadth first. All possible ancestries must accept the HMR update, or we'll reload.
+  // @ts-expect-error TS2339
   let parents = getParents(module.bundle.root, id);
   let accepted = false;
   while (parents.length > 0) {
     let v = parents.shift();
+    // @ts-expect-error TS18048
     let a = hmrAcceptCheckOne(v[0], v[1], null);
     if (a) {
       // If this parent accepts, stop traversing upward, but still consider siblings.
       accepted = true;
     } else {
       // Otherwise, queue the parents in the next level upward.
+      // @ts-expect-error TS2339
       let p = getParents(module.bundle.root, v[1]);
       if (p.length === 0) {
         // If there are no parents, then we've reached an entry without accepting. Reload.
@@ -563,9 +679,17 @@ function hmrAcceptCheck(
 }
 
 function hmrAcceptCheckOne(
-  bundle /*: ParcelRequire */,
-  id /*: string */,
-  depsByBundle /*: ?{ [string]: { [string]: string } }*/,
+  // @ts-expect-error TS2304
+  bundle: ParcelRequire /*: ParcelRequire */,
+  id: string /*: string */,
+  depsByBundle:
+    | {
+        [key: string]: {
+          [key: string]: string;
+        };
+      }
+    | null
+    | undefined /*: ?{ [string]: { [string]: string } }*/,
 ) {
   var modules = bundle.modules;
   if (!modules) {
@@ -582,10 +706,12 @@ function hmrAcceptCheckOne(
     return hmrAcceptCheck(bundle.parent, id, depsByBundle);
   }
 
+  // @ts-expect-error TS7005
   if (checkedAssets[id]) {
     return true;
   }
 
+  // @ts-expect-error TS7005
   checkedAssets[id] = true;
 
   var cached = bundle.cache[id];
@@ -597,7 +723,28 @@ function hmrAcceptCheckOne(
   }
 }
 
-function hmrDispose(bundle /*: ParcelRequire */, id /*: string */) {
+function hmrDisposeQueue() {
+  // Dispose all old assets.
+  for (let i = 0; i < assetsToDispose.length; i++) {
+    // @ts-expect-error TS7005
+    let id = assetsToDispose[i][1];
+
+    // @ts-expect-error TS7005
+    if (!disposedAssets[id]) {
+      // @ts-expect-error TS7005
+      hmrDispose(assetsToDispose[i][0], id);
+      disposedAssets[id] = true;
+    }
+  }
+
+  assetsToDispose = [];
+}
+
+function hmrDispose(
+  // @ts-expect-error TS2304
+  bundle: ParcelRequire /*: ParcelRequire */,
+  id: string /*: string */,
+) {
   var cached = bundle.cache[id];
   bundle.hotData[id] = {};
   if (cached && cached.hot) {
@@ -605,6 +752,7 @@ function hmrDispose(bundle /*: ParcelRequire */, id /*: string */) {
   }
 
   if (cached && cached.hot && cached.hot._disposeCallbacks.length) {
+    // @ts-expect-error TS7006
     cached.hot._disposeCallbacks.forEach(function (cb) {
       cb(bundle.hotData[id]);
     });
@@ -613,25 +761,41 @@ function hmrDispose(bundle /*: ParcelRequire */, id /*: string */) {
   delete bundle.cache[id];
 }
 
-function hmrAccept(bundle /*: ParcelRequire */, id /*: string */) {
+function hmrAccept(
+  // @ts-expect-error TS2304
+  bundle: ParcelRequire /*: ParcelRequire */,
+  id: string /*: string */,
+) {
   // Execute the module.
   bundle(id);
 
   // Run the accept callbacks in the new version of the module.
   var cached = bundle.cache[id];
   if (cached && cached.hot && cached.hot._acceptCallbacks.length) {
+    let assetsToAlsoAccept: Array<never> = [];
+    // @ts-expect-error TS7006
     cached.hot._acceptCallbacks.forEach(function (cb) {
-      var assetsToAlsoAccept = cb(function () {
+      let additionalAssets = cb(function () {
+        // @ts-expect-error TS2339
         return getParents(module.bundle.root, id);
       });
-      if (assetsToAlsoAccept && assetsToAccept.length) {
-        assetsToAlsoAccept.forEach(function (a) {
-          hmrDispose(a[0], a[1]);
-        });
-
-        // $FlowFixMe[method-unbinding]
-        assetsToAccept.push.apply(assetsToAccept, assetsToAlsoAccept);
+      if (Array.isArray(additionalAssets) && additionalAssets.length) {
+        // @ts-expect-error TS2345
+        assetsToAlsoAccept.push(...additionalAssets);
       }
     });
+
+    if (assetsToAlsoAccept.length > 0) {
+      let handled = assetsToAlsoAccept.every(function (a) {
+        // @ts-expect-error TS2554
+        return hmrAcceptCheck(a[0], a[1]);
+      });
+
+      if (!handled) {
+        return fullReload();
+      }
+
+      hmrDisposeQueue();
+    }
   }
 }