htmx icon indicating copy to clipboard operation
htmx copied to clipboard

Change couple direct usages of querySelectorAll() to findAll()

Open devseppala opened this issue 1 year ago • 0 comments

What is the htmx internal policy on direct usage of querySelectorAll() versus using it through the internal findAll() function. I created an issue and proposal for supporting XPath selectors (https://github.com/devseppala/htmxpath), but as it has not received that much interest so far, so I thought if I could split one generic improvements of it into a separate issue.

So in this issue I would simply propose that oobSwap() and maybeSelectFromResponse() functions would be changed to use findAll() instead of directly calling querySelectorAll() . After all, what is the point of find() and findAll() functions if they are not systematically utilized.

@@ -801,25 +801,25 @@
         function oobSwap(oobValue, oobElement, settleInfo) {
             var selector = "#" + getRawAttribute(oobElement, "id");
             var swapStyle = "outerHTML";
             if (oobValue === "true") {
                 // do nothing
             } else if (oobValue.indexOf(":") > 0) {
                 swapStyle = oobValue.substr(0, oobValue.indexOf(":"));
                 selector  = oobValue.substr(oobValue.indexOf(":") + 1, oobValue.length);
             } else {
                 swapStyle = oobValue;
             }
 
-            var targets = getDocument().querySelectorAll(selector);
+            var targets = findAll(selector);
             if (targets) {
                 forEach(
                     targets,
                     function (target) {
                         var fragment;
                         var oobElementClone = oobElement.cloneNode(true);
                         fragment = getDocument().createDocumentFragment();
                         fragment.appendChild(oobElementClone);
                         if (!isInlineSwap(swapStyle, target)) {
                             fragment = oobElementClone; // if this is not an inline swap, we use the content of the node, not the node itself
                         }
 
@@ -1052,11 +1052,11 @@
 
         function maybeSelectFromResponse(elt, fragment, selectOverride) {
             var selector = selectOverride || getClosestAttributeValue(elt, "hx-select");
             if (selector) {
                 var newFragment = getDocument().createDocumentFragment();
-                forEach(fragment.querySelectorAll(selector), function (node) {
+                forEach(findAll(fragment, selector), function (node) {
                     newFragment.appendChild(node);
                 });
                 fragment = newFragment;
             }
             return fragment;


devseppala avatar Feb 18 '24 22:02 devseppala