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

WCAG 2.2: Fix focus isn't moved to certain screens when opened (e.g. focus is lost after opening the note history screen). #11648

Open
3 tasks done
pedr opened this issue Jan 14, 2025 · 6 comments
Labels
accessibility Related to accessibility

Comments

@pedr
Copy link
Collaborator

pedr commented Jan 14, 2025

In the Note revision/history screen, it seems to be broken (focus seems to go back to notebook list selector).

In the following pages it seems like the focus is on the new screen, but I had to use Up/Down so orca had the chance to read the content, which I'm not sure if it is the right behaviour or not (do you have an opinion @personalizedrefrigerator ?):

  • Joplin Cloud Sycnh
  • Dropbox Synch
  • OneDrive Synch
@personalizedrefrigerator personalizedrefrigerator changed the title [❗] Fix focus isn't moved to certain screens when opened (e.g. focus is lost after opening the note history screen). See . WCAG 2.2: Fix focus isn't moved to certain screens when opened (e.g. focus is lost after opening the note history screen). See . Jan 14, 2025
@personalizedrefrigerator
Copy link
Collaborator

personalizedrefrigerator commented Jan 14, 2025

Note: This issue was originally added in part due to this part of F85:

Example 2: Setting focus to the document after dismissing a menu embedded on the page

When a menu is dismissed, it is removed or hidden from the web page and focus is set to the document. The user must tab from the beginning of the navigation sequence to reach the point from which the menu was opened.

However, the note history screen isn't a menu (it's a separate screen), so changing how focus is managed might not be necessary here. Edit: Checking again, the note history page isn't a separate screen — it's displayed as part of the editor.

@personalizedrefrigerator
Copy link
Collaborator

In the Note revision/history screen, it seems to be broken (focus seems to go back to notebook list selector).

Good catch! The note history screen does seem to be broken. The focus seems to jump to the first item in the document.

In the following pages it seems like the focus is on the new screen, but I had to use Up/Down so orca had the chance to read the content, which I'm not sure if it is the right behaviour or not (do you have an opinion @personalizedrefrigerator ?):

Ideally orca would provide some information about the new page. If <h1>/<h2>/etc aren't present on these pages, adding them might help with this.

@personalizedrefrigerator personalizedrefrigerator changed the title WCAG 2.2: Fix focus isn't moved to certain screens when opened (e.g. focus is lost after opening the note history screen). See . WCAG 2.2: Fix focus isn't moved to certain screens when opened (e.g. focus is lost after opening the note history screen). Jan 15, 2025
@personalizedrefrigerator personalizedrefrigerator added the accessibility Related to accessibility label Jan 15, 2025
@pedr
Copy link
Collaborator Author

pedr commented Jan 15, 2025

Thanks for the help, I will create a PR for these changes.

@pedr
Copy link
Collaborator Author

pedr commented Jan 15, 2025

I could not find a way to prevent focus going to start of the document when the revision is rendered. I'm letting this issue open for now.

@personalizedrefrigerator
Copy link
Collaborator

personalizedrefrigerator commented Jan 15, 2025

I could not find a way to prevent focus going to start of the document when the revision is rendered. I'm letting this issue open for now.

One option might be to show the revision viewer in a <Dialog> component, rather than by replacing the note editor. The Dialog component internally uses a <dialog>, which should handle autofocus and restoring focus when the dialog is closed.

@pedr
Copy link
Collaborator Author

pedr commented Jan 16, 2025

One option might be to show the revision viewer in a <Dialog> component, rather than by replacing the note editor. The Dialog component internally uses a <dialog>, which should handle autofocus and restoring focus when the dialog is closed.

Good idea, I'm going to do this. Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
accessibility Related to accessibility
Projects
None yet
Development

No branches or pull requests

2 participants