Merge pull request #2098 from inertiajs/deferred-props-with-encryptio…

…n-fix Set the history state before swapping component
inertiajs · Dec 3, 2024 · 2d03ebc · 2d03ebc
2 parents 80f762d + 86773e9
commit 2d03ebc
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 22 deletions.
diff --git a/packages/core/src/history.ts b/packages/core/src/history.ts
@@ -30,7 +30,7 @@ class History {
     }
   }
 
-  public pushState(page: Page): void {
+  public pushState(page: Page, cb: (() => void) | null = null): void {
     if (isServer || this.preserveUrl) {
       return
     }
@@ -47,6 +47,8 @@ class History {
           '',
           page.url,
         )
+
+        cb && cb()
       })
     })
   }
@@ -93,7 +95,7 @@ class History {
     return pageData instanceof ArrayBuffer ? decryptHistory(pageData) : Promise.resolve(pageData)
   }
 
-  public replaceState(page: Page): void {
+  public replaceState(page: Page, cb: (() => void) | null = null): void {
     currentPage.merge(page)
 
     if (isServer || this.preserveUrl) {
@@ -112,6 +114,8 @@ class History {
           '',
           page.url,
         )
+
+        cb && cb()
       })
     })
   }

diff --git a/packages/core/src/page.ts b/packages/core/src/page.ts
@@ -61,33 +61,35 @@ class CurrentPage {
       const location = typeof window !== 'undefined' ? window.location : new URL(page.url)
       replace = replace || isSameUrlWithoutHash(hrefToUrl(page.url), location)
 
-      replace ? history.replaceState(page) : history.pushState(page)
+      return new Promise((resolve) => {
+        replace ? history.replaceState(page, () => resolve(null)) : history.pushState(page, () => resolve(null))
+      }).then(() => {
+        const isNewComponent = !this.isTheSame(page)
 
-      const isNewComponent = !this.isTheSame(page)
+        this.page = page
+        this.cleared = false
 
-      this.page = page
-      this.cleared = false
-
-      if (isNewComponent) {
-        this.fireEventsFor('newComponent')
-      }
+        if (isNewComponent) {
+          this.fireEventsFor('newComponent')
+        }
 
-      if (this.isFirstPageLoad) {
-        this.fireEventsFor('firstLoad')
-      }
+        if (this.isFirstPageLoad) {
+          this.fireEventsFor('firstLoad')
+        }
 
-      this.isFirstPageLoad = false
+        this.isFirstPageLoad = false
 
-      return this.swap({ component, page, preserveState }).then(() => {
-        if (!preserveScroll) {
-          Scroll.reset(page)
-        }
+        return this.swap({ component, page, preserveState }).then(() => {
+          if (!preserveScroll) {
+            Scroll.reset(page)
+          }
 
-        eventHandler.fireInternalEvent('loadDeferredProps')
+          eventHandler.fireInternalEvent('loadDeferredProps')
 
-        if (!replace) {
-          fireNavigateEvent(page)
-        }
+          if (!replace) {
+            fireNavigateEvent(page)
+          }
+        })
       })
     })
   }