Skip to content

WCAG: Focus position is not maintained with dynamic actions on the page #11405

@ahukkanen

Description

@ahukkanen

Describe the bug

When I try to use the proposal page using keyboard navigation, the dynamic actions do not preserve the focus position, as can be seen from the video:

  1. After "liking" the proposal, the focus position goes back to the beginning of the page - it should stay where it was before the modal was opened
  2. After "disliking" the proposal, the experience is the same as with liking
  3. After supporting the proposal, the focus goes outside of the button that was selected before it was pressed
  4. After removing the support, the experience is the same as with support (although not visible in the video)
  5. After closing the share modal, the focus goes back to the beginning of the page
  6. After closing the report modal, the focus goes back to the beginning of the page

To Reproduce

  1. Go to proposals (with supports enabled)
  2. Try navigating the page with keyboard navigation
  3. Try the different dynamic actions on the page (like, dislike, support, follow, share, report) and see that focus position is not correctly maintained currently

Expected behavior

I would expect the focus position to be maintained after the dynamic action is completed.

Screenshots

Here I am trying to show how the page functions currently with the weird focus positions:

decidim-focus-position.mp4

Stacktrace

No response

Extra data

  • Device: computer
  • Device OS: Ubuntu 22.04
  • Browser: Chrome 115.0.5790.98
  • Decidim Version: 0.28.0.dev
  • Decidim installation: local development app

Additional context

No response

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions