material-ui icon indicating copy to clipboard operation
material-ui copied to clipboard

`Select` Keyboard Navigation Broken in Shadow DOM

Open MartinJaskullaTS opened this issue 1 year ago • 3 comments

The problem in depth

When using <Select> inside Shadow DOM:

  • Arrow keys cannot be used
  • Typing is broken (Typing "Th" to select "Thirty")

Demo: https://codesandbox.io/p/sandbox/shadow-dom-forked-lhqf9k?from-embed=&workspaceId=ce2e5283-b6b1-48be-8a88-fc138907d293

What I did to create the demo:

  1. Open the demo from: https://mui.com/material-ui/customization/shadow-dom/#demo
  2. Copy BasicSelect from https://mui.com/material-ui/react-select/

Why I have to use shadow DOM: At my company each page of our admin dashboard is built by a different team that wraps their page in shadow DOM.


Not sure how to handle that this issue is essentially a duplicate of: https://github.com/mui/material-ui/issues/34061

Our hope of purchasing the Pro version was that MUI gives higher priority to our issues and just giving a thumbs up to the existing issue or commenting our order id there is probably not visible enough. What is the right course of action? Opening a new issue or commenting something in existing issues so that someone adds the "support: pro standard" label to them?

Your environment

I don't know how to run npx @mui/envinfo on codesandbox.io

Search keywords: select shadowdom shadow dom keyboard Order ID: 96659

Search keywords:

MartinJaskullaTS avatar Oct 17 '24 10:10 MartinJaskullaTS

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue. Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

[!NOTE] @MartinJaskullaTS How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.

github-actions[bot] avatar Oct 17 '24 10:10 github-actions[bot]

I closed this issue, because I wasn't sure if this is the correct repo to open this issue. I thought maybe it should be opened here: https://github.com/mui/material-ui.

I reopened the issue, because this links here: https://mui.com/x/introduction/support/#technical-support.

MartinJaskullaTS avatar Oct 17 '24 10:10 MartinJaskullaTS

@MartinJaskullaTS Thank you for creating this issue. 👍 I've looked into the problem and commented on the original issue: https://github.com/mui/material-ui/issues/34061#issuecomment-2420227032. Does that help you? 🤔 Maybe you would be willing to create a PR to fix the problem?

Technically this issue is a duplicate and there is no declared priority for handling MUI Core issues with a pro license. 🙈 Screenshot 2024-10-17 at 21 18 59 Given the response in the original issue, do you think we can close this issue as a duplicate?

LukasTy avatar Oct 17 '24 18:10 LukasTy

@LukasTy

Thanks for your help!

I would be willing to create a PR, but I am not sure if I have the time.

I will try and see if this sufficient to set up a working development environment: https://github.com/mui/material-ui/blob/master/CONTRIBUTING.md

MartinJaskullaTS avatar Oct 21 '24 08:10 MartinJaskullaTS

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue. Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

[!NOTE] @MartinJaskullaTS How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.

github-actions[bot] avatar Oct 21 '24 08:10 github-actions[bot]