[PAID] Can't drag mouse to select text in input

[Julesssss]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Version Number: v1.4.66-5
Reproducible in staging?: Yes
Reproducible in production?: Prod

Action Performed:

• Start to create a group chat
• Type the name of someone to filter results
• Click 'Add to group'
• Try to drag the cursor across the text input

Expected Result:

• The page starts to swipe away

Actual Result:

• The page should remain static when dragging in the input field

Workaround:

Can the user still use Expensify without this being fixed? Have you informed them of the workaround?

Platforms:

Which of our officially supported platforms is this issue occurring on?

• Android: Native
• Android: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

cantDragTextSelection.mov

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~016f4130ede9fb97f6
• Upwork Job ID: 1784836362659282944
• Last Price Increase: 2024-04-29
• Automatic offers:
• Krishna2323 | Contributor | 0

[melvin-bot]

Triggered auto assignment to @strepanier03 (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[Krishna2323]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Can't drag mouse to select text in input

What is the root cause of that problem?

Input in SelectionList does not intercept swipe.

App/src/components/SelectionList/BaseSelectionList.tsx

Line 520 in 8c07611

<TextInput

What changes do you think we should make in order to solve the problem?

We can pass shouldInterceptSwipe to TextInput in BaseSelectionList.

What alternative solutions did you explore? (Optional)

If we don't want to add shouldInterceptSwipe as default we can accept a prop shouldInterceptSwipe in BaseSelectionList and then pass it to TextInput and then pass shouldInterceptSwipe as true in NewChatPage. We will also look for similar components which uses OnyxTabNavigator and have inputs.

App/src/pages/NewChatPage.tsx

Line 306 in 8c07611

<SelectionList<OptionsListUtils.Option & ListItem>

Result

input_drag_issu.mp4

[Krishna2323]

Proposal Updated

• Minor update in alternative section and demo video added.

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~016f4130ede9fb97f6

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @ahmedGaber93 (External)