Merge branch 'main' into initiator_with_native_support_2

package.json

@@ -1,13 +1,12 @@
 {
-  "name": "@hotwired/turbo",
-  "version": "7.3.0",
+  "name": "@domchristie/turbo",
+  "version": "7.4.0",
   "description": "The speed of a single-page web application without having to write any JavaScript",
   "module": "dist/turbo.es2017-esm.js",
   "main": "dist/turbo.es2017-umd.js",
   "files": [
     "dist/*.js",
-    "dist/*.js.map",
-    "dist/types/**/*"
+    "dist/*.js.map"
   ],
   "repository": {
     "type": "git",
@@ -37,8 +36,6 @@
     "@open-wc/testing": "^3.1.7",
     "@playwright/test": "^1.28.0",
     "@rollup/plugin-node-resolve": "13.1.3",
-    "@rollup/plugin-typescript": "^11.0.0",
-    "@typescript-eslint/eslint-plugin": "^5.50.0",
     "@web/dev-server-esbuild": "^0.3.3",
     "@web/test-runner": "^0.15.0",
     "@web/test-runner-playwright": "^0.9.0",

src/core/drive/history.js

@@ -6,6 +6,7 @@ export class History {
   restorationData = {}
   started = false
   pageLoaded = false
+  currentIndex = 0
 
   constructor(delegate) {
     this.delegate = delegate
@@ -15,6 +16,7 @@ export class History {
     if (!this.started) {
       addEventListener("popstate", this.onPopState, false)
       addEventListener("load", this.onPageLoad, false)
+      this.currentIndex = history.state?.turbo?.restorationIndex || 0
       this.started = true
       this.replace(new URL(window.location.href))
     }
@@ -37,7 +39,9 @@ export class History {
   }
 
   update(method, location, restorationIdentifier = uuid()) {
-    const state = { turbo: { restorationIdentifier } }
+    if (method === history.pushState) ++this.currentIndex
+
+    const state = { turbo: { restorationIdentifier, restorationIndex: this.currentIndex } }
     method.call(history, state, "", location.href)
     this.location = location
     this.restorationIdentifier = restorationIdentifier
@@ -81,9 +85,11 @@ export class History {
       const { turbo } = event.state || {}
       if (turbo) {
         this.location = new URL(window.location.href)
-        const { restorationIdentifier } = turbo
+        const { restorationIdentifier, restorationIndex } = turbo
         this.restorationIdentifier = restorationIdentifier
-        this.delegate.historyPoppedToLocationWithRestorationIdentifier(this.location, restorationIdentifier)
+        const direction = restorationIndex > this.currentIndex ? "forward" : "back"
+        this.delegate.historyPoppedToLocationWithRestorationIdentifierAndDirection(this.location, restorationIdentifier, direction)
+        this.currentIndex = restorationIndex
       }
     }
   }

src/core/drive/visit.js

@@ -36,6 +36,12 @@ export const SystemStatusCode = {
   contentTypeMismatch: -2
 }
 
+export const Direction = {
+  advance: "forward",
+  restore: "back",
+  replace: "none"
+}
+
 export class Visit {
   identifier = uuid() // Required by turbo-ios
   timingMetrics = {}
@@ -66,6 +72,7 @@ export class Visit {
       updateHistory,
       shouldCacheSnapshot,
       acceptsStreamResponse,
+      direction,
       initiator
     } = {
       ...defaultOptions,
@@ -84,6 +91,7 @@ export class Visit {
     this.scrolled = !willRender
     this.shouldCacheSnapshot = shouldCacheSnapshot
     this.acceptsStreamResponse = acceptsStreamResponse
+    this.direction = direction || Direction[action]
     this.initiator = initiator
   }
 

src/core/session.js

@@ -125,11 +125,12 @@ export class Session {
 
   // History delegate
 
-  historyPoppedToLocationWithRestorationIdentifier(location, restorationIdentifier) {
+  historyPoppedToLocationWithRestorationIdentifierAndDirection(location, restorationIdentifier, direction) {
     if (this.enabled) {
       this.navigator.startVisit(location, restorationIdentifier, {
         action: "restore",
-        historyChanged: true
+        historyChanged: true,
+        direction
       })
     } else {
       this.adapter.pageInvalidated({
@@ -191,7 +192,7 @@ export class Session {
     }
     extendURLWithDeprecatedProperties(visit.location)
     if (!visit.silent) {
-      this.notifyApplicationAfterVisitingLocation(visit.location, visit.action, visit.initiator)
+      this.notifyApplicationAfterVisitingLocation(visit.location, visit.action, visit.direction, visit.initiator)
     }
   }
 
@@ -317,11 +318,8 @@ export class Session {
     })
   }
 
-  notifyApplicationAfterVisitingLocation(location, action, target) {
-    return dispatch("turbo:visit", {
-      target,
-      detail: { url: location.href, action }
-    })
+  notifyApplicationAfterVisitingLocation(location, action, direction, target) {
+    return dispatch("turbo:visit", { detail: { url: location.href, action, direction, target } })
   }
 
   notifyApplicationBeforeCachingSnapshot() {

src/tests/fixtures/visit.html

@@ -13,6 +13,7 @@
     <section>
       <h1>Visit</h1>
       <p><a id="same-origin-link" href="/src/tests/fixtures/one.html">Same-origin link</a></p>
+      <p><a id="same-origin-replace-link" href="/src/tests/fixtures/one.html" data-turbo-action="replace">Same-origin replace link</a></p>
       <p><a id="same-origin-link-search-params" href="/src/tests/fixtures/one.html?key=value">Same-origin link with ?key=value</a></p>
       <p><a id="sample-response" href="/src/tests/fixtures/one.html">Sample response</a></p>
       <p><a id="same-page-link" href="/src/tests/fixtures/visit.html">Same page link</a></p>

src/tests/functional/visit_tests.js

@@ -220,6 +220,40 @@ test("test Visit with network error", async ({ page }) => {
   await nextEventNamed(page, "turbo:fetch-request-error")
 })
 
+test("test turbo:visit direction details", async ({ page }) => {
+  await page.click("#same-origin-link")
+  let details = await nextEventNamed(page, "turbo:visit")
+  assert.equal(details.direction, "forward")
+
+  await nextEventNamed(page, "turbo:load")
+  await page.goBack()
+  details = await nextEventNamed(page, "turbo:visit")
+  assert.equal(details.direction, "back")
+
+  await nextEventNamed(page, "turbo:load")
+  await page.goForward()
+  details = await nextEventNamed(page, "turbo:visit")
+  assert.equal(details.direction, "forward")
+
+  await nextEventNamed(page, "turbo:load")
+  await page.goBack()
+  await nextEventNamed(page, "turbo:load")
+  await page.click("#same-origin-replace-link")
+  details = await nextEventNamed(page, "turbo:visit")
+  assert.equal(details.direction, "none")
+})
+
+test("test turbo:visit direction details after a reload", async ({ page }) => {
+  await page.click("#same-origin-link")
+  await nextEventNamed(page, "turbo:load")
+  await page.reload()
+  assert.equal(
+    await page.evaluate(() => window.history.state.turbo.restorationIndex),
+    1,
+    "restorationIndex is persisted between reloads"
+  )
+})
+
 async function visitLocation(page, location) {
   return page.evaluate((location) => window.Turbo.visit(location), location)
 }