Community help? Known non-functioning shadow dom elements/events?

[BMCwebdev]

Hoping I can poll the community here.

So we know that there are some aspects of RAC that will not work in a shadow tree. One of them is the onPress prop. However you can use onPressEnd which is closer to onClick.

If anyone has any experience with other known issues when using RAC in a shadow tree it would be very helpful. We have built our design system component library on RAC, and have a team that are prototyping a project using a shadow dom. It would be really helpful if we went into it knowing more about what we might run up against.

Thank you everyone.

[devongovett]

One of them is the onPress prop. However you can use onPressEnd which is closer to onClick.

Both of these are fired during the native onClick so they should be the same? Curious what difference you're seeing there. We do have tests for press events in shadow roots:

react-spectrum/packages/@react-aria/interactions/test/usePress.test.js

Line 3911 in 8573562

describe('usePress with Shadow DOM', function () {

There are certainly other issues. It's not officially supported everywhere, but there have been some contributions to improve it in various areas. It's sort of in a "try it and see if it works" state.

[snowystinger]

Would be good to capture and consolidate in #7687 as well

[BMCwebdev]

I can test again, but what I was finding was when using a Button component, the onPress event produced no effect. I did not dig deep, so I could find out more, such as did the event even begin, was it a bubbling issue, etc. Ill update.

Thanks for the response, and all the work you both do. I'm very happy I chose React Aria Components for our design system!