switch to a white list for attribute swizzling

fixes https://github.com/bigskysoftware/htmx/issues/195
This commit is contained in:
carson 2020-09-14 07:28:41 -06:00
parent b657c0ad41
commit 4b4a480f9c
2 changed files with 12 additions and 11 deletions

View File

@ -41,6 +41,7 @@ return (function () {
requestClass:'htmx-request',
settlingClass:'htmx-settling',
swappingClass:'htmx-swapping',
attributesToSwizzle:["class", "style", "width", "height"]
},
parseInterval:parseInterval,
_:internalEval,
@ -380,8 +381,13 @@ return (function () {
}
function shouldSwizzleAttribute(name) {
return !(name === "id" || name === "value" || name.indexOf("@") >= 0);
var attributesToSwizzle = htmx.config.attributesToSwizzle;
for (var i = 0; i < attributesToSwizzle.length; i++) {
if (name === attributesToSwizzle[i]) {
return true;
}
}
return false;
}
function cloneAttributes(mergeTo, mergeFrom) {
@ -392,12 +398,7 @@ return (function () {
});
forEach(mergeFrom.attributes, function (attr) {
if (shouldSwizzleAttribute(attr.name)) {
try {
mergeTo.setAttribute(attr.name, attr.value);
} catch (e) {
// log bad attributes, should be added to the shouldSwizzleAttribute function when reported
logError("Could not set attribute with name '" + attr.name + "'");
}
mergeTo.setAttribute(attr.name, attr.value);
}
});
}

View File

@ -353,13 +353,13 @@ describe("Core htmx AJAX Tests", function(){
it('properly settles attributes on interior elements', function(done)
{
this.server.respondWith("GET", "/test", "<div hx-get='/test'><div foo='bar' id='d1'></div></div>");
this.server.respondWith("GET", "/test", "<div hx-get='/test'><div width='bar' id='d1'></div></div>");
var div = make("<div hx-get='/test' hx-swap='outerHTML settle:10ms'><div id='d1'></div></div>");
div.click();
this.server.respond();
should.equal(byId("d1").getAttribute("foo"), null);
should.equal(byId("d1").getAttribute("width"), null);
setTimeout(function () {
should.equal(byId("d1").getAttribute("foo"), "bar");
should.equal(byId("d1").getAttribute("width"), "bar");
done();
}, 20);
});