Skip to content

Focus escapes modal when first or last element has style display: none #732

Closed
@pzhine

Description

@pzhine

Summary:

The 3.8.1 release of react-modal allows the focus to escape when the first or last tabbable element has style display: none

Steps to reproduce:

  1. Open a react-modal with a few tabbable elements where the first or last tabbable element style set to display: none.
  2. Press tab or shift-tab a few times.
  3. When it gets to the first/last tabbable item, the tab or shift-tab event moves the focus outside the modal.

Expected behavior:

The tab and shift-tab events never move the focus outside the modal

Link to example of issue:

https://codesandbox.io/s/4x2nlqq599

Activity

added this to the 4.0 milestone on Feb 14, 2019
flurmbo

flurmbo commented on Oct 2, 2019

@flurmbo
Contributor

Hi @diasbruno, is it okay if I give a go at this issue?

diasbruno

diasbruno commented on Oct 2, 2019

@diasbruno
Collaborator

Sure, @flurmbo. Contributions are always welcome. Let me know if you need anything.

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

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

      Participants

      @diasbruno@pzhine@flurmbo

      Issue actions

        Focus escapes modal when first or last element has style `display: none` · Issue #732 · reactjs/react-modal