Repository navigation
iOS/ Android - Payments - Tapping bank account crashes the app #10083
Description
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:
- Launch the app and login
- Toggle the staging server
- Tap payments > bank account
Expected Result:
User taken to plaid connection flow
Actual Result:
App is crashed
Workaround:
unknown
Platform:
Where is this issue occurring?
- iOS
- Android
Version Number: 1.1.86-0
Reproducible in staging?: y
Reproducible in production?: n
Email or phone of affected tester (no customers): any
Logs: https://stackoverflow.com/c/expensify/questions/4856
Notes/Photos/Videos:
Bug5662711_XWZM2964_1_.mp4
Expensify/Expensify Issue URL:
Issue reported by: Applause internal team
Slack conversation:
Activity
OSBotify commentedon Jul 25, 2022
👋 Friendly reminder that deploy blockers are time-sensitive ⏱ issues! Check out the open
StagingDeployCashdeploy checklist to see the list of PRs included in this release, then work quickly to do one of the following:melvin-bot commentedon Jul 25, 2022
Triggered auto assignment to @neil-marcellini (
Engineering), see https://stackoverflow.com/c/expensify/questions/4319 for more details.neil-marcellini commentedon Jul 25, 2022
👀
neil-marcellini commentedon Jul 25, 2022
I believe #9423 is causing the problem, but I haven't pinned it down exactly yet.
neil-marcellini commentedon Jul 25, 2022
Ok, the problem is with the conditional rendering here. @nkuoch
App/src/components/AddPlaidBankAccount.js
Lines 151 to 155 in dd5a83e
If
props.plaidData.erroris an empty string then react native will render and empty string, and not the text component. The solution I used was to wrap it in parentheses, but you can also use a ternary statement or!!props.plaidData.errorto evaluate as a boolean. Easy mistake to make! Here's the SO I used to find this https://stackoverflow.com/questions/52368342/invariant-violation-text-strings-must-be-rendered-within-a-text-componentneil-marcellini commentedon Jul 25, 2022
There's something else happening here where the plaid link opens twice, so if you try to close it then the second one remains open in a permanent loading state. I'll see if I can figure it out tomorrow.
[-] iOS - Payments - Tapping bank account crashes the app[/-][+] iOS/ Android - Payments - Tapping bank account crashes the app[/+]luacmartins commentedon Jul 26, 2022
Nice investigation so far @neil-marcellini! Let me know if you need any help with this tomorrow!
neil-marcellini commentedon Jul 26, 2022
After further investigation it looks like the PlaidLink is rendering with the old
plaidLinkTokenbefore the token is cleared with BankAccounts.clearPlaid(). So openLink is called once with the old token, thenOnyx.setfinishes setting the token to an empty string, and then openPlaidBankLogin returns with the new plaid token, which once again callsopenLink.