search

microsoft / fluent-ui-react

An ecosystem for building highly customizable enterprise class user interfaces.
https://aka.ms/fluent-ui
MIT License
432 stars 55 forks source link

Popup is closed incorrectly when click inside element #1324

Closed xiaolanli closed 5 years ago

xiaolanli commented 5 years ago

Bug Report

Steps

  1. click on the button, a Popup with an inner button "click me" shows up
  2. click on "click me", the popup disappeared

Expected Result

click on "click me", the popup should get smaller. *Notice that we put "e.preventDefault();" to the onClick handler, but it didn't trap the event.

Actual Result

the popup disappears

Version

latest

Testcase

https://codesandbox.io/s/031rl98lzw?fontsize=14

johannao76 commented 5 years ago

I would like to add that this is also causing an issue with Enter key press on the toolbar buttons in compose, so we should address both issues in the same change. Keyboard events also have the same issue on the stickers picker. The deeper issue here seems to be that stardust is using native events as opposed to react events. These don't share the same pipeline and should not be mixed. We should only use react events.