Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Enforce no-op on submit buttons with formmethod=dialog. #3075

Merged
merged 4 commits into from
Jan 9, 2025

Conversation

geoffrey-eisenbarth
Copy link
Contributor

Description

In Oct 2023, PR #1867 introduced a possible antipattern:

<dialog> 
  <form hx-post=/endpoint>
    <button formmethod=dialog>Submit and close</button>
  </form>
</dialog>

As a result of the above PR, current behavior is that clicking the button closes the dialog and submits the form (via hx-post). This is contrary to MDN docs on formmethod=dialog.

The author of that PR has since supported changing the behavior he introduced.

IMO people wishing to close a dialog and submit a form via HTMX at the same time should use e.g. hx-on:htmx:after-swap="event.target.closest('dialog').close().

There is a bit more conversation at PR #2753, which was my first attempt at this (PR was deleted because I couldn't git gud). Carson has approved this approach.

Corresponding issue: #1866

Testing

I have remove two tests and implemented one that I believe fits this situation, but I would appreciate it if someone could carefully review my test since I'm 100% on how the testing internals work.

Checklist

  • I have read the contribution guidelines
  • I have targeted this PR against the correct branch (master for website changes, dev for
    source changes)
  • This is either a bugfix, a documentation update, or a new feature that has been explicitly
    approved via an issue
  • I ran the test suite locally (npm run test) and verified that it succeeded

@Telroshan Telroshan added the bug Something isn't working label Dec 13, 2024
geoffrey-eisenbarth and others added 3 commits January 9, 2025 12:55
* Properly resolve referenced forms.

* Clarify variable.

* Cast elt to avoid TS exceptions.

* Refactor for JSDoc.

* Clarify shouldCancel.

* Remove complicated JSDoc in favor of ts-ignore.

* More coverage for button scenarios.

* Use properties instead of matching.

* Mention reset button change.
@1cg 1cg merged commit 9fcb5c5 into bigskysoftware:dev Jan 9, 2025
1 check passed
@geoffrey-eisenbarth geoffrey-eisenbarth deleted the enforce-buttonverbs branch January 10, 2025 01:49
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants