Inconsistent Behavior With Magnification When Selecting Dropdowns

[mnguyenKU]

Issue: Intermittent Magnification Reset on Dropdown Interaction

Description

We're encountering an intermittent issue where the magnification feature is unexpectedly disabled upon interacting with dropdown menus. This leads to the screen re-centering and resetting the magnification level to its default setting. This problem occurs regardless of the magnification level chosen, the specific dropdown menu interacted with, or the toolbox state (open or closed).

Steps to Reproduce

1. Implement a custom React hook for dynamic UI scaling, adjusting to user interactions and specific application states.
2. Interact with a <Select/> component to trigger the dropdown expansion.
3. Occasionally, the magnification will turn off and the screen will re-center.

Note: This issue is inconsistent and does not happen with every interaction, complicating the reproduction process.

Expected Behavior

The magnification settings should remain consistent when interacting with dropdown menus, without causing the screen to re-center or the magnification to reset.

Actual Behavior

Sometimes, upon selecting an option from a dropdown menu, the magnification turns off, and the screen re-centers. This occurs regardless of the magnification level or the specific dropdown used.

Possible Workaround

We've identified a temporary workaround using pinch-to-zoom gestures instead of our built-in magnification tool. We're interested in more permanent solutions.

Request for Suggestions

We welcome any suggestions, ideas, or insights for a lasting solution to this issue. We're also open to providing sample code snippets (as sharing our entire codebase is impossible) to troubleshoot the problem further.

Environment

• React Select Version: 5.2.2
• React Version: 18.2
• Operating System: macOS 11.6, macOS 12.3, iPadOS 16.1, iPadOS 17.3.1