Semantic-UI-React
Semantic-UI-React copied to clipboard
Popup: on mobile device is not hidden
Steps
- Open https://codepen.io/anon/pen/LOLKeZ via movile device
- Click on btn
Expected Result
Popup isn't attached to the button Similarly, if you open a modal window on a button with a tooltip, the tooltip will be on top of the modal window
Actual Result
Hide the popup, or recalculate its position
Version
0.76.0
Testcase
https://codepen.io/anon/pen/LOLKeZ https://codepen.io/anon/pen/JOJgdW or https://codesandbox.io/s/18l47oom0l https://codesandbox.io/s/zql531kp1m
@lisonok your codepen examples infinitely load for me. Can you please create your example with this https://codesandbox.io/s/2l3n74j9y starting point?
Yes, https://codesandbox.io/s/18l47oom0l https://codesandbox.io/s/zql531kp1m
I tested this on an iPhone: Safari and Chrome.
I think the issue is, that the on hover
triggered popup is actually never closed on mobile. On mobile, you have no hover. The popup opens with the first click, the modal with the second. On desktop, it gets closed because the button loses its hover state as soon as the modal is overlapping it.
If you set on={'click'}
the popup will close and open on click, and we will have the same issue on desktop as on mobile.
Further, on mobile, I can't close the modal by clicking on the dimmer.
I think it would be better if set on="hover" then the tooltip should be shown for touch devices between touchstart and touchend events
I don't have time to debug this at the moment, however, has anyone tried the known iOS fix?
See https://github.com/Semantic-Org/Semantic-UI-React/pull/1833#issuecomment-313713611.
It didn't help
This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 30 days if no further activity occurs. Thank you for your contributions.
Hello, I still have this bug, tell me how it can be fixed
I'm having the same bug, is any progress?
is any progress?
There has been no activity in this thread for 180 days. While we care about every issue and we’d love to see this fixed, the core team’s time is limited so we have to focus our attention on the issues that are most pressing. Therefore, we will likely not be able to get to this one.
However, PRs for this issue will of course be accepted and welcome!
If there is no more activity in the next 180 days, this issue will be closed automatically for housekeeping. To prevent this, simply leave a reply here. Thanks!
Any progress on this issue?
Having the same issue
Looks like semantic-iu-react is just doesnt implement touchstart and touchend events for any of their components. This may be a dealbreaker for me.
I know I am late to the discussion, and I certainly hope I am getting the point of it.., for anybody having a similar problem - I have solved it by adding the className='computer only' within the popup. Hope it helps.