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.

Sign up for GitHub

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

Jump to bottom

Use <dialog> HTML element for semantic dialogs/modals and native controls #22275

Open
MadLittleMods opened this issue May 18, 2022 · 3 comments
Open

Use <dialog> HTML element for semantic dialogs/modals and native controls #22275

MadLittleMods opened this issue May 18, 2022 · 3 comments
Assignees
@t3chguy
Labels
A11y O-Frequent Affects or can be seen by most users regularly or impacts most users' first experience S-Tolerable Low/no impact on users T-Task Tasks for the team like planning

Comments

@MadLittleMods
Copy link
Contributor

MadLittleMods commented May 18, 2022 •
edited
Loading

Your use case

What would you like to do?

Use <dialog> HTML element for dialogs/modals

Why would you like to do it?

To use the most semantic HTML element and have expected dialog/modal controls for the platform.

Demo: https://googlechrome.github.io/dialog-polyfill/

Have you considered any alternatives?

No response

Additional context

Related:

  • dialog
  • modal
@andybalaam andybalaam added S-Minor Impairs non-critical functionality or suitable workarounds exist O-Frequent Affects or can be seen by most users regularly or impacts most users' first experience labels May 19, 2022
@t3chguy t3chguy added S-Tolerable Low/no impact on users T-Task Tasks for the team like planning and removed S-Minor Impairs non-critical functionality or suitable workarounds exist T-Enhancement labels May 19, 2022
@t3chguy
Copy link
Member

t3chguy commented May 19, 2022

Given that we already solve the a11y problem for dialogs, this is a task and not a visible enhancement

@t3chguy t3chguy mentioned this issue May 28, 2022
Open
@yevhenii-username
Copy link

yevhenii-username commented May 29, 2022 •
edited
Loading

Please take note that using react-focus-lock broke some behavior for iframe using.

Screen.Recording.2022-05-27.at.19.33.05.mov

Here is the issue for this case theKashey/react-focus-lock#104

How I solved it

matrix-org/matrix-react-sdk@master...LukashenkoYevhenii:master

@t3chguy t3chguy mentioned this issue Jun 6, 2022
Closed
@t3chguy t3chguy self-assigned this Jun 14, 2022
@t3chguy t3chguy mentioned this issue Jun 15, 2022
Closed
@t3chguy
Copy link
Member

t3chguy commented Jun 30, 2022

@LukashenkoYevhenii do you want to PR that change to develop?

@t3chguy t3chguy mentioned this issue Mar 19, 2024
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@t3chguy t3chguy

Labels
A11y O-Frequent Affects or can be seen by most users regularly or impacts most users' first experience S-Tolerable Low/no impact on users T-Task Tasks for the team like planning
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Rework ModalManager to use <dialog> matrix-org/matrix-react-sdk
4 participants
@andybalaam @MadLittleMods @t3chguy @yevhenii-username