1.4 release prep

CHANGELOG.md

@@ -8,6 +8,7 @@
 * The `htmx.config.useTemplateFraments` option was added, allowing you to use HTML template tags for parsing content
   from the server.  This allows you to use Out of Band content when returning things like table rows, but it is not
   IE11 compatible.
+* The `defaultSettleDelay` was dropped to 20ms from 100ms
 * Introduced a new synthetic event, [intersect](/docs#pecial-events) that allows you to trigger when an item is scrolled into view
   as specified by the `IntersectionObserver` API
 * Fixed timing issue that caused exceptions in the `reveal` logic when scrolling at incredible speeds - <https://github.com/bigskysoftware/htmx/issues/463>

dist/htmx.js

@@ -2187,7 +2187,12 @@ return (function () {
                 triggeringEvent:event
             };
 
-            if(!triggerEvent(elt, 'htmx:configRequest', requestConfig)) return endRequestLock();
+            if(!triggerEvent(elt, 'htmx:configRequest', requestConfig)){
+                maybeCall(resolve);
+                endRequestLock();
+                return promise;
+            }
+
             // copy out in case the object was overwritten
             path = requestConfig.path;
             verb = requestConfig.verb;

src/htmx.js

@@ -2187,7 +2187,12 @@ return (function () {
                 triggeringEvent:event
             };
 
-            if(!triggerEvent(elt, 'htmx:configRequest', requestConfig)) return endRequestLock();
+            if(!triggerEvent(elt, 'htmx:configRequest', requestConfig)){
+                maybeCall(resolve);
+                endRequestLock();
+                return promise;
+            }
+
             // copy out in case the object was overwritten
             path = requestConfig.path;
             verb = requestConfig.verb;

test/core/events.js

@@ -366,5 +366,83 @@ describe("Core htmx Events", function() {
         }
     });
 
+    it("adding an error in htmx:configRequest stops the request", function () {
+        try {
+            var handler = htmx.on("htmx:configRequest", function (evt) {
+                evt.detail.errors.push("An error");
+            });
+            var request = false;
+            this.server.respondWith("POST", "/test", function (xhr) {
+                request = true;
+                xhr.respond(200, {}, "<button>Bar</button>");
+            });
+            var div = make("<button hx-post='/test' hx-swap='outerHTML'>Foo</button>");
+            div.click();
+            this.server.respond();
+            should.equal(request, false);
+        } finally {
+            htmx.off("htmx:configRequest", handler);
+        }
+    });
+
+    it("preventDefault() in htmx:configRequest stops the request", function () {
+        try {
+            var handler = htmx.on("htmx:configRequest", function (evt) {
+                evt.detail.errors.push("An error");
+            });
+            var request = false;
+            this.server.respondWith("POST", "/test", function (xhr) {
+                request = true;
+                xhr.respond(200, {}, "<button>Bar</button>");
+            });
+            var div = make("<button hx-post='/test' hx-swap='outerHTML'>Foo</button>");
+            div.click();
+            this.server.respond();
+            should.equal(request, false);
+        } finally {
+            htmx.off("htmx:configRequest", handler);
+        }
+    });
+
+    it("preventDefault() in the htmx:beforeRequest event cancels the request", function () {
+        try {
+            var handler = htmx.on("htmx:beforeRequest", function (evt) {
+                evt.preventDefault();
+            });
+            var request = false;
+            this.server.respondWith("POST", "/test", function (xhr) {
+                request = true;
+                xhr.respond(200, {}, "<button>Bar</button>");
+            });
+            var div = make("<button hx-post='/test' hx-swap='outerHTML'>Foo</button>");
+            div.click();
+            this.server.respond();
+            should.equal(request, false);
+        } finally {
+            htmx.off("htmx:beforeRequest", handler);
+        }
+    });
+
+    it("preventDefault() in the htmx:beforeOnLoad event cancels the swap", function () {
+        try {
+            var handler = htmx.on("htmx:beforeOnLoad", function (evt) {
+                evt.preventDefault();
+            });
+            var request = false;
+            this.server.respondWith("POST", "/test", function (xhr) {
+                request = true;
+                xhr.respond(200, {}, "Bar");
+            });
+            var div = make("<button hx-post='/test'>Foo</button>");
+            div.click();
+            this.server.respond();
+            should.equal(request, true);
+            div.innerText.should.equal("Foo");
+        } finally {
+            htmx.off("htmx:beforeOnLoad", handler);
+        }
+    });
+
+
 });
 

www/events.md

@@ -32,7 +32,7 @@ This event is triggered after htmx has initialized a DOM node.  It can be useful
 
 This event is triggered after an AJAX request has finished either in the case of a successful request (although
 one that may have returned a remote error code such as a `404`) or in a network error situation.  This event
-can be paried with [`htmx:beforeRequest`](#htmx:beforeRequest) to wrap behavior around a request cycle.
+can be paired with [`htmx:beforeRequest`](#htmx:beforeRequest) to wrap behavior around a request cycle.
 
 ##### Details
 

www/js/htmx.js

@@ -2187,7 +2187,12 @@ return (function () {
                 triggeringEvent:event
             };
 
-            if(!triggerEvent(elt, 'htmx:configRequest', requestConfig)) return endRequestLock();
+            if(!triggerEvent(elt, 'htmx:configRequest', requestConfig)){
+                maybeCall(resolve);
+                endRequestLock();
+                return promise;
+            }
+
             // copy out in case the object was overwritten
             path = requestConfig.path;
             verb = requestConfig.verb;

www/test/1.4.0/src/htmx.js

@@ -2187,7 +2187,12 @@ return (function () {
                 triggeringEvent:event
             };
 
-            if(!triggerEvent(elt, 'htmx:configRequest', requestConfig)) return endRequestLock();
+            if(!triggerEvent(elt, 'htmx:configRequest', requestConfig)){
+                maybeCall(resolve);
+                endRequestLock();
+                return promise;
+            }
+
             // copy out in case the object was overwritten
             path = requestConfig.path;
             verb = requestConfig.verb;

www/test/1.4.0/test/core/events.js

@@ -366,5 +366,83 @@ describe("Core htmx Events", function() {
         }
     });
 
+    it("adding an error in htmx:configRequest stops the request", function () {
+        try {
+            var handler = htmx.on("htmx:configRequest", function (evt) {
+                evt.detail.errors.push("An error");
+            });
+            var request = false;
+            this.server.respondWith("POST", "/test", function (xhr) {
+                request = true;
+                xhr.respond(200, {}, "<button>Bar</button>");
+            });
+            var div = make("<button hx-post='/test' hx-swap='outerHTML'>Foo</button>");
+            div.click();
+            this.server.respond();
+            should.equal(request, false);
+        } finally {
+            htmx.off("htmx:configRequest", handler);
+        }
+    });
+
+    it("preventDefault() in htmx:configRequest stops the request", function () {
+        try {
+            var handler = htmx.on("htmx:configRequest", function (evt) {
+                evt.detail.errors.push("An error");
+            });
+            var request = false;
+            this.server.respondWith("POST", "/test", function (xhr) {
+                request = true;
+                xhr.respond(200, {}, "<button>Bar</button>");
+            });
+            var div = make("<button hx-post='/test' hx-swap='outerHTML'>Foo</button>");
+            div.click();
+            this.server.respond();
+            should.equal(request, false);
+        } finally {
+            htmx.off("htmx:configRequest", handler);
+        }
+    });
+
+    it("preventDefault() in the htmx:beforeRequest event cancels the request", function () {
+        try {
+            var handler = htmx.on("htmx:beforeRequest", function (evt) {
+                evt.preventDefault();
+            });
+            var request = false;
+            this.server.respondWith("POST", "/test", function (xhr) {
+                request = true;
+                xhr.respond(200, {}, "<button>Bar</button>");
+            });
+            var div = make("<button hx-post='/test' hx-swap='outerHTML'>Foo</button>");
+            div.click();
+            this.server.respond();
+            should.equal(request, false);
+        } finally {
+            htmx.off("htmx:beforeRequest", handler);
+        }
+    });
+
+    it("preventDefault() in the htmx:beforeOnLoad event cancels the swap", function () {
+        try {
+            var handler = htmx.on("htmx:beforeOnLoad", function (evt) {
+                evt.preventDefault();
+            });
+            var request = false;
+            this.server.respondWith("POST", "/test", function (xhr) {
+                request = true;
+                xhr.respond(200, {}, "Bar");
+            });
+            var div = make("<button hx-post='/test'>Foo</button>");
+            div.click();
+            this.server.respond();
+            should.equal(request, true);
+            div.innerText.should.equal("Foo");
+        } finally {
+            htmx.off("htmx:beforeOnLoad", handler);
+        }
+    });
+
+
 });