[$500] mWeb/Chrome - Login - Left half of the text selector is visible

[lanitochka17]

If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!

---

Version Number: 1.4.8.0 Reproducible in staging?: Y Reproducible in production?: Y If this was caught during regression testing, add the test name, ID and link from TestRail: Email or phone of affected tester (no customers): Logs: https://stackoverflow.com/c/expensify/questions/4856 Expensify/Expensify Issue URL: Issue reported by: Applause - Internal Team Slack conversation:

Action Performed:

1. Navigate to https://staging.new.expensify.com/
2. Type in any email address
3. Long tap on any magic code bracket

Expected Result:

The right one should be also visible Or it shouldn't be visible at all if it's not needed on the magic code

Actual Result:

Left half of the text selector is visible

Workaround:

Unknown

Platforms:

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

• [ ] Android: Native
• [x] Android: mWeb Chrome
• [ ] iOS: Native
• [ ] iOS: mWeb Safari
• [ ] MacOS: Chrome / Safari
• [ ] MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

https://github.com/Expensify/App/assets/78819774/8f898a08-3e5e-4e27-9282-26f6f6df749f

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~011bbe3ca6ae771280
• Upwork Job ID: 1732094325192740864
• Last Price Increase: 2023-12-12
• Automatic offers:
• DylanDylann | Contributor | 28061766
• situchan | Contributor | 28073052

[melvin-bot[bot]]

Triggered auto assignment to @johncschuster (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[melvin-bot[bot]]

Job added to Upwork: https://www.upwork.com/jobs/~011bbe3ca6ae771280

[melvin-bot[bot]]

Bug0 Triage Checklist (Main S/O)

• [ ] This "bug" occurs on a supported platform (ensure Platforms in OP are ✅)
• [ ] This bug is not a duplicate report (check E/App issues and #expensify-bugs)
  • If it is, comment with a link to the original report, close the issue and add any novel details to the original issue instead
• [ ] This bug is reproducible using the reproduction steps in the OP. S/O
  • If the reproduction steps are clear and you're unable to reproduce the bug, check with the reporter and QA first, then close the issue.
  • If the reproduction steps aren't clear and you determine the correct steps, please update the OP.
• [ ] This issue is filled out as thoroughly and clearly as possible
  • Pay special attention to the title, results, platforms where the bug occurs, and if the bug happens on staging/production.
• [ ] I have reviewed and subscribed to the linked Slack conversation to ensure Slack/Github stay in sync

[melvin-bot[bot]]

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

[DylanDylann]

Proposal

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

• mWeb/Chrome - Login - Left half of the text selector is visible

What is the root cause of that problem?

• Long tap on any input will display the caret is the default behavior.

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

• We can set props caretHidden:true in here https://github.com/Expensify/App/blob/18d4b9b661e77ff1d3e5d0c335df5c838c405345/src/components/MagicCodeInput.js#L370

What alternative solutions did you explore? (Optional)

• NA

Result

Screencast from 08-12-2023 18:49:12.webm

[johncschuster]

Not overdue. We're still getting proposals in

[ArekChr]

@DylanDylann After setting the carretHidden prop to true, the issue still exists when long pressing on MagicCodeInput

[DylanDylann]

@ArekChr How do you set it? Let me check again

[ArekChr]

@DylanDylann Like in your proposal, App/src/components/MagicCodeInput.js added caretHidden in line 371

[DylanDylann]

@ArekChr We need to somehow pass the caretHidden to core TextInput of 'react-native'. Do it by updating: https://github.com/Expensify/App/blob/2165e74853e491fedf9152bdee2b291269496b88/src/components/RNTextInput.tsx#L10-L25

• When creating the proposal, I am just writing the general idea. So to test if the caretHidden works or not, just update the above to:

 <AnimatedTextInput
            allowFontScaling={false}
            textBreakStrategy="simple"
            ref={(refHandle) => {
                if (typeof ref !== 'function') {
                    return;
                }
                ref(refHandle);
            }}
            // eslint-disable-next-line
            {...props}
+           caretHidden={true}
        />

[ArekChr]

@DylanDylann Sure thing. After setting it directly in AnimatedTextInput for test purposes, it solves the problem. We can go with your proposal.

:ribbon: :eyes: :ribbon: C+ reviewed

[melvin-bot[bot]]

Triggered auto assignment to @joelbettner, see https://stackoverflow.com/c/expensify/questions/7972 for more details.

[melvin-bot[bot]]

📣 It's been a week! Do we have any satisfactory proposals yet? Do we need to adjust the bounty for this issue? 💸

[melvin-bot[bot]]

📣 @DylanDylann 🎉 An offer has been automatically sent to your Upwork account for the Contributor role 🎉 Thanks for contributing to the Expensify app!

Offer link Upwork job Please accept the offer and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻 Keep in mind: Code of Conduct | Contributing 📖

[melvin-bot[bot]]

@johncschuster, @joelbettner, @ArekChr, @DylanDylann Whoops! This issue is 2 days overdue. Let's get this updated quick!

[melvin-bot[bot]]

@johncschuster, @joelbettner, @ArekChr, @DylanDylann Whoops! This issue is 2 days overdue. Let's get this updated quick!

[melvin-bot[bot]]

Triggered auto assignment to @joekaufmanexpensify (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[johncschuster]

I'm OOO starting Monday, December 18, and will return Tuesday, January 2.

Current status: The issue has been assigned to @DylanDylann. We're waiting on a PR (Thanks, @DylanDylann!)

If this issue is open when I'm back from OOO, I'll take it back over. Thank you!

[DylanDylann]

@johncschuster I am working on it

[melvin-bot[bot]]

@johncschuster @joelbettner @ArekChr @joekaufmanexpensify @DylanDylann this issue was created 2 weeks ago. Are we close to approving a proposal? If not, what's blocking us from getting this issue assigned? Don't hesitate to create a thread in #expensify-open-source to align faster in real time. Thanks!

[joekaufmanexpensify]

PR in progress

[joekaufmanexpensify]

Going to change this to weekly, since I'm OOO next week.

[melvin-bot[bot]]

@johncschuster @joelbettner @ArekChr @joekaufmanexpensify @DylanDylann this issue is now 3 weeks old. There is one more week left before this issue breaks WAQ and will need to go internal. What needs to happen to get a PR in review this week? Please create a thread in #expensify-open-source to discuss. Thanks!

[melvin-bot[bot]]

@johncschuster, @joelbettner, @ArekChr, @joekaufmanexpensify, @DylanDylann Whoops! This issue is 2 days overdue. Let's get this updated quick!

[joelbettner]

@DylanDylann any word on this?

[situchan]

@joelbettner if you check discussion in https://github.com/Expensify/App/pull/33267, the bug is not fixed on android chrome.

Btw, I can take over C+ since @ArekChr is now not in C+ team

[melvin-bot[bot]]

📣 @situchan 🎉 An offer has been automatically sent to your Upwork account for the Contributor role 🎉 Thanks for contributing to the Expensify app!

Offer link Upwork job Please accept the offer and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻 Keep in mind: Code of Conduct | Contributing 📖

[joekaufmanexpensify]

@johncschuster I've been a bit slammed with assignments coming back from OOO, so going to let you take this one back. LMK if there's anything else I can help with though!

[melvin-bot[bot]]

@johncschuster @joelbettner @situchan @DylanDylann this issue is now 4 weeks old and preventing us from maintaining WAQ, can you:

• Decide whether any proposals currently meet our guidelines and can be approved as-is today
• If no proposals meet that standard, please take this issue internal and treat it as one of your highest priorities
• If you have any questions, don't hesitate to start a discussion in #expensify-open-source

Thanks!

[melvin-bot[bot]]

Current assignee @situchan is eligible for the Internal assigner, not assigning anyone new.