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

Clicking primary modal button shifts focus out of modal before modal closes #6579

Closed
nwhittaker opened this issue Mar 8, 2023 · 4 comments
Closed

Clicking primary modal button shifts focus out of modal before modal closes #6579

nwhittaker opened this issue Mar 8, 2023 · 4 comments
Assignees
@geospatialem
Labels
4 - verified Issues that have been released and confirmed resolved. ArcGIS Field Apps Issues logged by ArcGIS Field Apps team members. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. estimate - 2 Small fix or update, may require updates to tests. impact - p2 - want for an upcoming milestone User set priority impact status of p2 - want for an upcoming milestone p - high Issue should be addressed in the current milestone, impacts component or core functionality
Milestone
2023 May Priorities

Comments

@nwhittaker
Copy link
Contributor

nwhittaker commented Mar 8, 2023 •
edited
Loading

Actual Behavior

Whatever element had focus when opening a modal immediately regains focus when clicking the modal's primary button -- even if clicking the primary button does not immediately close the modal.

Expected Behavior

Whatever element had focus when opening a modal regains focus only after the modal is done closing.

Reproduction Sample

https://codepen.io/nwhittaker-esri/pen/dyqVxyy

Reproduction Steps

  1. Visit the sample and click the Open modal button.
  2. Use the mouse to click the Save button.
  3. Notice focus has moved back to the Open modal button behind the modal.

Reproduction Version

1.0.8

Relevant Info

No response

Regression?

No response

Priority impact

p2 - want for current milestone

Impact

The Field Maps web app has several modals that defer closing themselves until some asynchronous operation is finished (e.g. saving or duplicating a map). To prevent the user from triggering other operations, focus should remain trapped in the modal until it's closed.

In cases where the primary button does not immediately close the modal, this bug effectively allows keyboard navigation to prematurely escape the modal's focus trap.

Esri team

ArcGIS Field Apps
@nwhittaker nwhittaker added bug Bug reports for broken functionality. Issues should include a reproduction of the bug. 0 - new New issues that need assignment. needs triage Planning workflow - pending design/dev review. labels Mar 8, 2023
@github-actions github-actions bot added impact - p2 - want for an upcoming milestone User set priority impact status of p2 - want for an upcoming milestone ArcGIS Field Apps Issues logged by ArcGIS Field Apps team members. labels Mar 8, 2023
@geospatialem geospatialem added p - high Issue should be addressed in the current milestone, impacts component or core functionality estimate - 2 Small fix or update, may require updates to tests. labels May 2, 2023
@geospatialem geospatialem added this to the 2023 May Priorities milestone May 2, 2023
@geospatialem geospatialem removed the needs triage Planning workflow - pending design/dev review. label May 2, 2023
@driskull
Copy link
Member

I think this may be an issue with the FocusTrap and shadowDOM.

  • If you try with a native button instead of a calcite-button everything works fine.
  • If you click on the edge of the calcite-button (not on the text) then everything works fine.

I think that when clicking on the text portion of the calcite-button the focus-trap thinks the click is outside of the modal and therefore deactivates the focus trap.

driskull added a commit that referenced this issue May 11, 2023
@driskull
fix(modal): fix focusing out of modal when elements inside modal are …
8b76d8d 
…clicked. #6579
@driskull driskull mentioned this issue May 11, 2023
Closed
@driskull driskull self-assigned this May 11, 2023
@driskull driskull added 2 - in development Issues that are actively being worked on. and removed 0 - new New issues that need assignment. labels May 11, 2023
@driskull
Copy link
Member

Created issue for focus-trap. focus-trap/focus-trap#959

@driskull driskull mentioned this issue May 17, 2023
Merged
driskull added a commit that referenced this issue May 17, 2023
@driskull
build(deps): Bump focus-trap from 7.4.1 to 7.4.2 (#6974)
314305e 
**Related Issue:** #6579

## Summary

Bump focus-trap from 7.4.1 to 7.4.2
@driskull driskull added 3 - installed Issues that have been merged to master branch and are ready for final confirmation. and removed 2 - in development Issues that are actively being worked on. labels May 17, 2023
@github-actions
Copy link
Contributor

Installed and assigned for verification.

@github-actions github-actions bot assigned geospatialem and unassigned driskull May 17, 2023
Elijbet pushed a commit that referenced this issue May 17, 2023
@driskull @Elijbet
build(deps): Bump focus-trap from 7.4.1 to 7.4.2 (#6974)
1c2efac 
**Related Issue:** #6579

## Summary

Bump focus-trap from 7.4.1 to 7.4.2
@geospatialem geospatialem added 4 - verified Issues that have been released and confirmed resolved. and removed 3 - installed Issues that have been merged to master branch and are ready for final confirmation. labels May 18, 2023
@geospatialem
Copy link
Member

Verified in 1.4.0-next.21 with the the latest focus-trap addition.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@geospatialem geospatialem

Labels
4 - verified Issues that have been released and confirmed resolved. ArcGIS Field Apps Issues logged by ArcGIS Field Apps team members. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. estimate - 2 Small fix or update, may require updates to tests. impact - p2 - want for an upcoming milestone User set priority impact status of p2 - want for an upcoming milestone p - high Issue should be addressed in the current milestone, impacts component or core functionality
Projects
None yet
Milestone
2023 May Priorities
Development

No branches or pull requests
3 participants
@nwhittaker @driskull @geospatialem