focusableElements selectors list doesn't include the new <permission /> element

[gabrielchl]

Provide a general summary of the issue here

the focusableElements selectors list (https://github.com/adobe/react-spectrum/blob/2e9061df69eb17f17b0fb7d64d318c2835aed145/packages/%40react-aria/utils/src/isFocusable.ts) doesn't include the new element (https://github.com/WICG/PEPC/blob/main/explainer.md)

this is a new element introduced in Chrome, which acts as a button, and has role: button in the accessibility tree

🤔 Expected Behavior?

the permission element should be part of that list so that usages of <FocusScope /> and more would work with the new element

😯 Current Behavior

it ain't part of the list, so when using <FocusScope /> it skips over the element

💁 Possible Solution

add to list

🔦 Context

No response

🖥️ Steps to Reproduce

https://codesandbox.io/p/sandbox/strange-monad-2zyz2p must be on chrome, with the "Page embedded permission control (permission element)" flag enabled in chrome://flags

Version

3.30.0

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

Mac

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

[gabrielchl]

note that it appears that .focus() doesn't currently work on the element (https://github.com/WICG/PEPC/issues/50), but when it does, this change will need to be made for it to work with react-aria

[cuteshaun]

Thanks for raising this, also tracking PEPC spec, and would love to see this supported when .focus() is added

[gabrielchl]

update: the upstream issue has been fixed, and released in chrome beta