Skip to content

Auto focus of expand panel UI causes page jump #1720

Description

@LlGC-jop

UV version:

 universalviewer@4.x

I'm submitting a:

  • bug report => please fork one of these codesandbox examples with a repro of your issue and include a link to it below
  • feature request => please use the user stories repo
  • support request => Please do not submit support requests here, use stackoverflow

Current behavior:

When an embedded viewer loads the page 'jumps' down to it. This can be see here:

https://www.library.wales/discover-learn/education/learning-resources/thomas-picton-a-historical-enquiry

where the page will jump to one of the 3 viewers, somewhat randomly, after they've loaded.

The cause seems to be automatic focus of the left panel's open/close button. Because all viewers load at the same time, but with inconsistent finishes, which of the 3 buttons gets focus is random-ish.

Expected behavior:

Page should load and not jump.

Steps to reproduce:

https://www.library.wales/discover-learn/education/learning-resources/thomas-picton-a-historical-enquiry

or

Create a test page with either normal or embedded viewer, making sure that the page's content is long enough that the viewer is below the fold. Either left or right panel should be set to open by default e.g.

"moreInfoRightPanel": {
  "options": {
    "panelOpen": true
  }
},
"contentLeftPanel": {
  "options": {
    "panelOpen": true
  }
},

Related code:

// insert any relevant code here

Other information:

I think it's the focus() that happens after a panel is opened which causes this.

A simple fix would be to use the allowStealFocus config option to determine whether to do this or not, as it seems to match its intent. The code already includes a flag to say whether the toggle of the panel is automatic or not which would allow exclusion of non-auto focuses.

I'll add this and raise a PR for it, but as it's a potential accessibility issue we may want to have a community chat about it and decide whether a new config is needed so that existing configs aren't affected if UV is updated.

Metadata

Metadata

Assignees

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions