await for FetchRequest delegate to handle response

seanpdoyle · seanpdoyle · commit 696e2c703774 · 2025-11-20T19:14:25.000-05:00
Closes [#884] Despite the fact that `Visit` and `FrameController` are `FetchRequest` delegate classes that implement their delegate methods asynchronously on success ([Visit.requestSucceededWithResponse][] and [FrameController.requestSucceededWithResponse][]) and on failure ([Visit.requestFailedWithResponse][]) and [FrameController.requestFailedWithResponse][]), the `async FetchRequest.receive` method doesn't use the `await` keyword to wait for those delegates to finish handling their callbacks. This commit adds those `await` clauses. [Visit.requestSucceededWithResponse]: https://github.com/hotwired/turbo/blob/c207f5b25758e4a084e8ae42e49712b91cf37114/src/core/drive/visit.js#L297 [FrameController.requestSucceededWithResponse]: https://github.com/hotwired/turbo/blob/c207f5b25758e4a084e8ae42e49712b91cf37114/src/core/frames/frame_controller.js#L210 [Visit.requestFailedWithResponse]: https://github.com/hotwired/turbo/blob/c207f5b25758e4a084e8ae42e49712b91cf37114/src/core/drive/visit.js#L311 [FrameController.requestFailedWithResponse]: https://github.com/hotwired/turbo/blob/c207f5b25758e4a084e8ae42e49712b91cf37114/src/core/frames/frame_controller.js#L215 [#884]: #884
diff --git a/src/core/drive/form_submission.js b/src/core/drive/form_submission.js
@@ -137,7 +137,7 @@ export class FormSubmission {
     this.result = { success: response.succeeded, fetchResponse: response }
   }
 
-  requestSucceededWithResponse(request, response) {
+  async requestSucceededWithResponse(request, response) {
     if (response.clientError || response.serverError) {
       this.delegate.formSubmissionFailedWithResponse(this, response)
       return
@@ -151,7 +151,7 @@ export class FormSubmission {
     } else {
       this.state = FormSubmissionState.receiving
       this.result = { success: true, fetchResponse: response }
-      this.delegate.formSubmissionSucceededWithResponse(this, response)
+      await this.delegate.formSubmissionSucceededWithResponse(this, response)
     }
   }
 
diff --git a/src/core/frames/frame_controller.js b/src/core/frames/frame_controller.js
@@ -233,11 +233,11 @@ export class FrameController {
     markAsBusy(formElement, this.#findFrameElement(formElement))
   }
 
-  formSubmissionSucceededWithResponse(formSubmission, response) {
+  async formSubmissionSucceededWithResponse(formSubmission, response) {
     const frame = this.#findFrameElement(formSubmission.formElement, formSubmission.submitter)
 
     frame.delegate.proposeVisitIfNavigatedWithAction(frame, getVisitAction(formSubmission.submitter, formSubmission.formElement, frame))
-    frame.delegate.loadResponse(response)
+    await frame.delegate.loadResponse(response)
 
     if (!formSubmission.isSafe) {
       session.clearCache()
diff --git a/src/http/fetch_request.js b/src/http/fetch_request.js
@@ -155,7 +155,7 @@ export class FetchRequest {
     if (event.defaultPrevented) {
       this.delegate.requestPreventedHandlingResponse(this, fetchResponse)
     } else if (fetchResponse.succeeded) {
-      this.delegate.requestSucceededWithResponse(this, fetchResponse)
+      await this.delegate.requestSucceededWithResponse(this, fetchResponse)
     } else {
       this.delegate.requestFailedWithResponse(this, fetchResponse)
     }
diff --git a/src/tests/functional/frame_tests.js b/src/tests/functional/frame_tests.js
@@ -719,16 +719,16 @@ test("navigating pushing URL state from a frame navigation fires events", async
   await nextEventOnTarget(page, "frame", "turbo:before-fetch-response")
   await nextEventOnTarget(page, "frame", "turbo:frame-render")
   await nextEventOnTarget(page, "frame", "turbo:frame-load")
-  expect(await nextAttributeMutationNamed(page, "frame", "aria-busy"), "removes aria-busy from the <turbo-frame>").not.toBeTruthy()
-
   expect(await nextAttributeMutationNamed(page, "html", "aria-busy"), "sets aria-busy on the <html>").toEqual("true")
+
+  expect(await nextAttributeMutationNamed(page, "frame", "aria-busy"), "removes aria-busy from the <turbo-frame>").toEqual(null)
   await nextEventOnTarget(page, "html", "turbo:before-visit")
   await nextEventOnTarget(page, "html", "turbo:visit")
   await nextEventOnTarget(page, "html", "turbo:before-cache")
   await nextEventOnTarget(page, "html", "turbo:before-render")
   await nextEventOnTarget(page, "html", "turbo:render")
   await nextEventOnTarget(page, "html", "turbo:load")
-  expect(await nextAttributeMutationNamed(page, "html", "aria-busy"), "removes aria-busy from the <html>").not.toBeTruthy()
+  expect(await nextAttributeMutationNamed(page, "html", "aria-busy"), "removes aria-busy from the <html>").toEqual(null)
 })
 
 test("navigating a frame with a form[method=get] that does not redirect still updates the [src]", async ({
@@ -933,6 +933,14 @@ test("navigating frame with form[method=post][data-turbo-action=advance] to the
   await page.click("#form-post-frame-action-advance button")
   await nextEventNamed(page, "turbo:load")
 
+  expect(await nextAttributeMutationNamed(page, "form-post-frame-action-advance", "aria-busy"), "sets aria-busy on the <form>").toEqual("true")
+  expect(await nextAttributeMutationNamed(page, "frame", "aria-busy"), "sets aria-busy on the <turbo-frame>").toEqual("true")
+  expect(await nextAttributeMutationNamed(page, "html", "aria-busy"), "sets aria-busy on the <html>").toEqual("true")
+
+  expect(await nextAttributeMutationNamed(page, "form-post-frame-action-advance", "aria-busy"), "removes aria-busy from the <form>").toEqual(null)
+  expect(await nextAttributeMutationNamed(page, "frame", "aria-busy"), "removes aria-busy from the <turbo-frame>").toEqual(null)
+  expect(await nextAttributeMutationNamed(page, "html", "aria-busy"), "removes aria-busy from the <html>").toEqual(null)
+
   await expect(page.locator("#frame"), "clears turbo-frame[aria-busy]").not.toHaveAttribute("aria-busy")
   await expect(page.locator("#html"), "clears html[aria-busy]").not.toHaveAttribute("aria-busy")
   await expect(page.locator("#html"), "clears html[data-turbo-preview]").not.toHaveAttribute("data-turbo-preview")

Original file line number	Diff line number	Diff line change
`@@ -137,7 +137,7 @@ export class FormSubmission {`
`137`	`137`	`this.result = { success: response.succeeded, fetchResponse: response }`
`138`	`138`	`}`
`139`	`139`
`140`		`- requestSucceededWithResponse(request, response) {`
	`140`	`+ async requestSucceededWithResponse(request, response) {`
`141`	`141`	`if (response.clientError \|\| response.serverError) {`
`142`	`142`	`this.delegate.formSubmissionFailedWithResponse(this, response)`
`143`	`143`	`return`
`@@ -151,7 +151,7 @@ export class FormSubmission {`
`151`	`151`	`} else {`
`152`	`152`	`this.state = FormSubmissionState.receiving`
`153`	`153`	`this.result = { success: true, fetchResponse: response }`
`154`		`- this.delegate.formSubmissionSucceededWithResponse(this, response)`
	`154`	`+ await this.delegate.formSubmissionSucceededWithResponse(this, response)`
`155`	`155`	`}`
`156`	`156`	`}`
`157`	`157`
Original file line number	Diff line number	Diff line change
`@@ -155,7 +155,7 @@ export class FetchRequest {`
`155`	`155`	`if (event.defaultPrevented) {`
`156`	`156`	`this.delegate.requestPreventedHandlingResponse(this, fetchResponse)`
`157`	`157`	`} else if (fetchResponse.succeeded) {`
`158`		`- this.delegate.requestSucceededWithResponse(this, fetchResponse)`
	`158`	`+ await this.delegate.requestSucceededWithResponse(this, fetchResponse)`
`159`	`159`	`} else {`
`160`	`160`	`this.delegate.requestFailedWithResponse(this, fetchResponse)`
`161`	`161`	`}`