[Tabs] Unable to open a Popover using Tab's onActive handler on mobile browser

[dheerajvs]

Problem description

Unable to open a Popover using onActive handler on a Tab on mobile browsers. The popover automatically disappears after being momentarily shown.

Steps to reproduce

Important: You must use "device mode" in Chrome developer tools, or use Chrome on Android device to reproduce this issue. It is NOT reproducible on desktop.

1. Have a Tab with onActive callback.
2. Let the callback set the open state of a Popover

Note: react-tap-event-plugin is injected. Not sure if that matters in this case.

Possible Fix

I'm able to fix this issue by calling event.preventDefault(); just before invoking tab.props.onActive(tab); in this line in Tabs.js.

Another possibility is If the event object is passed to the onActive callback, the application code can call preventDefault() itself if needed.

Versions

• Material-UI: 0.15.0
• React: 15.0.2
• Browser: Chrome 50 on Android 6.0.1, Google Chrome 50 on Mac OS X (Device Mode only)

[oliviertassinari]

The popover automatically disappears after being momentarily shown.

I have already seen this issue, I think that it's linked to some events being triggered on the new element being displayed. Adding a delay should solve the issue.