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

Move user_input_methods guide #30646

Merged
merged 9 commits into from
Dec 6, 2023
Merged

Move user_input_methods guide #30646

merged 9 commits into from
Dec 6, 2023

Conversation

estelle
Copy link
Member

@estelle estelle commented Nov 30, 2023

Move guide per openwebdocs/project#185
Update guide to remove prefixing, "not supported", and "modern web" lingo
Update text to encourage supporting all input types all the time for good UX.
updated links to page.

@estelle estelle requested a review from a team as a code owner November 30, 2023 04:22
@estelle estelle requested review from hamishwillee and removed request for a team November 30, 2023 04:22
@github-actions github-actions bot added Content:Guide Guide docs Content:Learn:Forms Learning area Forms docs labels Nov 30, 2023
@estelle estelle requested a review from teoli2003 November 30, 2023 04:22
Copy link
Contributor

github-actions bot commented Nov 30, 2023

Preview URLs

Flaws (1)

Note! 2 documents with no flaws that don't need to be listed. 🎉

URL: /en-US/docs/Learn/Forms/User_input_methods
Title: User input methods and controls
Flaw count: 1

  • broken_links:
    • Can't resolve /en-US/docs/Web/Accessibility/ARIA/Roles/

(comment last updated: 2023-12-06 16:32:43)

@github-actions github-actions bot added the merge conflicts 🚧 [PR only] label Nov 30, 2023
Copy link
Contributor

This pull request has merge conflicts that must be resolved before it can be merged.

Copy link
Contributor

@teoli2003 teoli2003 left a comment

Choose a reason for hiding this comment

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

Drive-by change proposal (I need to check if it fits the "module" structure of that Learn section; not an expert in LA so if @wbamberg or @chrisdavidmills can have a look too, it would be nice)

@teoli2003
Copy link
Contributor

Also, the broken link to orientationchange may be to: https://developer.mozilla.org/en-US/docs/Web/API/Screen/orientationchange_event.

But it is marked as deprecated and is marked only supported by Firefox for Android.

I think the modern standard way is to listen to the change event on ScreenOrientation: https://developer.mozilla.org/en-US/docs/Web/API/ScreenOrientation/change_event

Copy link
Contributor

@chrisdavidmills chrisdavidmills left a comment

Choose a reason for hiding this comment

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

I don't think this fits under forms and the learning area at all. Looking at the content, it doesn't mention forms; it is much more about events.

In which case, wouldn't https://developer.mozilla.org/en-US/docs/Web/Events be a better place to move it?

@estelle estelle closed this Nov 30, 2023
@estelle estelle reopened this Dec 1, 2023
@estelle
Copy link
Member Author

estelle commented Dec 1, 2023

i rewrote it to make it form related as we really, really need this information in the HTML section, and it fits best under forms.

Copy link
Contributor

@chrisdavidmills chrisdavidmills left a comment

Choose a reason for hiding this comment

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

@estelle thanks for the work in making this fit better into the form module. I have some suggestions on how the page can be further improved, but I think this is getting close.


In this article, we take a look at the different ways users interact with web content, and provides recommendations for managing user input, real-world examples, and links to further information for anyone needing more detailed information on the underlying technologies.

As you develop more complex and interactive forms or other user interactions, there are many HTML features and JavaScript APIs you may want to investigate, including making elements [content editable](/en-US/docs/Web/HTML/Global_attributes/contenteditable), supporting [touch events](/en-US/docs/Web/API/Touch_events), controlling the user's [pointer device](/en-US/docs/Web/API/Pointer_Lock_API), controlling the [screen's orientation](/en-US/docs/Web/API/CSS_Object_Model/Managing_screen_orientation), making the content [fullscreen](/en-US/docs/Web/API/Fullscreen_API), using [drag and drop](/en-US/docs/Web/API/HTML_Drag_and_Drop_API) for file uploads, and more.
Copy link
Contributor

Choose a reason for hiding this comment

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

This largely feels not relevant to form content and therefore comes off a bit weird. Suggestions include:

  • Maybe presenting it as a note, so it feels like more of an aside.
  • Removing the example of content editable, as that really isn't relevant to form elements
  • Removing pointer lock as an example, as that doesn't feel relevant to forms either
  • Talking about screen orientation and and fullscreen in the context of kiosk-style apps?

With at least some of those items done, I think it would work better. Let me know what you think.

Copy link
Member Author

Choose a reason for hiding this comment

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

Reworded it, and removed the links: made it more of an intro to the next section rather than a summary. keeping content editable because it is a necessary feature in creating custom form controls. dropped pointer lock.

Copy link
Contributor

Choose a reason for hiding this comment

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

Cool, this reads much better

@github-actions github-actions bot removed the merge conflicts 🚧 [PR only] label Dec 5, 2023
@estelle
Copy link
Member Author

estelle commented Dec 5, 2023

@teoli2003 @chrisdavidmills Thanks. Ready and needing a re-review from both of you.

@teoli2003 teoli2003 dismissed their stale review December 6, 2023 08:40

The article has been rewritten and Chris is doing the review.

Copy link
Contributor

@chrisdavidmills chrisdavidmills left a comment

Choose a reason for hiding this comment

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

@estelle more suggestions for you. This is looking much better now, thanks so much for your hard work on this. I have approved so that you can get it merged after dealing with my latest round.

@estelle estelle merged commit c62878f into mdn:main Dec 6, 2023
@estelle estelle deleted the inputcontrols branch January 9, 2024 03:49
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Content:Guide Guide docs Content:Learn:Forms Learning area Forms docs
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants