[BUG] Can not write lower case "i" in people picker when used in spfx webpart with a Document Library also in the page

[Theleni-Nex]

Describe the bug
Using the people picker in a custom webpart in sharepoint. If there is a document library webpart or a list webpart on the same page you can not write the letter "i" in the people picker because it triggers the "Open the details pane" in the document/list webpart.

To Reproduce
Steps to reproduce the behavior:

1. Add the peoplepicker to an spfx webpart.
2. Add that webpart to a page.
3. Add a document library webpart to the same page.
4. Try to write lowecase "i" in the people picker

Expected behavior
"i" should be written in the peoplepicker and not trigger anyhting.

Screenshots

Environment (please complete the following information):

• Browser: Chrome
• Framework: spfx, react
• Context: sharepoint
• Version: 2.6.1

Additional context
Add any other context about the problem here.

[sebastienlevert]

@Theleni-Nex this is a known issue that we see with SPFx webparts leveraging web components (or web components based libraries, like MGT). This is acknowledged by the SPFx team but can't provide an ETA yet (SharePoint/sp-dev-docs#9005).

Please +1 the issue on the sp-dev-docs repository. Thanks! We'll keep this one open until a resolution happens on the SPFx side.

[gavinbarron]

In this instance I think that if we stop propagation on the keydown event we'll stop it from getting to the handler that's opening the document library pane and breaking our experience.

I'll need to double check that there's not a good reason why we're not stopping the event from bubbling already though.

[gavinbarron]

yeah, looks like just an oversight and not that there was an intentional decision to allow the event to bubble up.