slide in one change, what could go wrong?

bigskysoftware · Jul 14, 2023 · 5c6805a · 5c6805a
1 parent 1837f1f
commit 5c6805a
Show file tree

Hide file tree

Showing 9 changed files with 73 additions and 17 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -12,6 +12,7 @@
 * Fix bug where the `htmx:afterSettle` event was raised multiple times with oob swaps occured
 * A large number of accessibility fixes were made in the docs (Thank you Denis & crew!)
 * Fixed bug w/ WebSocket extension initialization caused by "naked" `hx-trigger` feature
+* The `HX-Reselect` HTTP response header has been added to change the selection from the returned content
 * Many other smaller bug fixes
 
 ## [1.9.2] - 2023-04-28

diff --git a/dist/htmx.js b/dist/htmx.js
@@ -1010,8 +1010,8 @@ return (function () {
             }
         }
 
-        function maybeSelectFromResponse(elt, fragment) {
-            var selector = getClosestAttributeValue(elt, "hx-select");
+        function maybeSelectFromResponse(elt, fragment, selectOverride) {
+            var selector = selectOverride || getClosestAttributeValue(elt, "hx-select");
             if (selector) {
                 var newFragment = getDocument().createDocumentFragment();
                 forEach(fragment.querySelectorAll(selector), function (node) {
@@ -1085,12 +1085,12 @@ return (function () {
             }
         }
 
-        function selectAndSwap(swapStyle, target, elt, responseText, settleInfo) {
+        function selectAndSwap(swapStyle, target, elt, responseText, settleInfo, selectOverride) {
             settleInfo.title = findTitle(responseText);
             var fragment = makeFragment(responseText);
             if (fragment) {
                 handleOutOfBandSwaps(elt, fragment, settleInfo);
-                fragment = maybeSelectFromResponse(elt, fragment);
+                fragment = maybeSelectFromResponse(elt, fragment, selectOverride);
                 handlePreservedElements(fragment);
                 return swap(swapStyle, elt, target, fragment, settleInfo);
             }
@@ -3325,8 +3325,13 @@ return (function () {
                             // safari issue - see https://github.com/microsoft/playwright/issues/5894
                         }
 
+                        var selectOverride;
+                        if (hasHeader(xhr, /HX-Reselect:/i)) {
+                            selectOverride = xhr.getResponseHeader("HX-Reselect");
+                        }
+
                         var settleInfo = makeSettleInfo(target);
-                        selectAndSwap(swapSpec.swapStyle, target, elt, serverResponse, settleInfo);
+                        selectAndSwap(swapSpec.swapStyle, target, elt, serverResponse, settleInfo, selectOverride);
 
                         if (selectionInfo.elt &&
                             !bodyContains(selectionInfo.elt) &&

diff --git a/dist/htmx.min.js b/dist/htmx.min.js
diff --git a/dist/htmx.min.js.gz b/dist/htmx.min.js.gz
diff --git a/www/content/docs.md b/www/content/docs.md
@@ -114,7 +114,7 @@ The fastest way to get going with htmx is to load it via a CDN. You can simply a
 and get going:
 
 ```html
-<script src="https://unpkg.com/htmx.org@1.9.3" integrity="sha384-XY2Xw5H9PQ+kQW239ss69pMtcqbDSHMqt9wpjGudVRU8fd+37aoZeQYD/dggR3wM" crossorigin="anonymous"></script>
+<script src="https://unpkg.com/htmx.org@1.9.3" integrity="sha384-lVb3Rd/Ca0AxaoZg5sACe8FJKF0tnUgR2Kd7ehUOG5GCcROv5uBIZsOqovBAcWua" crossorigin="anonymous"></script>
 ```
 
 While the CDN approach is extremely simple, you may want to consider [not using CDNs in production](https://blog.wesleyac.com/posts/why-not-javascript-cdn).

diff --git a/www/content/posts/2023-07-14-htmx-1.9.3-is-released.md b/www/content/posts/2023-07-14-htmx-1.9.3-is-released.md
@@ -0,0 +1,30 @@
++++
+title = "htmx 1.9.3 has been released!"
+date = 2023-07-14
+[taxonomies]
+tag = ["posts", "announcements"]
++++
+
+## htmx 1.9.3 Release
+
+I'm happy to announce the [1.9.3 release](https://unpkg.com/browse/htmx.org@1.9.3/) of htmx.
+
+### New Features
+
+* The `hx-on` attribute has been deprecated (sorry) in favor of `hx-on-<event name>` attributes.  See [`hx-on`](/attributes/hx-on) for more information.
+* You can now configure if a type of HTTP request uses the body for parameters or not.  In particular, the `DELETE` _should_ use
+  query parameters, according to the spec.  htmx has used the body, instead.  To avoid breaking code we are keeping this undefined
+  behavior for now, but allowing people to fix it for their use cases by updating the `htmx.config.methodsThatUseUrlParams` config
+  option.  Thank you to Alex and Vincent for their feedback and work on this issue!
+* The `this` symbol is now available in event filter expressions, and refers to the element the `hx-trigger` is on
+* The `HX-Reselect` HTTP response header has been added to change the selection from the returned content
+
+### Improvements & Bug fixes
+
+* We now have functioning CI using GitHub actions!
+* Fix bug where the `htmx:afterSettle` event was raised multiple times with oob swaps occured
+* A large number of accessibility fixes were made in the docs (Thank you Denis & crew!)
+* Fixed bug w/ WebSocket extension initialization caused by "naked" `hx-trigger` feature
+* Many other smaller bug fixes
+
+Thank you to everyone who contributed, and enjoy!
diff --git a/www/static/test/1.9.3/src/htmx.js b/www/static/test/1.9.3/src/htmx.js
@@ -1010,8 +1010,8 @@ return (function () {
             }
         }
 
-        function maybeSelectFromResponse(elt, fragment) {
-            var selector = getClosestAttributeValue(elt, "hx-select");
+        function maybeSelectFromResponse(elt, fragment, selectOverride) {
+            var selector = selectOverride || getClosestAttributeValue(elt, "hx-select");
             if (selector) {
                 var newFragment = getDocument().createDocumentFragment();
                 forEach(fragment.querySelectorAll(selector), function (node) {
@@ -1085,12 +1085,12 @@ return (function () {
             }
         }
 
-        function selectAndSwap(swapStyle, target, elt, responseText, settleInfo) {
+        function selectAndSwap(swapStyle, target, elt, responseText, settleInfo, selectOverride) {
             settleInfo.title = findTitle(responseText);
             var fragment = makeFragment(responseText);
             if (fragment) {
                 handleOutOfBandSwaps(elt, fragment, settleInfo);
-                fragment = maybeSelectFromResponse(elt, fragment);
+                fragment = maybeSelectFromResponse(elt, fragment, selectOverride);
                 handlePreservedElements(fragment);
                 return swap(swapStyle, elt, target, fragment, settleInfo);
             }
@@ -3325,8 +3325,13 @@ return (function () {
                             // safari issue - see https://github.com/microsoft/playwright/issues/5894
                         }
 
+                        var selectOverride;
+                        if (hasHeader(xhr, /HX-Reselect:/i)) {
+                            selectOverride = xhr.getResponseHeader("HX-Reselect");
+                        }
+
                         var settleInfo = makeSettleInfo(target);
-                        selectAndSwap(swapSpec.swapStyle, target, elt, serverResponse, settleInfo);
+                        selectAndSwap(swapSpec.swapStyle, target, elt, serverResponse, settleInfo, selectOverride);
 
                         if (selectionInfo.elt &&
                             !bodyContains(selectionInfo.elt) &&

diff --git a/www/static/test/1.9.3/test/core/headers.js b/www/static/test/1.9.3/test/core/headers.js
@@ -188,6 +188,16 @@ describe("Core htmx AJAX headers", function () {
         div1.innerHTML.should.equal("Result");
     })
 
+    it("should handle HX-Reselect", function () {
+        this.server.respondWith("GET", "/test", [200, {"HX-Reselect": "#d2"}, "<div id='d1'>foo</div><div id='d2'>bar</div>"]);
+
+        var div = make('<div hx-get="/test" hx-select="#d1"></div>');
+        div.click();
+        this.server.respond();
+
+        div.innerHTML.should.equal('<div id="d2">bar</div>');
+    });
+
     it("should handle simple string HX-Trigger-After-Swap response header properly w/ outerHTML swap", function () {
         this.server.respondWith("GET", "/test", [200, {"HX-Trigger-After-Swap": "foo"}, ""]);
 

diff --git a/www/themes/htmx-theme/static/js/htmx.js b/www/themes/htmx-theme/static/js/htmx.js
@@ -1010,8 +1010,8 @@ return (function () {
             }
         }
 
-        function maybeSelectFromResponse(elt, fragment) {
-            var selector = getClosestAttributeValue(elt, "hx-select");
+        function maybeSelectFromResponse(elt, fragment, selectOverride) {
+            var selector = selectOverride || getClosestAttributeValue(elt, "hx-select");
             if (selector) {
                 var newFragment = getDocument().createDocumentFragment();
                 forEach(fragment.querySelectorAll(selector), function (node) {
@@ -1085,12 +1085,12 @@ return (function () {
             }
         }
 
-        function selectAndSwap(swapStyle, target, elt, responseText, settleInfo) {
+        function selectAndSwap(swapStyle, target, elt, responseText, settleInfo, selectOverride) {
             settleInfo.title = findTitle(responseText);
             var fragment = makeFragment(responseText);
             if (fragment) {
                 handleOutOfBandSwaps(elt, fragment, settleInfo);
-                fragment = maybeSelectFromResponse(elt, fragment);
+                fragment = maybeSelectFromResponse(elt, fragment, selectOverride);
                 handlePreservedElements(fragment);
                 return swap(swapStyle, elt, target, fragment, settleInfo);
             }
@@ -3325,8 +3325,13 @@ return (function () {
                             // safari issue - see https://github.com/microsoft/playwright/issues/5894
                         }
 
+                        var selectOverride;
+                        if (hasHeader(xhr, /HX-Reselect:/i)) {
+                            selectOverride = xhr.getResponseHeader("HX-Reselect");
+                        }
+
                         var settleInfo = makeSettleInfo(target);
-                        selectAndSwap(swapSpec.swapStyle, target, elt, serverResponse, settleInfo);
+                        selectAndSwap(swapSpec.swapStyle, target, elt, serverResponse, settleInfo, selectOverride);
 
                         if (selectionInfo.elt &&
                             !bodyContains(selectionInfo.elt) &&