kendo-vue icon indicating copy to clipboard operation
kendo-vue copied to clipboard

The Dialog allows the users to tab outside it

Open PekoPPT opened this issue 2 years ago • 1 comments

Describe the bug By default, the Dialog component is a modal window. This means that once the Dialog appears, the page elements are the only ones the users can interact with.

Currently, if you use the keyboard navigation functionality of the Dialog, after pressing the Tab key multiple time, the focus will be on the "Open dialog" button below the modal. This should not happen.

To Reproduce

  1. Open this StackBlitz example
  2. Click on the "Open in new window" button to open the example in a separate window/tab
  3. In the new window, click on the "Open dialog" button
  4. Once the Dialog is opened, press the Tab button 8 times and press Enter
  5. The Dialog will be closed because, after the 8th Enter press, the focus will be again on the "Open dialog" button below the modal area.

Expected behavior When using the keyboard navigation of the Dialog component, the focus shouldn't be transferred to the elements below the modal area. It should be kept among the elements that are displayed in the Dialog.

PekoPPT avatar Aug 03 '22 09:08 PekoPPT