mirror of
https://github.com/bigskysoftware/htmx.git
synced 2025-10-03 07:45:21 +00:00
86febd3efc
If an element is replaced by an extension in `handleSwap`, the events (`afterSwap.htmx` and `afterSettle.htmx`) were not received by the `onLoad` method of extensions defined on parents of the target, because theses extensions were retrieved after the replacement, and so it was not possible to get through the parents, the target not being in the dom anymore. This commits loads the extensions for the target and save them in `eventDetail` before doing the swap, so they are accessible in `triggerEvent`, and passed to `withExtensions` that use this list if passed (else load them). A new test is added that fails without the updates in `htmx.js`.
51 lines
1.7 KiB
JavaScript
51 lines
1.7 KiB
JavaScript
describe("default extensions behavior", function() {
|
|
|
|
var loadCalls, afterSwapCalls, afterSettleCalls;
|
|
|
|
beforeEach(function () {
|
|
loadCalls = afterSwapCalls = afterSettleCalls = 0;
|
|
this.server = makeServer();
|
|
clearWorkArea();
|
|
|
|
htmx.defineExtension("ext-testswap", {
|
|
onEvent : function(name, evt) {
|
|
if (name === "load.htmx") {
|
|
loadCalls++;
|
|
}
|
|
if (name === "afterSwap.htmx") {
|
|
afterSwapCalls++;
|
|
}
|
|
if (name === "afterSettle.htmx") {
|
|
afterSettleCalls++;
|
|
}
|
|
},
|
|
handleSwap: function (swapStyle, target, fragment, settleInfo) {
|
|
// simple outerHTML replacement for tests
|
|
var parentEl = target.parentElement;
|
|
parentEl.removeChild(target);
|
|
parentEl.appendChild(fragment)
|
|
return true;
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
afterEach(function () {
|
|
this.server.restore();
|
|
clearWorkArea();
|
|
htmx.removeExtension("ext-testswap");
|
|
});
|
|
|
|
it('handleSwap: afterSwap and afterSettle triggered if extension defined on parent', function () {
|
|
this.server.respondWith("GET", "/test", '<button>Clicked!</button>');
|
|
var div = make('<div hx-ext="ext-testswap"><button hx-get="/test" hx-swap="testswap">Click Me!</button></div>');
|
|
var btn = div.firstChild;
|
|
btn.click()
|
|
this.server.respond();
|
|
afterSwapCalls.should.equal(1);
|
|
afterSettleCalls.should.equal(1);
|
|
loadCalls.should.equal(0); // load.htmlx event on new added button is not triggered
|
|
});
|
|
});
|