@very-simple/ajax 1.0.0-beta.5 → 1.0.0-beta.6

package/dist/index.js

@@ -13,14 +13,16 @@ var config = {
 // src/load.ts
 var parser = new DOMParser();
 var currentLoadController;
+var progressDelayTimeout;
 var progress = 0;
 var trickleInterval;
 var emit = (type, payload) => document.dispatchEvent(new CustomEvent(`ajax:${type}`, { detail: payload }));
 var cache = /* @__PURE__ */ new Map();
 var load = async (url, regions, options) => {
-  let progressDelayTimeout;
+  let aborted = false;
   try {
     currentLoadController?.abort();
+    clearTimeout(progressDelayTimeout);
     currentLoadController = new AbortController();
     setProgress(0);
     progressDelayTimeout = window.setTimeout(() => {
@@ -41,16 +43,18 @@ var load = async (url, regions, options) => {
     const document2 = parseHtml(html);
     return { document: document2, response };
   } catch (e) {
-    setProgress(0);
-    const isAbortError = e instanceof DOMException && e.name === "AbortError";
-    if (!isAbortError) {
+    aborted = e instanceof DOMException && e.name === "AbortError";
+    if (!aborted) {
+      setProgress(0);
       window.location.reload();
     }
   } finally {
-    clearTimeout(progressDelayTimeout);
-    stopTrickle();
-    setProgress(1);
-    setTimeout(() => emit("progress-end", {}), options.progressHideDelay);
+    if (!aborted) {
+      clearTimeout(progressDelayTimeout);
+      stopTrickle();
+      setProgress(1);
+      setTimeout(() => emit("progress-end", {}), options.progressHideDelay);
+    }
   }
 };
 var parseHtml = (html) => parser.parseFromString(html, "text/html");
@@ -58,8 +62,14 @@ var trickle = () => {
   const amount = -0.095 * progress + 0.1;
   setProgress(progress + Math.random() * amount);
 };
-var startTrickle = () => trickleInterval = window.setInterval(trickle, 300);
-var stopTrickle = () => clearInterval(trickleInterval);
+var startTrickle = () => {
+  stopTrickle();
+  trickleInterval = window.setInterval(trickle, 300);
+};
+var stopTrickle = () => {
+  clearInterval(trickleInterval);
+  trickleInterval = void 0;
+};
 var setProgress = (value) => {
   progress = value;
   emit("progress", { progress: value });
@@ -76,7 +86,7 @@ var merge = (region, newRegion, strategy) => {
     Array.from(
       newRegion.querySelectorAll(`[${escapedPrefix}permanent][id]`)
     ).forEach((el) => {
-      const original = region.querySelector(`#${el.id}`);
+      const original = region.querySelector(`#${CSS.escape(el.id)}`);
       if (original) {
         permanents.set(el.id, original);
         original.remove();
@@ -85,13 +95,12 @@ var merge = (region, newRegion, strategy) => {
     unmount?.(region);
     if (strategy === "replace") region.replaceWith(newRegion);
     else region.replaceChildren(...Array.from(newRegion.children));
-    Array.from(
-      newRegion.querySelectorAll(`[${escapedPrefix}permanent][id]`)
-    ).forEach((el) => {
+    const target = strategy === "replace" ? newRegion : region;
+    target.querySelectorAll(`[${escapedPrefix}permanent][id]`).forEach((el) => {
       const original = permanents.get(el.id);
       if (original) el.replaceWith(original);
     });
-    mount?.(strategy === "replace" ? newRegion : region);
+    mount?.(target);
   } else if (strategy === "before") {
     region.insertAdjacentElement("beforebegin", newRegion);
     mount?.(newRegion);
@@ -108,6 +117,7 @@ var merge = (region, newRegion, strategy) => {
     const result = morph(region, newRegion);
     autoFocusEl = result.autoFocusEl;
   }
+  if (strategy === "morph") return { autoFocusEl };
   if (newRegion.hasAttribute(`${prefix}autofocus`) || newRegion.autofocus) {
     autoFocusEl ??= newRegion;
   }
@@ -117,7 +127,7 @@ var merge = (region, newRegion, strategy) => {
 var morph = (container, newContainer) => {
   const { prefix, mount, unmount } = config;
   const manualReplacements = [];
-  let autoFocusEls = [];
+  const autoFocusEls = [];
   let currentNodeKeepAttributes = [];
   Idiomorph.morph(container, newContainer, {
     callbacks: {
@@ -132,6 +142,7 @@ var morph = (container, newContainer) => {
         const isSameComponent = oldIsComponent && newIsComponent && oldNode.getAttribute(`${prefix}component`) === newNode.getAttribute(`${prefix}component`);
         if (!oldIsComponent || isSameComponent) return true;
         manualReplacements.push([oldNode, newNode]);
+        return false;
       },
       beforeAttributeUpdated: (name) => {
         return !currentNodeKeepAttributes.includes(name);
@@ -147,9 +158,9 @@ var morph = (container, newContainer) => {
           mount?.(node);
         }
       },
-      afterNodeMorphed(_, newNode) {
-        if (newNode instanceof HTMLElement && (newNode.autofocus || newNode.hasAttribute(`${prefix}autofocus`))) {
-          autoFocusEls.push(newNode);
+      afterNodeMorphed(oldNode) {
+        if (oldNode instanceof HTMLElement && (oldNode.autofocus || oldNode.hasAttribute(`${prefix}autofocus`))) {
+          autoFocusEls.push(oldNode);
         }
       }
     }
@@ -207,7 +218,7 @@ var emit2 = (type, payload) => {
   document.dispatchEvent(event);
   if (waiting.length) return Promise.allSettled(waiting);
 };
-var currentUrl = window.location.pathname;
+var currentUrl = window.location.pathname + window.location.search;
 var currentState = history.state;
 var currentVisitController;
 var scrollPositions = /* @__PURE__ */ new Map();
@@ -254,6 +265,7 @@ var visit = async (url, {
     }
   }
   if (!newDocument) return;
+  if (signal.aborted) return;
   currentUrl = url;
   currentState = state;
   if (historyMode === "replace") history.replaceState(state, "", url);
@@ -272,8 +284,9 @@ var visit = async (url, {
     if (hasMatchingRegions) {
       for (const id of regions) {
         const region = document.querySelector(id);
-        const newRegion = newDocument.querySelector(id);
-        if (!region || !newRegion) continue;
+        const parsedRegion = newDocument.querySelector(id);
+        if (!region || !parsedRegion) continue;
+        const newRegion = document.importNode(parsedRegion, true);
         const strategy = getMergeStrategy(region, newRegion);
         const result = merge(region, newRegion, strategy);
         autoFocusEl ??= result.autoFocusEl;
@@ -284,7 +297,7 @@ var visit = async (url, {
       }
     } else {
       const region = document.body;
-      const newRegion = newDocument.body;
+      const newRegion = document.importNode(newDocument.body, true);
       const strategy = getMergeStrategy(region, newRegion);
       const result = merge(region, newRegion, strategy);
       autoFocusEl = result.autoFocusEl;
@@ -315,7 +328,7 @@ var visit = async (url, {
       await mergeRegions();
       await emit2("after-swap", { from, to, isBackForward, signal });
       applyScrollBehavior();
-    }).ready;
+    }).updateCallbackDone;
   } else {
     if (morphHeads) Idiomorph2.morph(document.head, newDocument.head);
     await mergeRegions();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@very-simple/ajax",
-  "version": "1.0.0-beta.5",
+  "version": "1.0.0-beta.6",
   "description": "A very simple turbolinks inspired ajax library",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",