Merge branch 'dev' into error-swapping

CHANGELOG.md

@@ -1,6 +1,19 @@
 # Changelog
 
-## [1.9.6] - ???
+## [1.9.6] - 2023-09-22
+
+* IE support has been restored (thank you @telroshan!)
+* Introduced the `hx-disabled-elt` attribute to allow specifing elements to disable during a request
+* You can now explicitly decide to ignore `title` tags found in new content via the `ignoreTitle` option in `hx-swap` and the `htmx.config.ignoreTitle` configuration variable.
+* `hx-swap` modifiers may be used without explicitly specifying the swap mechanism
+* Arrays are now supported in the `client-side-templates` extension
+* XSLT support in the `client-side-templates` extension
+* Support `preventDefault()` in extension event handling
+* Allow the `HX-Refresh` header to apply even after an `HX-Redirect` has occurred
+* the `formaction` and `formmethod` attributes on buttons are now properly respected
+* `hx-on` can now handle events with dots in their name
+* `htmx.ajax()` now always returns a Promise
+* Handle leading `style` tag parsing more effectively
 
 ## [1.9.5] - 2023-08-25
 

dist/ext/client-side-templates.js

@@ -13,13 +13,32 @@ htmx.defineExtension('client-side-templates', {
             }
         }
 
+        var mustacheArrayTemplate = htmx.closest(elt, "[mustache-array-template]");
+        if (mustacheArrayTemplate) {
+            var data = JSON.parse(text);
+            var templateId = mustacheArrayTemplate.getAttribute('mustache-array-template');
+            var template = htmx.find("#" + templateId);
+            if (template) {
+                return Mustache.render(template.innerHTML, {"data": data });
+            } else {
+                throw "Unknown mustache template: " + templateId;
+            }
+        }
+
         var handlebarsTemplate = htmx.closest(elt, "[handlebars-template]");
         if (handlebarsTemplate) {
             var data = JSON.parse(text);
             var templateName = handlebarsTemplate.getAttribute('handlebars-template');
             return Handlebars.partials[templateName](data);
         }
 
+        var handlebarsArrayTemplate = htmx.closest(elt, "[handlebars-array-template]");
+        if (handlebarsArrayTemplate) {
+            var data = JSON.parse(text);
+            var templateName = handlebarsArrayTemplate.getAttribute('handlebars-array-template');
+            return Handlebars.partials[templateName]({"data": data});
+        }
+
         var nunjucksTemplate = htmx.closest(elt, "[nunjucks-template]");
         if (nunjucksTemplate) {
             var data = JSON.parse(text);
@@ -30,8 +49,36 @@ htmx.defineExtension('client-side-templates', {
             } else {
                 return nunjucks.render(templateName, data);
             }
-          }
+        }
+
+        var xsltTemplate = htmx.closest(elt, "[xslt-template]");
+        if (xsltTemplate) {
+            var templateId = xsltTemplate.getAttribute('xslt-template');
+            var template = htmx.find("#" + templateId);
+            if (template) {
+              var content = template.innerHTML ? new DOMParser().parseFromString(template.innerHTML, 'application/xml')
+                                               : template.contentDocument;
+              var processor = new XSLTProcessor();
+              processor.importStylesheet(content);
+              var data = new DOMParser().parseFromString(text, "application/xml");
+              var frag = processor.transformToFragment(data, document);
+              return new XMLSerializer().serializeToString(frag);
+            } else {
+              throw "Unknown XSLT template: " + templateId;
+            }
+        }
 
+          var nunjucksArrayTemplate = htmx.closest(elt, "[nunjucks-array-template]");
+          if (nunjucksArrayTemplate) {
+              var data = JSON.parse(text);
+              var templateName = nunjucksArrayTemplate.getAttribute('nunjucks-array-template');
+              var template = htmx.find('#' + templateName);
+              if (template) {
+                  return nunjucks.renderString(template.innerHTML, {"data": data});
+              } else {
+                  return nunjucks.render(templateName, {"data": data});
+              }
+            }
         return text;
     }
 });

dist/ext/disable-element.js

@@ -5,12 +5,14 @@ htmx.defineExtension('disable-element', {
     onEvent: function (name, evt) {
         let elt = evt.detail.elt;
         let target = elt.getAttribute("hx-disable-element");
-        let targetElement = (target == "self") ? elt : document.querySelector(target);
+        let targetElements = (target == "self") ? [ elt ] : document.querySelectorAll(target);
 
-        if (name === "htmx:beforeRequest" && targetElement) {
-            targetElement.disabled = true;
-        } else if (name == "htmx:afterRequest" && targetElement) {
-            targetElement.disabled = false;
+        for (var i = 0; i < targetElements.length; i++) {
+            if (name === "htmx:beforeRequest" && targetElements[i]) {
+                targetElements[i].disabled = true;
+            } else if (name == "htmx:afterRequest" && targetElements[i]) {
+                targetElements[i].disabled = false;
+            }
         }
     }
 });

dist/ext/loading-states.js

@@ -25,28 +25,28 @@
 		if (delayElt) {
 			const delayInMilliseconds =
 				delayElt.getAttribute('data-loading-delay') || 200
-			const timeout = setTimeout(() => {
+			const timeout = setTimeout(function () {
 				doCallback()
 
-				loadingStatesUndoQueue.push(() => {
-					mayProcessUndoCallback(targetElt, () => undoCallback())
+				loadingStatesUndoQueue.push(function () {
+					mayProcessUndoCallback(targetElt, undoCallback)
 				})
 			}, delayInMilliseconds)
 
-			loadingStatesUndoQueue.push(() => {
-				mayProcessUndoCallback(targetElt, () => clearTimeout(timeout))
+			loadingStatesUndoQueue.push(function () {
+				mayProcessUndoCallback(targetElt, function () { clearTimeout(timeout) })
 			})
 		} else {
 			doCallback()
-			loadingStatesUndoQueue.push(() => {
-				mayProcessUndoCallback(targetElt, () => undoCallback())
+			loadingStatesUndoQueue.push(function () {
+				mayProcessUndoCallback(targetElt, undoCallback)
 			})
 		}
 	}
 
 	function getLoadingStateElts(loadingScope, type, path) {
-		return Array.from(htmx.findAll(loadingScope, `[${type}]`)).filter(
-			(elt) => mayProcessLoadingStateByPath(elt, path)
+		return Array.from(htmx.findAll(loadingScope, "[" + type + "]")).filter(
+			function (elt) { return mayProcessLoadingStateByPath(elt, path) }
 		)
 	}
 
@@ -74,95 +74,99 @@
 
 				let loadingStateEltsByType = {}
 
-				loadingStateTypes.forEach((type) => {
+				loadingStateTypes.forEach(function (type) {
 					loadingStateEltsByType[type] = getLoadingStateElts(
 						container,
 						type,
 						evt.detail.pathInfo.requestPath
 					)
 				})
 
-				loadingStateEltsByType['data-loading'].forEach((sourceElt) => {
-					getLoadingTarget(sourceElt).forEach((targetElt) => {
+				loadingStateEltsByType['data-loading'].forEach(function (sourceElt) {
+					getLoadingTarget(sourceElt).forEach(function (targetElt) {
 						queueLoadingState(
 							sourceElt,
 							targetElt,
-							() =>
-								(targetElt.style.display =
+							function () {
+								targetElt.style.display =
 									sourceElt.getAttribute('data-loading') ||
-									'inline-block'),
-							() => (targetElt.style.display = 'none')
+									'inline-block' },
+							function () { targetElt.style.display = 'none' }
 						)
 					})
 				})
 
 				loadingStateEltsByType['data-loading-class'].forEach(
-					(sourceElt) => {
+					function (sourceElt) {
 						const classNames = sourceElt
 							.getAttribute('data-loading-class')
 							.split(' ')
 
-						getLoadingTarget(sourceElt).forEach((targetElt) => {
+						getLoadingTarget(sourceElt).forEach(function (targetElt) {
 							queueLoadingState(
 								sourceElt,
 								targetElt,
-								() =>
-									classNames.forEach((className) =>
-										targetElt.classList.add(className)
-									),
-								() =>
-									classNames.forEach((className) =>
-										targetElt.classList.remove(className)
-									)
+								function () {
+									classNames.forEach(function (className) {
+                                        targetElt.classList.add(className)
+                                    })
+                                },
+								function() {
+									classNames.forEach(function (className) {
+                                        targetElt.classList.remove(className)
+                                    })
+                                }
 							)
 						})
 					}
 				)
 
 				loadingStateEltsByType['data-loading-class-remove'].forEach(
-					(sourceElt) => {
+					function (sourceElt) {
 						const classNames = sourceElt
 							.getAttribute('data-loading-class-remove')
 							.split(' ')
 
-						getLoadingTarget(sourceElt).forEach((targetElt) => {
+						getLoadingTarget(sourceElt).forEach(function (targetElt) {
 							queueLoadingState(
 								sourceElt,
 								targetElt,
-								() =>
-									classNames.forEach((className) =>
-										targetElt.classList.remove(className)
-									),
-								() =>
-									classNames.forEach((className) =>
-										targetElt.classList.add(className)
-									)
+								function () {
+									classNames.forEach(function (className) {
+                                        targetElt.classList.remove(className)
+                                    })
+                                },
+								function() {
+									classNames.forEach(function (className) {
+                                        targetElt.classList.add(className)
+                                    })
+                                }
 							)
 						})
 					}
 				)
 
 				loadingStateEltsByType['data-loading-disable'].forEach(
-					(sourceElt) => {
-						getLoadingTarget(sourceElt).forEach((targetElt) => {
+					function (sourceElt) {
+						getLoadingTarget(sourceElt).forEach(function (targetElt) {
 							queueLoadingState(
 								sourceElt,
 								targetElt,
-								() => (targetElt.disabled = true),
-								() => (targetElt.disabled = false)
+								function() { targetElt.disabled = true },
+                                function() { targetElt.disabled = false }
 							)
 						})
 					}
 				)
 
 				loadingStateEltsByType['data-loading-aria-busy'].forEach(
-					(sourceElt) => {
-						getLoadingTarget(sourceElt).forEach((targetElt) => {
+					function (sourceElt) {
+						getLoadingTarget(sourceElt).forEach(function (targetElt) {
 							queueLoadingState(
 								sourceElt,
 								targetElt,
-								() => (targetElt.setAttribute("aria-busy", "true")),
-								() => (targetElt.removeAttribute("aria-busy"))
+								function () { targetElt.setAttribute("aria-busy", "true") },
+								function () { targetElt.removeAttribute("aria-busy") }
 							)
 						})
 					}

dist/ext/morphdom-swap.js

@@ -5,7 +5,8 @@ htmx.defineExtension('morphdom-swap', {
     handleSwap: function (swapStyle, target, fragment) {
         if (swapStyle === 'morphdom') {
             if (fragment.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {
-                morphdom(target, fragment.firstElementChild);
+                // IE11 doesn't support DocumentFragment.firstElementChild
+                morphdom(target, fragment.firstElementChild || fragment.firstChild);
                 return [target];
             } else {
                 morphdom(target, fragment.outerHTML);