[HOLD for payment 2022-05-02] Can't use slash in debit card expiration date field on iPhone - Reported by @thesahindia

[mvtglobally]

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 app
2. Navigate to Settings > Payments > Add payment method
3. Select Debit card
4. Try to enter / in date field

Expected Result:

User should be able to enter /

Actual Result:

User is unable to enter /

Workaround:

Unknown

Platform:

Where is this issue occurring?

• iOS

Version Number: 1.1.23-0
Reproducible in staging?: Y
Reproducible in production?: Y
Logs: https://stackoverflow.com/c/expensify/questions/4856
Notes/Photos/Videos: Any additional supporting documentation

Screen.Recording.2021-12-23.at.1.28.22.AM.mov

Expensify/Expensify Issue URL:
Issue reported by: @thesahindia
Slack conversation: https://expensify.slack.com/archives/C01GTK53T8Q/p1640203176471300

View all open jobs on GitHub

[MelvinBot]

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

[sketchydroide]

I see 2 ways to go about this:

1. Add the / to the symbol keyboard
2. Automatically add the / after the first 2 numbers

We coul potentially do both.
@Jag96 you seem to have worked on thid, any suggestion?

[mallenexpensify]

From the Slack thread

We could just add the / to the keypad below.
If so. I think it'd also be good to auto-add the /after numbers 2-12 since that's what the next step/action would be.... right?

[mananjadhav]

Proposal
None of the keyboard types support '/' in addition to numbers. There's numbers-and-punctuation but it only works on iOS. I would recommend adding / automatically.

Something on the following lines (not thoroughly tested):

handleExpiryDateChange = (text) => {
  let currentExpiry = text;
  if (currentExpiry[0] !== '1' && currentExpiry[0] !== '0') {
    currentExpiry = '';
  }

  if (currentExpiry.length === 2) {
      if (parseInt(currentExpiry.substring(0, 2)) > 12 || parseInt(currentExpiry.substring(0, 2)) == 0) {
        currentExpiry = currentExpiry[0];
      } else if (this.state.text.length === 2) {
        currentExpiry += '/';
      } else {
        currentExpiry = currentExpiry[0];
      }
    }
    this.clearErrorAndSetValue('expirationDate', currentExpiry)
}

and then onChangeText call handleExpiryDateChange.

In addition to this, I have a small enhancement. CardUtils.getYearFromExpirationDateString we're hardcoding 20${cardYear}. While I know it'll work for the next 80 years 😛 , we could just make it dynamic.

moment().format('YYYY').substring(0, 2)

[MelvinBot]

@sketchydroide Huh... This is 4 days overdue. Who can take care of this?

[mallenexpensify]

@sketchydroide can you review @mananjadhav 's Proposal above when you're back? Thx
#6891 (comment)

[MelvinBot]

@sketchydroide Still overdue 6 days?! Let's take care of this!

[MelvinBot]

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

[mallenexpensify]

I just realized this issue hasn't been labeled External yet so I unassigned @sketchydroide then readded the Engineering label. @MonilBhavsar , can you add the External or Internal label please?

[MelvinBot]

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

[MonilBhavsar]

This can be worked externally and I also think automatically inputing and removing / would provide good UX

[MelvinBot]

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

[Julesssss]

Hi @mananjadhav, do you have an update here?

[mananjadhav]

70% done, some tests failing when I have a string with slash already then backspace should delete the slash as well as digit pending.
Will it have by tomorrow or Friday

[mallenexpensify]

Manan and Rajat are working on the PR

[mallenexpensify]

Progress is being made #7362

[mallenexpensify]

PR is still chuggin' along 🚂

[mallenexpensify]

@parasharrajat or @mananjadhav can you provide an update? It doesn't look like an actions been taken on the PR for 9 days

[parasharrajat]

I am yet to give another round of testing. I will do this asap.

[mallenexpensify]

Discussion going on in the PR

[mallenexpensify]

PR just got 🎀 this morn!

[mallenexpensify]

@Julesssss what's next step here? Looks like PR was merged a week ago and nothing's happened since then

[Julesssss]

Hey @mallenexpensify, deploys have been a bit slow recently, we're still waiting for the PR to be deployed to production. As soon as that happens the issue should be closed.

[melvin-bot]

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

• Add slash in Debit card expiration #7362

If no regressions arise, payment will be issued on 2022-05-02. 🎊

[mallenexpensify]

@mananjadhav @parasharrajat @thesahindia Hired in Upwork, can you accept the offer please?
I'll pay on Wednesday, I'm off Mon/Tues
https://www.upwork.com/jobs/~01bcc8abfe9585856e

[Julesssss]

Not overdue

[mananjadhav]

@mallenexpensify Reminder on Upwork payment

[mallenexpensify]

Thanks for the ping @mananjadhav .
@parasharrajat @thesahindia and @mananjadhav paid $250 each.