Bug: Incorrect Checkbox Toggle on Mobile Devices

[ishwariiic]

Issue: Incorrect Checkbox Toggle on Mobile Devices

---

Summary
I noticed this bug in lists containing two or more checkboxes, tapping on a checkbox sometimes toggles a different one. This issue appears to be isolated to mobile and touch-based devices.

Observed Behavior
When interacting with checkboxes on mobile, there is an inconsistency: clicking on one checkbox may inadvertently toggle another. For instance, tapping in sequence may result in the prior checkbox activating or deactivating instead of the one currently being clicked.

Technical Details

• This problem occurs specifically in React version 18.3.1.
• The error does not appear to exist in React 16.14.0, where toggling functions as expected.
• The bug might relate to how touch event listeners are handled in React 18.3.1, given its absence in earlier versions.

Steps to Reproduce

1. Access the app on a mobile device (e.g., iPhone 15 Pro) using Safari, Orion, or Firefox.
2. Select multiple checkboxes in sequence.
3. Notice that the expected toggle behavior is disrupted, with the wrong checkbox sometimes activating.

Expected Result
Each checkbox should respond only to its respective tap or click, toggling exclusively as the user interacts with it.

Live Demonstration

• Correct Behavior (React 16.14.0):
  React 16 Example Sandbox
  Live Preview

• Incorrect Behavior (React 18.2.0):
  React 18 Example Sandbox
  Live Preview

[dayabsm]

Related to #31275 and #27475

[adi-ydv-1]

its nothing like that..its working fine in my mobile.maybe its due to zoom in or out ...