bigskysoftware / bigskysoftware/htmx
Change couple direct usages of querySelectorAll() to findAll()
- Dominant language
- JavaScript
- Stars
- 49.4k
- Forks
- 1.7k
- Avg merge
- 3d 22h
- Merged PRs (30d)
- 30
Description
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.
```patch
@@ -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;
```
Contributor guide
Assessment
This issue has not been assessed yet.