react-select icon indicating copy to clipboard operation
react-select copied to clipboard

Clicking on the dropdown field does not fire onClick events added to window when on mobile

Open m-suchorski opened this issue 3 years ago • 6 comments

Description of the issue:

When on mobile (either a real device or simulated with Chrome Dev Tools) click events aren't triggered when clicking on the dropdown input.

Steps to reproduce the issue:

  1. Go to: https://react-select.com/home (because any dropdown from react-select will work for that)
  2. Open DevTools, go to Console and type in window.addEventListener('click', () => console.log('clicked'));
  3. Click on the icon found in the top left corner to simulate a mobile device
  4. Click on a dropdown - no log will be visible in the console

Clicking someplace else or disabling mobile device simulation will produce logs after clicking on the dropdown.

Expected result:

When on mobile, a click on the dropdown input should produce a log in the console. The log is just an example, of course.

m-suchorski avatar Nov 14 '22 10:11 m-suchorski

Same issue here. Any updates?

swlukasssicevs avatar Nov 24 '22 18:11 swlukasssicevs

In case anyone has been able to resolve the issue or find a solution, I would much appreciate the help. Some parts of my team's development have been blocked because of this problem. We have been using this library quite extensively, thus dropping it would mean rebuilding a lot of our search fields across the website from scratch.

swlukasssicevs avatar Dec 06 '22 10:12 swlukasssicevs

This issue is causing a lot of challenges on my end. please provide us a solution

Khaledneo avatar Feb 10 '23 15:02 Khaledneo

is it possible that this issue is being caused because we are using class component instead of functional component

IbraheemHaseeb7 avatar Sep 24 '23 17:09 IbraheemHaseeb7

Hey guys! this maybe be an expected behavior. Instead of listening to "click" event, on mobile you can listen to "touchstart" event on mobile. You can achieve the same thing, but this is not going to work on desktop though. Maybe you have to do both.

Ex:

window.addEventListener('touchstart', () => console.log('clicked touch')); window.addEventListener('click', () => console.log('clicked'));

So, this may be not a bug, what're your thoughts ?

italofuji avatar Sep 30 '23 21:09 italofuji

image I'm actually getting a console log when I click being on mobile simulation. Am I doing anything wrong?

Navayuvan-SB avatar Nov 30 '24 13:11 Navayuvan-SB