[HOLD for payment 2022-12-15] [$500] Login - Clicking the eye icon moves the cursor to the beginning

[kbecciv]

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

---

Action Performed:

1. Go to URL https://staging.new.expensify.com/
2. Enter an email address
3. Press continue
4. Enter the password
5. Click to the eye icon

Expected Result:

The cursor should not moved

Actual Result:

The cursor moved to the beginning

Workaround:

Unknown

Platform:

Where is this issue occurring?

• Web
• iOS
• Android
• Desktop App
• Mobile Web

Version Number: 1.2.18.2

Reproducible in staging?: Yes

Reproducible in production?: Yes

Email or phone of affected tester (no customers):

Logs: https://stackoverflow.com/c/expensify/questions/4856

Notes/Photos/Videos: Any additional supporting documentation

video_2022-10-20_12-37-43.mp4

@Julesssss removed the capture as it was an unrelated recording

Expensify/Expensify Issue URL:

Issue reported by: Applause - Internal Team

Slack conversation:

View all open jobs on GitHub

[melvin-bot]

Triggered auto assignment to @Julesssss (Engineering), see https://stackoverflow.com/c/expensify/questions/4319 for more details.

[Julesssss]

Yep, I can reproduce. @kbecciv would you mind re-uploading a video? I think you uploaded a different bug, so I removed it.

[melvin-bot]

Triggered auto assignment to @flaviadefaria (External), see https://stackoverflow.com/c/expensify/questions/8582 for more details.

[melvin-bot]

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

[melvin-bot]

Current assignee @Julesssss is eligible for the External assigner, not assigning anyone new.

[aimane-chnaif]

I don't think it's worthy enough to fix.
slack discussion: https://expensify.slack.com/archives/C01GTK53T8Q/p1663012828257749
related issue and comments:
#10555

[Julesssss]

Oh, thanks for linking! While I agree with most of that discussion we've recently decided to try fixing each and every bug we encounter. For that reason, I think we should reopen this and see what sort of proposals we receive.

If the solution is very convoluted, then maybe it would be preferable to just default to the end, given that mobile and some web browsers do this by default.

[kbecciv]

@Julesssss Video is attached, sorry for missing it.

[Julesssss]

Thanks, no worries

[melvin-bot]

@eVoloshchak, @Julesssss, @flaviadefaria Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[melvin-bot]

@eVoloshchak, @Julesssss, @flaviadefaria Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[Julesssss]

Awaiting proposals

[flaviadefaria]

link to the internal job posting: posting https://www.upwork.com/ab/applicants/1584804132817670144/job-details
link external job: https://www.upwork.com/jobs/~017777eb694223c27d

[esh-g]

PROPOSAL

---

I looked at the code to update the secured state of the password and this is the method that does that:

Problem
Changing the state seems to reset the cursor and brings it to the start.

Solution
When the hide button is clicked, and the above method is called, it should also call another method that sets the cursor position to the end of the input:

This method just gets the length of the current value and send the cursor to that position. This is the cleanest and lowest complexity implementation for this situation. The only problem was that calling this function along side the setState did not work. So I had to queue it in the microtasks so that it gets executed after calling setState.

I successfully solved the issue and now this works with complete reliability on web.

New.Expensify.-.Google.Chrome.2022-10-27.01-37-18.mp4

Now only testing on other platforms is left, which I plan to do upon hire. I look forward to contribute to this wonderful project!

[Julesssss]

Thanks for the proposal. But I'm curious whether there's a better solution that doesn't require us to manually set the cursor.

[esh-g]

Apparently the cursor resetting is just react-native internal behaviour, I tested on snack and got the cursor going to the beginning as well. I tried to fiddle around with other textInput components which was unsuccessful but I think that would be unnecessary and just add extra code. This was the solution that was the simplest and most importantly added the least amount of code. And is much more reliable than relying on a third-party component.

[Julesssss]

Seems like this introduced this regression, so I'm going to have to revert it.

[esh-g]

I'm really sorry for this. I'll fix it asap

[Julesssss]

No worries. I also missed this.

[esh-g]

I found out a solution. Should I make a new PR?

[Julesssss]

I found out a solution. Should I make a new PR?

Yeah, just give me a few minutes to revert the previous changes to unblock our staging build. It'll be a few more minutes, and then you can raise the PR against a clean main branch.

[Julesssss]

@Someone-here all done, no rush with the new PR as I won't be able to review until next week

[esh-g]

Okay, thank you for giving me another chance. I will do extensive testing before submitting PR this time.

[esh-g]

Made a new PR #13317 This fixes the regression. I have done extensive testing with checkboxes on all platforms as well. I hope this serves its purpose this time...

[flaviadefaria]

Heads up I'm heading OoO for a week so in case this needs to be paid out before I come back then please reassign or ask someone else in the team to process the payment. Thanks!

[melvin-bot]

The solution for this issue has been 🚀 deployed to production 🚀 in version 1.2.36-4 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• Keep input cursor in place when toggling password checkbox  #13187

If no regressions arise, payment will be issued on 2022-12-15. 🎊

After the hold period, please check if any of the following need payment for this issue, and if so check them off after paying:

• External issue reporter
• Contributor that fixed the issue
• Contributor+ that helped on the issue and/or PR

As a reminder, here are the bonuses/penalties that should be applied for any External issue:

• Merged PR within 3 business days of assignment - 50% bonus
• Merged PR more than 9 business days after assignment - 50% penalty

[Julesssss]

I decided to close the outstanding PR on the second review as it's adding quite a bit of complexity to the Checkbox component. Explained a bit more here.

@flaviadefaria could you please pay out the original contract when you're back? We had a regression so I believe it will be 50% of the payment

[eVoloshchak]

It also was merged within ~12 days, which is a 50% penalty (or contract termination?)

I don't think I'm eligible for any payment on this one, there were a couple of regressions I could have noticed, we've dragged this out for more than 2 weeks, I don't want to get paid for this one

[Julesssss]

Fair enough, thanks @eVoloshchak but you still reviewed the PR originally so I think the reduced payment is fine.

Honestly, I'm not sure the 12-day rate counts here due to the regression.

[esh-g]

Guys, I am really sorry if you think I did not do upto to the mark but I tried my best....

[Julesssss]

Hey @Someone-here don't worry. I should have called it out earlier in the process and maybe we could have discussed alternatives. Let's just move onto the next issue 👍

[esh-g]

Great! Thank you for the positive attitude

[flaviadefaria]

We'll be paying out $250 for each of you (50% penalty). I've sent you both the contract offer in UW please accept and let me know here once done. Thanks!

[flaviadefaria]

Everyone has been paid so closing this out.