Dispatch visit events on the initiator link or form

src/core/drive/navigator.ts

@@ -8,7 +8,7 @@ import { Visit, VisitDelegate, VisitOptions } from "./visit"
 import { PageSnapshot } from "./page_snapshot"
 
 export type NavigatorDelegate = VisitDelegate & {
-  allowsVisitingLocationWithAction(location: URL, action?: Action): boolean
+  allowsVisitingLocation(location: URL, options: Partial<VisitOptions>): boolean
   visitProposedToLocation(location: URL, options: Partial<VisitOptions>): Promise<void>
   notifyApplicationAfterVisitingSamePageLocation(oldURL: URL, newURL: URL): void
 }
@@ -24,7 +24,7 @@ export class Navigator {
   }
 
   proposeVisit(location: URL, options: Partial<VisitOptions> = {}) {
-    if (this.delegate.allowsVisitingLocationWithAction(location, options.action)) {
+    if (this.delegate.allowsVisitingLocation(location, options)) {
       if (locationIsVisitable(location, this.view.snapshot.rootLocation)) {
         return this.delegate.visitProposedToLocation(location, options)
       } else {

src/core/drive/visit.ts

@@ -51,6 +51,7 @@ export type VisitOptions = {
   shouldCacheSnapshot: boolean
   frame?: string
   acceptsStreamResponse: boolean
+  initiator: Element
 }
 
 const defaultOptions: VisitOptions = {
@@ -61,6 +62,7 @@ const defaultOptions: VisitOptions = {
   updateHistory: true,
   shouldCacheSnapshot: true,
   acceptsStreamResponse: false,
+  initiator: document.documentElement,
 }
 
 export type VisitResponse = {
@@ -86,6 +88,7 @@ export class Visit implements FetchRequestDelegate {
   readonly willRender: boolean
   readonly updateHistory: boolean
   readonly promise: Promise<void>
+  readonly initiator: Element
 
   private resolvingFunctions!: ResolvingFunctions<void>
 
@@ -126,6 +129,7 @@ export class Visit implements FetchRequestDelegate {
       updateHistory,
       shouldCacheSnapshot,
       acceptsStreamResponse,
+      initiator,
     } = {
       ...defaultOptions,
       ...options,
@@ -142,6 +146,7 @@ export class Visit implements FetchRequestDelegate {
     this.scrolled = !willRender
     this.shouldCacheSnapshot = shouldCacheSnapshot
     this.acceptsStreamResponse = acceptsStreamResponse
+    this.initiator = initiator
   }
 
   get adapter() {
@@ -222,7 +227,7 @@ export class Visit implements FetchRequestDelegate {
     if (this.hasPreloadedResponse()) {
       this.simulateRequest()
     } else if (this.shouldIssueRequest() && !this.request) {
-      this.request = new FetchRequest(this, FetchMethod.get, this.location)
+      this.request = new FetchRequest(this, FetchMethod.get, this.location, undefined, this.initiator)
       this.request.perform()
     }
   }

src/core/session.ts

@@ -195,13 +195,16 @@ export class Session
     const action = this.getActionForLink(link)
     const acceptsStreamResponse = link.hasAttribute("data-turbo-stream")
 
-    this.visit(location.href, { action, acceptsStreamResponse })
+    this.visit(location.href, { action, acceptsStreamResponse, initiator: link })
   }
 
   // Navigator delegate
 
-  allowsVisitingLocationWithAction(location: URL, action?: Action) {
-    return this.locationWithActionIsSamePage(location, action) || this.applicationAllowsVisitingLocation(location)
+  allowsVisitingLocation(location: URL, options: Partial<VisitOptions> = {}) {
+    return (
+      this.locationWithActionIsSamePage(location, options.action) ||
+      this.applicationAllowsVisitingLocation(location, options)
+    )
   }
 
   visitProposedToLocation(location: URL, options: Partial<VisitOptions>) {
@@ -215,7 +218,7 @@ export class Session
     }
     extendURLWithDeprecatedProperties(visit.location)
     if (!visit.silent) {
-      this.notifyApplicationAfterVisitingLocation(visit.location, visit.action)
+      this.notifyApplicationAfterVisitingLocation(visit.location, visit.action, visit.initiator)
     }
   }
 
@@ -329,8 +332,8 @@ export class Session
     return !event.defaultPrevented
   }
 
-  applicationAllowsVisitingLocation(location: URL) {
-    const event = this.notifyApplicationBeforeVisitingLocation(location)
+  applicationAllowsVisitingLocation(location: URL, options: Partial<VisitOptions> = {}) {
+    const event = this.notifyApplicationBeforeVisitingLocation(location, options.initiator)
     return !event.defaultPrevented
   }
 
@@ -342,15 +345,19 @@ export class Session
     })
   }
 
-  notifyApplicationBeforeVisitingLocation(location: URL) {
+  notifyApplicationBeforeVisitingLocation(location: URL, element?: Element) {
     return dispatch<TurboBeforeVisitEvent>("turbo:before-visit", {
+      target: element,
       detail: { url: location.href },
       cancelable: true,
     })
   }
 
-  notifyApplicationAfterVisitingLocation(location: URL, action: Action) {
-    return dispatch<TurboVisitEvent>("turbo:visit", { detail: { url: location.href, action } })
+  notifyApplicationAfterVisitingLocation(location: URL, action: Action, element?: Element) {
+    return dispatch<TurboVisitEvent>("turbo:visit", {
+      target: element,
+      detail: { url: location.href, action },
+    })
   }
 
   notifyApplicationBeforeCachingSnapshot() {

src/http/fetch_request.ts

@@ -1,5 +1,4 @@
 import { FetchResponse } from "./fetch_response"
-import { FrameElement } from "../elements/frame_element"
 import { dispatch } from "../util"
 
 export type TurboBeforeFetchRequestEvent = CustomEvent<{
@@ -62,7 +61,7 @@ export class FetchRequest {
   readonly headers: FetchRequestHeaders
   readonly url: URL
   readonly body?: FetchRequestBody
-  readonly target?: FrameElement | HTMLFormElement | null
+  readonly target?: Element | null
   readonly abortController = new AbortController()
   private resolveRequestPromise = (_value: any) => {}
 
@@ -71,7 +70,7 @@ export class FetchRequest {
     method: FetchMethod,
     location: URL,
     body: FetchRequestBody = new URLSearchParams(),
-    target: FrameElement | HTMLFormElement | null = null
+    target: Element | null = null
   ) {
     this.delegate = delegate
     this.method = method

src/tests/functional/navigation_tests.ts

@@ -10,6 +10,7 @@ import {
   nextBody,
   nextEventNamed,
   noNextEventNamed,
+  nextEventOnTarget,
   pathname,
   readEventLogs,
   search,
@@ -381,3 +382,15 @@ test("test ignores links that target an iframe", async ({ page }) => {
 
   assert.equal(pathname(page.url()), "/src/tests/fixtures/navigation.html")
 })
+
+test("test visit events are dispatched on the initiator", async ({ page }) => {
+  await page.click("#same-origin-unannotated-link")
+  await nextEventOnTarget(page, "same-origin-unannotated-link", "turbo:before-visit")
+  await nextEventOnTarget(page, "same-origin-unannotated-link", "turbo:visit")
+})
+
+test("test fetch events are dispatched on the initiator", async ({ page }) => {
+  await page.click("#same-origin-unannotated-link")
+  await nextEventOnTarget(page, "same-origin-unannotated-link", "turbo:before-fetch-request")
+  await nextEventOnTarget(page, "same-origin-unannotated-link", "turbo:before-fetch-response")
+})