phoenix_live_view 1.1.7 → 1.1.8

package/assets/js/phoenix_live_view/view.js

@@ -832,12 +832,16 @@ export default class View {
     });
   }
 
-  update(diff, events) {
+  update(diff, events, isPending = false) {
     if (
       this.isJoinPending() ||
       (this.liveSocket.hasPendingLink() && this.root.isMain())
     ) {
-      return this.pendingDiffs.push({ diff, events });
+      // don't mutate if this is already a pending diff
+      if (!isPending) {
+        this.pendingDiffs.push({ diff, events });
+      }
+      return false;
     }
 
     this.rendered.mergeDiff(diff);
@@ -875,6 +879,8 @@ export default class View {
     if (phxChildrenAdded) {
       this.joinNewChildren();
     }
+
+    return true;
   }
 
   renderContainer(diff, kind) {
@@ -985,16 +991,12 @@ export default class View {
   }
 
   applyPendingUpdates() {
-    // prevent race conditions where we might still be pending a new
-    // navigation after applying the current one;
-    // if we call update and a pendingDiff is not applied, it would
-    // be silently dropped otherwise, as update would push it back to
-    // pendingDiffs, but we clear it immediately after
-    if (this.liveSocket.hasPendingLink() && this.root.isMain()) {
-      return;
-    }
-    this.pendingDiffs.forEach(({ diff, events }) => this.update(diff, events));
-    this.pendingDiffs = [];
+    // To prevent race conditions where we might still be pending a new
+    // navigation or the join is still pending, `this.update` returns false
+    // if the diff was not applied.
+    this.pendingDiffs = this.pendingDiffs.filter(
+      ({ diff, events }) => !this.update(diff, events, true),
+    );
     this.eachChild((child) => child.applyPendingUpdates());
   }
 

package/assets/js/types/view.d.ts

@@ -78,7 +78,7 @@ export default class View {
     isJoinPending(): boolean;
     ackJoin(_child: any): void;
     onAllChildJoinsComplete(): void;
-    update(diff: any, events: any): number;
+    update(diff: any, events: any, isPending?: boolean): boolean;
     renderContainer(diff: any, kind: any): any;
     componentPatch(diff: any, cid: any): boolean;
     getHook(el: any): any;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "phoenix_live_view",
-  "version": "1.1.7",
+  "version": "1.1.8",
   "description": "The Phoenix LiveView JavaScript client.",
   "license": "MIT",
   "type": "module",

package/priv/static/phoenix_live_view.cjs.js

@@ -4619,9 +4619,12 @@ var View = class _View {
       this.pendingJoinOps = [];
     });
   }
-  update(diff, events) {
+  update(diff, events, isPending = false) {
     if (this.isJoinPending() || this.liveSocket.hasPendingLink() && this.root.isMain()) {
-      return this.pendingDiffs.push({ diff, events });
+      if (!isPending) {
+        this.pendingDiffs.push({ diff, events });
+      }
+      return false;
     }
     this.rendered.mergeDiff(diff);
     let phxChildrenAdded = false;
@@ -4651,6 +4654,7 @@ var View = class _View {
     if (phxChildrenAdded) {
       this.joinNewChildren();
     }
+    return true;
   }
   renderContainer(diff, kind) {
     return this.liveSocket.time(`toString diff (${kind})`, () => {
@@ -4729,11 +4733,9 @@ var View = class _View {
     delete this.viewHooks[hookId];
   }
   applyPendingUpdates() {
-    if (this.liveSocket.hasPendingLink() && this.root.isMain()) {
-      return;
-    }
-    this.pendingDiffs.forEach(({ diff, events }) => this.update(diff, events));
-    this.pendingDiffs = [];
+    this.pendingDiffs = this.pendingDiffs.filter(
+      ({ diff, events }) => !this.update(diff, events, true)
+    );
     this.eachChild((child) => child.applyPendingUpdates());
   }
   eachChild(callback) {
@@ -5788,7 +5790,7 @@ var LiveSocket = class {
   }
   // public
   version() {
-    return "1.1.7";
+    return "1.1.8";
   }
   isProfileEnabled() {
     return this.sessionStorage.getItem(PHX_LV_PROFILE) === "true";