phoenix_live_view 0.19.3 → 0.19.5

package/assets/js/phoenix_live_view/dom.js

@@ -61,7 +61,7 @@ let DOM = {
   wantsNewTab(e){
     let wantsNewTab = e.ctrlKey || e.shiftKey || e.metaKey || (e.button && e.button === 1)
     let isDownload = (e.target instanceof HTMLAnchorElement && e.target.hasAttribute("download"))
-    let isTargetBlank = e.target.getAttribute("target") === "_blank"
+    let isTargetBlank = e.target.hasAttribute("target") && e.target.getAttribute("target").toLowerCase() === "_blank"
     return wantsNewTab || isTargetBlank || isDownload
   },
 
@@ -488,4 +488,4 @@ let DOM = {
   }
 }
 
-export default DOM
+export default DOM

package/assets/js/phoenix_live_view/entry_uploader.js

@@ -9,12 +9,14 @@ export default class EntryUploader {
     this.offset = 0
     this.chunkSize = chunkSize
     this.chunkTimer = null
+    this.errored = false
     this.uploadChannel = liveSocket.channel(`lvu:${entry.ref}`, {token: entry.metadata()})
   }
 
   error(reason){
+    if(this.errored){ return }
+    this.errored = true
     clearTimeout(this.chunkTimer)
-    this.uploadChannel.leave()
     this.entry.error(reason)
   }
 
@@ -50,5 +52,6 @@ export default class EntryUploader {
           this.chunkTimer = setTimeout(() => this.readNextChunk(), this.liveSocket.getLatencySim() || 0)
         }
       })
+      .receive("error", ({reason}) => this.error(reason))
   }
 }

package/assets/js/phoenix_live_view/live_socket.js

@@ -407,7 +407,7 @@ export default class LiveSocket {
           DOM.findPhxSticky(document).forEach(el => newMainEl.appendChild(el))
           this.outgoingMainEl.replaceWith(newMainEl)
           this.outgoingMainEl = null
-          callback && requestAnimationFrame(callback)
+          callback && requestAnimationFrame(() => callback(linkRef))
           onDone()
         })
       }
@@ -684,6 +684,7 @@ export default class LiveSocket {
       let {type, id, root, scroll} = event.state || {}
       let href = window.location.href
 
+      DOM.dispatchEvent(window, "phx:navigate", {detail: {href, patch: type === "patch", pop: true}})
       this.requestDOMUpdate(() => {
         if(this.main.isConnected() && (type === "patch" && id === this.main.id)){
           this.main.pushLinkPatch(href, null, () => {
@@ -761,6 +762,7 @@ export default class LiveSocket {
     if(!this.commitPendingLink(linkRef)){ return }
 
     Browser.pushState(linkState, {type: "patch", id: this.main.id}, href)
+    DOM.dispatchEvent(window, "phx:navigate", {detail: {patch: true, href, pop: false}})
     this.registerNewLocation(window.location)
   }
 
@@ -773,9 +775,12 @@ export default class LiveSocket {
     }
     let scroll = window.scrollY
     this.withPageLoading({to: href, kind: "redirect"}, done => {
-      this.replaceMain(href, flash, () => {
-        Browser.pushState(linkState, {type: "redirect", id: this.main.id, scroll: scroll}, href)
-        this.registerNewLocation(window.location)
+      this.replaceMain(href, flash, (linkRef) => {
+        if(linkRef === this.linkRef){
+          Browser.pushState(linkState, {type: "redirect", id: this.main.id, scroll: scroll}, href)
+          DOM.dispatchEvent(window, "phx:navigate", {detail: {href, patch: false, pop: false}})
+          this.registerNewLocation(window.location)
+        }
         done()
       })
     })

package/assets/js/phoenix_live_view/view.js

@@ -1083,8 +1083,9 @@ export default class View {
     let linkRef = this.liveSocket.setPendingLink(href)
     let refGen = targetEl ? () => this.putRef([targetEl], "click") : null
     let fallback = () => this.liveSocket.redirect(window.location.href)
+    let url = href.startsWith("/") ? `${location.protocol}//${location.host}${href}` : href
 
-    let push = this.pushWithReply(refGen, "live_patch", {url: href}, resp => {
+    let push = this.pushWithReply(refGen, "live_patch", {url}, resp => {
       this.liveSocket.requestDOMUpdate(() => {
         if(resp.link_redirect){
           this.liveSocket.replaceMain(href, null, callback, linkRef)

package/assets/package.json

@@ -1,6 +1,6 @@
 {
   "name": "phoenix_live_view",
-  "version": "0.19.3",
+  "version": "0.19.5",
   "description": "The Phoenix LiveView JavaScript client.",
   "license": "MIT",
   "repository": {},

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "phoenix_live_view",
-  "version": "0.19.3",
+  "version": "0.19.5",
   "description": "The Phoenix LiveView JavaScript client.",
   "license": "MIT",
   "module": "./priv/static/phoenix_live_view.esm.js",

package/priv/static/phoenix_live_view.cjs.js

@@ -109,11 +109,15 @@ var EntryUploader = class {
     this.offset = 0;
     this.chunkSize = chunkSize;
     this.chunkTimer = null;
+    this.errored = false;
     this.uploadChannel = liveSocket.channel(`lvu:${entry.ref}`, { token: entry.metadata() });
   }
   error(reason) {
+    if (this.errored) {
+      return;
+    }
+    this.errored = true;
     clearTimeout(this.chunkTimer);
-    this.uploadChannel.leave();
     this.entry.error(reason);
   }
   upload() {
@@ -145,7 +149,7 @@ var EntryUploader = class {
       if (!this.isDone()) {
         this.chunkTimer = setTimeout(() => this.readNextChunk(), this.liveSocket.getLatencySim() || 0);
       }
-    });
+    }).receive("error", ({ reason }) => this.error(reason));
   }
 };
 
@@ -312,7 +316,7 @@ var DOM = {
   wantsNewTab(e) {
     let wantsNewTab = e.ctrlKey || e.shiftKey || e.metaKey || e.button && e.button === 1;
     let isDownload = e.target instanceof HTMLAnchorElement && e.target.hasAttribute("download");
-    let isTargetBlank = e.target.getAttribute("target") === "_blank";
+    let isTargetBlank = e.target.hasAttribute("target") && e.target.getAttribute("target").toLowerCase() === "_blank";
     return wantsNewTab || isTargetBlank || isDownload;
   },
   isUnloadableFormSubmit(e) {
@@ -3562,7 +3566,8 @@ var View = class {
     let linkRef = this.liveSocket.setPendingLink(href);
     let refGen = targetEl ? () => this.putRef([targetEl], "click") : null;
     let fallback = () => this.liveSocket.redirect(window.location.href);
-    let push = this.pushWithReply(refGen, "live_patch", { url: href }, (resp) => {
+    let url = href.startsWith("/") ? `${location.protocol}//${location.host}${href}` : href;
+    let push = this.pushWithReply(refGen, "live_patch", { url }, (resp) => {
       this.liveSocket.requestDOMUpdate(() => {
         if (resp.link_redirect) {
           this.liveSocket.replaceMain(href, null, callback, linkRef);
@@ -3932,7 +3937,7 @@ var LiveSocket = class {
           dom_default.findPhxSticky(document).forEach((el) => newMainEl.appendChild(el));
           this.outgoingMainEl.replaceWith(newMainEl);
           this.outgoingMainEl = null;
-          callback && requestAnimationFrame(callback);
+          callback && requestAnimationFrame(() => callback(linkRef));
           onDone();
         });
       }
@@ -4214,6 +4219,7 @@ var LiveSocket = class {
       }
       let { type, id, root, scroll } = event.state || {};
       let href = window.location.href;
+      dom_default.dispatchEvent(window, "phx:navigate", { detail: { href, patch: type === "patch", pop: true } });
       this.requestDOMUpdate(() => {
         if (this.main.isConnected() && (type === "patch" && id === this.main.id)) {
           this.main.pushLinkPatch(href, null, () => {
@@ -4291,6 +4297,7 @@ var LiveSocket = class {
       return;
     }
     browser_default.pushState(linkState, { type: "patch", id: this.main.id }, href);
+    dom_default.dispatchEvent(window, "phx:navigate", { detail: { patch: true, href, pop: false } });
     this.registerNewLocation(window.location);
   }
   historyRedirect(href, linkState, flash) {
@@ -4303,9 +4310,12 @@ var LiveSocket = class {
     }
     let scroll = window.scrollY;
     this.withPageLoading({ to: href, kind: "redirect" }, (done) => {
-      this.replaceMain(href, flash, () => {
-        browser_default.pushState(linkState, { type: "redirect", id: this.main.id, scroll }, href);
-        this.registerNewLocation(window.location);
+      this.replaceMain(href, flash, (linkRef) => {
+        if (linkRef === this.linkRef) {
+          browser_default.pushState(linkState, { type: "redirect", id: this.main.id, scroll }, href);
+          dom_default.dispatchEvent(window, "phx:navigate", { detail: { href, patch: false, pop: false } });
+          this.registerNewLocation(window.location);
+        }
         done();
       });
     });