@hotwired/turbo 8.0.0-rc.2 → 8.0.0

package/dist/turbo.es2017-esm.js

@@ -1,5 +1,5 @@
 /*!
-Turbo 8.0.0-rc.2
+Turbo 8.0.0
 Copyright © 2024 37signals LLC
  */
 /**
@@ -3085,8 +3085,7 @@ class History {
 
 class LinkPrefetchObserver {
   started = false
-  hoverTriggerEvent = "mouseenter"
-  touchTriggerEvent = "touchstart"
+  #prefetchedLink = null
 
   constructor(delegate, eventTarget) {
     this.delegate = delegate;
@@ -3106,33 +3105,35 @@ class LinkPrefetchObserver {
   stop() {
     if (!this.started) return
 
-    this.eventTarget.removeEventListener(this.hoverTriggerEvent, this.#tryToPrefetchRequest, {
+    this.eventTarget.removeEventListener("mouseenter", this.#tryToPrefetchRequest, {
       capture: true,
       passive: true
     });
-    this.eventTarget.removeEventListener(this.touchTriggerEvent, this.#tryToPrefetchRequest, {
+    this.eventTarget.removeEventListener("mouseleave", this.#cancelRequestIfObsolete, {
       capture: true,
       passive: true
     });
+
     this.eventTarget.removeEventListener("turbo:before-fetch-request", this.#tryToUsePrefetchedRequest, true);
     this.started = false;
   }
 
   #enable = () => {
-    this.eventTarget.addEventListener(this.hoverTriggerEvent, this.#tryToPrefetchRequest, {
+    this.eventTarget.addEventListener("mouseenter", this.#tryToPrefetchRequest, {
       capture: true,
       passive: true
     });
-    this.eventTarget.addEventListener(this.touchTriggerEvent, this.#tryToPrefetchRequest, {
+    this.eventTarget.addEventListener("mouseleave", this.#cancelRequestIfObsolete, {
       capture: true,
       passive: true
     });
+
     this.eventTarget.addEventListener("turbo:before-fetch-request", this.#tryToUsePrefetchedRequest, true);
     this.started = true;
   }
 
   #tryToPrefetchRequest = (event) => {
-    if (getMetaContent("turbo-prefetch") !== "true") return
+    if (getMetaContent("turbo-prefetch") === "false") return
 
     const target = event.target;
     const isLink = target.matches && target.matches("a[href]:not([target^=_]):not([download])");
@@ -3142,6 +3143,8 @@ class LinkPrefetchObserver {
       const location = getLocationForLink(link);
 
       if (this.delegate.canPrefetchRequestToLocation(link, location)) {
+        this.#prefetchedLink = link;
+
         const fetchRequest = new FetchRequest(
           this,
           FetchMethod.get,
@@ -3151,12 +3154,19 @@ class LinkPrefetchObserver {
         );
 
         prefetchCache.setLater(location.toString(), fetchRequest, this.#cacheTtl);
-
-        link.addEventListener("mouseleave", () => prefetchCache.clear(), { once: true });
       }
     }
   }
 
+  #cancelRequestIfObsolete = (event) => {
+    if (event.target === this.#prefetchedLink) this.#cancelPrefetchRequest();
+  }
+
+  #cancelPrefetchRequest = () => {
+    prefetchCache.clear();
+    this.#prefetchedLink = null;
+  }
+
   #tryToUsePrefetchedRequest = (event) => {
     if (event.target.tagName !== "FORM" && event.detail.fetchOptions.method === "get") {
       const cached = prefetchCache.get(event.detail.url.toString());
@@ -3208,7 +3218,16 @@ class LinkPrefetchObserver {
   #isPrefetchable(link) {
     const href = link.getAttribute("href");
 
-    if (!href || href === "#" || link.getAttribute("data-turbo") === "false" || link.getAttribute("data-turbo-prefetch") === "false") {
+    if (!href || href.startsWith("#") || link.getAttribute("data-turbo") === "false" || link.getAttribute("data-turbo-prefetch") === "false") {
+      return false
+    }
+
+    const event = dispatch("turbo:before-prefetch", {
+      target: link,
+      cancelable: true
+    });
+
+    if (event.defaultPrevented) {
       return false
     }
 

package/dist/turbo.es2017-umd.js

@@ -1,5 +1,5 @@
 /*!
-Turbo 8.0.0-rc.2
+Turbo 8.0.0
 Copyright © 2024 37signals LLC
  */
 (function (global, factory) {
@@ -3091,8 +3091,7 @@ Copyright © 2024 37signals LLC
 
   class LinkPrefetchObserver {
     started = false
-    hoverTriggerEvent = "mouseenter"
-    touchTriggerEvent = "touchstart"
+    #prefetchedLink = null
 
     constructor(delegate, eventTarget) {
       this.delegate = delegate;
@@ -3112,33 +3111,35 @@ Copyright © 2024 37signals LLC
     stop() {
       if (!this.started) return
 
-      this.eventTarget.removeEventListener(this.hoverTriggerEvent, this.#tryToPrefetchRequest, {
+      this.eventTarget.removeEventListener("mouseenter", this.#tryToPrefetchRequest, {
         capture: true,
         passive: true
       });
-      this.eventTarget.removeEventListener(this.touchTriggerEvent, this.#tryToPrefetchRequest, {
+      this.eventTarget.removeEventListener("mouseleave", this.#cancelRequestIfObsolete, {
         capture: true,
         passive: true
       });
+
       this.eventTarget.removeEventListener("turbo:before-fetch-request", this.#tryToUsePrefetchedRequest, true);
       this.started = false;
     }
 
     #enable = () => {
-      this.eventTarget.addEventListener(this.hoverTriggerEvent, this.#tryToPrefetchRequest, {
+      this.eventTarget.addEventListener("mouseenter", this.#tryToPrefetchRequest, {
         capture: true,
         passive: true
       });
-      this.eventTarget.addEventListener(this.touchTriggerEvent, this.#tryToPrefetchRequest, {
+      this.eventTarget.addEventListener("mouseleave", this.#cancelRequestIfObsolete, {
         capture: true,
         passive: true
       });
+
       this.eventTarget.addEventListener("turbo:before-fetch-request", this.#tryToUsePrefetchedRequest, true);
       this.started = true;
     }
 
     #tryToPrefetchRequest = (event) => {
-      if (getMetaContent("turbo-prefetch") !== "true") return
+      if (getMetaContent("turbo-prefetch") === "false") return
 
       const target = event.target;
       const isLink = target.matches && target.matches("a[href]:not([target^=_]):not([download])");
@@ -3148,6 +3149,8 @@ Copyright © 2024 37signals LLC
         const location = getLocationForLink(link);
 
         if (this.delegate.canPrefetchRequestToLocation(link, location)) {
+          this.#prefetchedLink = link;
+
           const fetchRequest = new FetchRequest(
             this,
             FetchMethod.get,
@@ -3157,12 +3160,19 @@ Copyright © 2024 37signals LLC
           );
 
           prefetchCache.setLater(location.toString(), fetchRequest, this.#cacheTtl);
-
-          link.addEventListener("mouseleave", () => prefetchCache.clear(), { once: true });
         }
       }
     }
 
+    #cancelRequestIfObsolete = (event) => {
+      if (event.target === this.#prefetchedLink) this.#cancelPrefetchRequest();
+    }
+
+    #cancelPrefetchRequest = () => {
+      prefetchCache.clear();
+      this.#prefetchedLink = null;
+    }
+
     #tryToUsePrefetchedRequest = (event) => {
       if (event.target.tagName !== "FORM" && event.detail.fetchOptions.method === "get") {
         const cached = prefetchCache.get(event.detail.url.toString());
@@ -3214,7 +3224,16 @@ Copyright © 2024 37signals LLC
     #isPrefetchable(link) {
       const href = link.getAttribute("href");
 
-      if (!href || href === "#" || link.getAttribute("data-turbo") === "false" || link.getAttribute("data-turbo-prefetch") === "false") {
+      if (!href || href.startsWith("#") || link.getAttribute("data-turbo") === "false" || link.getAttribute("data-turbo-prefetch") === "false") {
+        return false
+      }
+
+      const event = dispatch("turbo:before-prefetch", {
+        target: link,
+        cancelable: true
+      });
+
+      if (event.defaultPrevented) {
         return false
       }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hotwired/turbo",
-  "version": "8.0.0-rc.2",
+  "version": "8.0.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",