[Bugfix] Fix hx-trigger changed modifier along from clause (#1571)

Fix hx-trigger changed modifier along from clause #1565
This commit is contained in:
Vincent 2023-07-22 16:39:28 +02:00 committed by GitHub
parent a29403f4b7
commit 6d1adc853f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 76 additions and 5 deletions

View File

@ -1411,9 +1411,12 @@ return (function () {
} else {
eltsToListenOn = [elt];
}
// store the initial value of the element so we can tell if it changes
// store the initial values of the elements, so we can tell if they change
if (triggerSpec.changed) {
elementData.lastValue = elt.value;
eltsToListenOn.forEach(function (eltToListenOn) {
var eltToListenOnData = getInternalData(eltToListenOn);
eltToListenOnData.lastValue = eltToListenOn.value;
})
}
forEach(eltsToListenOn, function (eltToListenOn) {
var eventListener = function (evt) {
@ -1453,11 +1456,11 @@ return (function () {
}
}
if (triggerSpec.changed) {
if (elementData.lastValue === elt.value) {
var eltToListenOnData = getInternalData(eltToListenOn)
if (eltToListenOnData.lastValue === eltToListenOn.value) {
return;
} else {
elementData.lastValue = elt.value;
}
eltToListenOnData.lastValue = eltToListenOn.value
}
if (elementData.delayed) {
clearTimeout(elementData.delayed);

View File

@ -42,6 +42,74 @@ describe("hx-trigger attribute", function(){
div.innerHTML.should.equal("Requests: 1");
});
it('changed modifier works along from clause with single input', function()
{
var requests = 0;
this.server.respondWith("GET", "/test", function (xhr) {
requests++;
xhr.respond(200, {}, "Requests: " + requests);
});
var input = make('<input type="text"/>');
make('<div hx-trigger="click changed from:input" hx-target="#d1" hx-get="/test"></div>')
var div = make('<div id="d1"></div>');
input.click();
this.server.respond();
div.innerHTML.should.equal("");
input.click();
this.server.respond();
div.innerHTML.should.equal("");
input.value = "bar";
input.click();
this.server.respond();
div.innerHTML.should.equal("Requests: 1");
input.click();
this.server.respond();
div.innerHTML.should.equal("Requests: 1");
});
it('changed modifier works along from clause with two inputs', function()
{
var requests = 0;
this.server.respondWith("GET", "/test", function (xhr) {
requests++;
xhr.respond(200, {}, "Requests: " + requests);
});
var input1 = make('<input type="text"/>');
var input2 = make('<input type="text"/>');
make('<div hx-trigger="click changed from:input" hx-target="#d1" hx-get="/test"></div>')
var div = make('<div id="d1"></div>');
input1.click();
this.server.respond();
div.innerHTML.should.equal("");
input2.click();
this.server.respond();
div.innerHTML.should.equal("");
input1.value = "bar";
input2.click();
this.server.respond();
div.innerHTML.should.equal("");
input1.click();
this.server.respond();
div.innerHTML.should.equal("Requests: 1");
input1.click();
this.server.respond();
div.innerHTML.should.equal("Requests: 1");
input2.click();
this.server.respond();
div.innerHTML.should.equal("Requests: 1");
input2.value = "foo";
input1.click();
this.server.respond();
div.innerHTML.should.equal("Requests: 1");
input2.click();
this.server.respond();
div.innerHTML.should.equal("Requests: 2");
});
it('once modifier works', function()
{
var requests = 0;