Fix stale form references (#1820)

* 🐛 ensures form reference is accurate

*  Adds test

* 🐛 Fixes null checks

* Revert www updates

This reverts commit d2d14056e2635688fdcb0e6abe572034f77c0bef.

* Revert www updates

This reverts commit 3de585e02997a7877f47ef84f6c2f1a5fcc91ac3.

* ♻️ Refactors code

*  Passes tests
This commit is contained in:
Eric Kwoka 2023-11-01 02:32:58 +04:00 committed by GitHub
parent 225d8d8cac
commit bdcb040a2f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 54 additions and 20 deletions

View File

@ -1912,32 +1912,39 @@ return (function () {
}
}
function initButtonTracking(elt) {
// Handle submit buttons/inputs that have the form attribute set
// see https://developer.mozilla.org/docs/Web/HTML/Element/button
var form = resolveTarget("#" + getRawAttribute(elt, "form")) || closest(elt, "form")
if (!form) {
return
// Handle submit buttons/inputs that have the form attribute set
// see https://developer.mozilla.org/docs/Web/HTML/Element/button
function maybeSetLastButtonClicked(evt) {
var elt = closest(evt.target, "button, input[type='submit']");
var internalData = getRelatedFormData(evt)
if (internalData) {
internalData.lastButtonClicked = elt;
}
var maybeSetLastButtonClicked = function (evt) {
var elt = closest(evt.target, "button, input[type='submit']");
if (elt !== null) {
var internalData = getInternalData(form);
internalData.lastButtonClicked = elt;
}
};
};
function maybeUnsetLastButtonClicked(evt){
var internalData = getRelatedFormData(evt)
if (internalData) {
internalData.lastButtonClicked = null;
}
}
function getRelatedFormData(evt) {
var elt = closest(evt.target, "button, input[type='submit']");
if (!elt) {
return;
}
var form = resolveTarget('#' + getRawAttribute(elt, 'form')) || closest(elt, 'form');
if (!form) {
return;
}
return getInternalData(form);
}
function initButtonTracking(elt) {
// need to handle both click and focus in:
// focusin - in case someone tabs in to a button and hits the space bar
// click - on OSX buttons do not focus on click see https://bugs.webkit.org/show_bug.cgi?id=13724
elt.addEventListener('click', maybeSetLastButtonClicked)
elt.addEventListener('focusin', maybeSetLastButtonClicked)
elt.addEventListener('focusout', function(evt){
var internalData = getInternalData(form);
internalData.lastButtonClicked = null;
})
elt.addEventListener('focusout', maybeUnsetLastButtonClicked)
}
function countCurlies(line) {

View File

@ -1284,5 +1284,32 @@ describe("Core htmx AJAX Tests", function(){
byId("submit").click();
this.server.respond();
responded.should.equal(true);
it("can associate submit buttons from outside a form with the current version of the form after swap", function(){
const template = '<form ' +
'id="hello" ' +
'hx-target="#hello" ' +
'hx-select="#hello" ' +
'hx-swap="outerHTML" ' +
'hx-post="/test">\n' +
'<input id="input" type="text" name="name" />\n' +
'<button name="value" type="submit">Submit</button>\n' +
'</form>\n' +
'<button id="outside" name="outside" form="hello" type="submit">Outside</button>';
var values
this.server.respondWith("/test", function (xhr) {
values = getParameters(xhr);
xhr.respond(200, {}, template);
});
make(template);
const button = byId("outside");
button.focus();
button.click();
this.server.respond();
values.should.deep.equal({name: "", outside: ""});
button.focus();
button.click();
this.server.respond();
values.should.deep.equal({name: "", outside: ""});
})
})