Modal setting inert attributes blocks 1password browser plugin

[andree-parakey]

Provide a general summary of the issue here

Opening a React-Aria modal sets attribute inert on all elements outside the modal. I understand why this is a good thing from an accessibility point of view. However, I have a login form inside a modal and I've noticed that it makes me unable to use the 1password browser plugin which embeds a button inside the input field since it also has the inert attribute applied.

🤔 Expected Behavior?

We want to be able to use the 1password browser plugin inside a modal. We should be able to have the attribute not be applied.

😯 Current Behavior

The button from the plugin is visible but I'm not able to interact with it.

💁 Possible Solution

Two possible solutions:

1. Exclude this particular plugin from having the attribute applied
2. Give us a way to manually have elements excluded, preferably by entering a queryselector.

🔦 Context

I have sent a similar request to 1password support.

🖥️ Steps to Reproduce

1. Install the 1password browser plugin
2. Setup modal with email or password input fields
3. Attempt to use the plugin to enter login data to fields

Version

react-aria ^3.44.0

What browsers are you seeing the problem on?

Firefox, Chrome

If other, please specify.

No response

What operating system are you using?

MacOS

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

[snowystinger]

Thanks for the issue, we have some work going on here: #8796
This is a duplicate of #8952 mentioned here #8952 (comment)