dequelabs / dequelabs/axe-core

Modal IGT flags 3 false positives on native dialog

Open
#4,310 5 comments 0 reactions 0 assignees View on GitHub
extension
Dominant language
JavaScript
Stars
7.5k
Forks
933
Avg merge
2d 23h
Merged PRs (30d)
17

Description

### Product

axe Extension

### Product Version

v4.73.1

### Latest Version

- [X] I have tested the issue with the latest version of the product

### Issue Description

#### Expectation
No issues reported

#### Actual
The Modal Dialog IGT on a native reports 3 issues:

1. Dialog / Alert Dialog: Dialog is missing appropriate role and/or attributes
2. Able to browse outside modal with screen reader
3. Keyboard focus is not maintained in modal

#### How to Reproduce
Sample page can be found at https://ch3pyf.csb.app/, or try the code below.

```html

Lets try a native dialog


Show dialog


Hello Dialog



Close dialog


const invoker = document.querySelector("#invoker");
const dialog = document.querySelector("#dialog");

invoker.addEventListener("click", () => {
dialog.showModal();
});

```

I believe, in this setup, the dialog is not missing appropriate role or attributes, these are supplied natively.

And the other two issues are also not valid in my opinion, as the user is still correctly blocked from interacting with the _webpage_. With this native implementation the user is able to "escape" to the browser controls, this is a feature of the native dialog and an improvement on the old solutions where the user was completely held hostage by the dialog and cannot interact with their computer until they deal with the dialog.

#### Additional context
When used in an iframe context, the native dialog does seem to only block interaction with that iframe and not the rest of the webpage. This means, that when a native modal dialog appears in an embedded iframe you can "escape" to the surrounding page by keyboard, however, you can also interact with the surrounding page by mouse. So this probably still shouldn't be considered an issue.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.