[HOLD for payment 2022-12-08] Profile - If user uses saved information, background turns white & is very hard to read

[kavimuru]

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:

Pre-Condition: User has saved information on their device

1. Access staging.new.expensify.com
2. Enter a valid account
3. Tap on Profile icon > Profile > Add phone number
4. Selected the saved information option

Expected Result:

User expects the background to match the dark theme

Actual Result:

The background turns to a bright white and afterwards makes it very hard to read the text in the field

Workaround:

unknown

Platform:

Where is this issue occurring?

• Web

Version Number: 1.2.33-1
Reproducible in staging?: Y
Reproducible in production?: New UI
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Notes/Photos/Videos:
EXTRA: This seems to happen with any input field as long as you have saves information
https://user-images.githubusercontent.com/43996225/204415527-9c4f235c-788c-413f-b1e8-e74f78a818f7.mp4

Expensify/Expensify Issue URL:
Issue reported by: Applause internal team
Slack conversation:

View all open jobs on GitHub

[OSBotify]

👋 Friendly reminder that deploy blockers are time-sensitive ⏱ issues! Check out the open StagingDeployCash deploy checklist to see the list of PRs included in this release, then work quickly to do one of the following:

1. Identify the pull request that introduced this issue and revert it.
2. Find someone who can quickly fix the issue.
3. Fix the issue yourself.

[melvin-bot]

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

[marcaaron]

Not able to reproduce given these test steps. The input looks fine on my end:

What does "if the user users saved information" mean exactly? Are there missing test steps?

[marcaaron]

Oh, I think you mean "auto complete"... lemme try that.

[marcaaron]

Ok, so the user agent stylesheet will need to be overwritten in our app.

Guessing we did not notice this before because our theme was similar to the defaults that Chrome (and others) add in. I also came across this -> https://developer.mozilla.org/en-US/docs/Web/CSS/:autofill which seems to suggest that the autocomplete UA styles can't be easily overwritten in CSS and require some hacks.

Will look around for some solution... but in the meantime... cc @shawnborton @grgia to see if you all know any workarounds.

[marcaaron]

[sobitneupane]

I had reported this bug earlier here in slack. Raising here for compensation request as a bug reporter.

[marcaaron]

Found a kind of ridiculous hack to fix this here that does work kind of perfectly.

Honestly, it's not looking good for going through the proper channels:

🥲

[melvin-bot]

⚠️ Looks like this issue was linked to a Deploy Blocker here

If you are the assigned CME please investigate whether the linked PR caused a regression and leave a comment with the results.

If a regression has occurred and you are the assigned CM follow the instructions here.

If this regression could have been avoided please consider also proposing a recommendation to the PR checklist so that we can avoid it in the future.

[marcaaron]

I am not really sure how the staging regression could have been avoided in this case. The fix worked in one place but not for all cases. Staging did what it was supposed to in this case and the issue was caught at the right layer.

[luacmartins]

This was fixed by #13164. Closing!

[sobitneupane]

I had reported this bug earlier here in slack. Raising here for compensation request as a bug reporter.

@luacmartins Am I eligible for compensation as a bug reporter here?

[thesahindia]

@luacmartins, c+ review compensation is pending as well.

[melvin-bot]

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

• Fix autofill styles #13119

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

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

[thesahindia]

@luacmartins, c+ review compensation is pending as well.

bump @luacmartins

[luacmartins]

@sobitneupane @thesahindia sorry we missed those. I'll reopen this issue for compensation.

[melvin-bot]

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

[luacmartins]

@sophiepintoraetz can you help with the reporting bonus to @sobitneupane and @thesahindia for C+ PR review?

[thesahindia]

Thanks @luacmartins

[sophiepintoraetz]

To clarify, @thesahindia you're owed $250 C+ plus the bonus of $125, making it a total of $375 owed, correct?
(@sobitneupane - you're $250)

[thesahindia]

@sophiepintoraetz, the bonus only applies to external PRs and for internal PRs the compensation is $1000 (slack post here)

[sophiepintoraetz]

Got it - thanks for confirming, @thesahindia! Hired you both for the job

[sophiepintoraetz]

paid!