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

clarified code example: removed unnecessary button type #38157

Merged
merged 1 commit into from
Feb 14, 2025

Conversation

teetotum
Copy link
Contributor

@teetotum teetotum commented Feb 14, 2025

The code example was misleading (Exhibit A: I was misled by it). How so:

  • The button type attribute is known to carry behavior w.r.t. its ancestor element (button.type=submit will submit a <form> etc. ; see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type )
  • The documentation page is all about closing a <dialog> and raising the cancel event.
  • The presence of a <button type="reset"> in the example suggests that the type attribute does actually contribute to the button behavior w.r.t. the <dialog>
  • but it does nothing, the closing of the dialog is only the result of a click listener attached via script
  • I might be oblivious to whether the original markup is considered best practice w.r.t. accessibility

Description

I removed the attribute type="reset" in the code example, as I think it is confusing, even misleading.

Motivation

I was misled by it. I want to spare others the same confusion in the interpretation of the code example.

Additional details

I consulted the documentation for button.type to understand whether I missed anything
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type

Related issues and pull requests

probably nothing related to it

The code example was misleading (Exhibit A: I was misled by it). How so:
- The button type attribute is known to carry behavior w.r.t. its ancestor element (button.type=submit will submit a <form> etc. ; see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type )
- The documentation page is all about closing a <dialog> and raising the cancel event.
- The presence of a <button type="reset"> in the example suggests that the type attribute does actually contribute to the button behavior w.r.t. the <dialog>
- but it does nothing, the closing of the dialog is only the result of a click listener attached via script
@teetotum teetotum requested a review from a team as a code owner February 14, 2025 11:56
@teetotum teetotum requested review from sideshowbarker and removed request for a team February 14, 2025 11:56
@github-actions github-actions bot added Content:WebAPI Web API docs size/xs [PR only] 0-5 LoC changed labels Feb 14, 2025
Copy link
Contributor

Copy link
Member

@Josh-Cena Josh-Cena left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice, thanks

@Josh-Cena Josh-Cena merged commit 9ba2221 into mdn:main Feb 14, 2025
7 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Content:WebAPI Web API docs size/xs [PR only] 0-5 LoC changed
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants