Non-functional Dropdown when using onRenderItem

[MarcusOy]

Hi there, I am trying to use your Dropdown component on a CRA using Electron and I am finding out that when overriding the default renderer for onRenderItem, none of the options are selectable when the Dropdown is expanded. Here is a demonstration:

https://user-images.githubusercontent.com/16263577/106968063-cad31900-670d-11eb-9ccc-0275e09997ec.mov

Environment Information

• Package version(s): "@fluentui/react": "8.0.0-beta.49" (was also present on beta.28)
• Browser and OS versions: CRA with Electron on MacOS Catalina

Please provide a reproduction of the bug in a codepen:

Codepen Reproduction

Actual behavior:

Each item of the passed-in options prop is rendered exactly how the custom render function renders it, without selection functionality.

Expected behavior:

When overriding onRenderItem, each item of the passed-in options prop is wrapped with some kind of component that allows each option to be selectable (and colored differently when hovered). This is the behavior that I'm seeing on the docs here (look at the Customized Dropdown section).

https://user-images.githubusercontent.com/16263577/106968678-eee32a00-670e-11eb-9d20-403145d0fe03.mov

Also, I noticed that the example above is using still office-ui-fabric packages.

Priorities and help requested:

Are you willing to submit a PR to fix? Yes (if someone could help me identity the issue)

Requested priority: Normal

Products/sites affected: None observed

[joschect]

@MarcusOy Thanks for submitting this! This is really detailed question. I think that we could probably change onRenderItem to pass through the default onClick to give users more control. In the meantime you could use onRenderOption which will ensure that the onclick is handled as you expect. You can see it used here in this codepen

[MarcusOy]

@joschect Wow, thanks for the Codepen! I don't know how I missed onRenderOption and went with onRenderItem. On second glance, I can't seem to find either one in the IDropdownProps interface table in the docs. Perhaps a docs refactor may be needed?

Closing the issue...