[HOLD for payment 2024-03-07] [$500] Android - Task - Keyboard does not open after selecting task title

[izarutskaya]

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

---

Version Number: 1.4.44-0
Reproducible in staging?: Y
Reproducible in production?: N
Logs: https://stackoverflow.com/c/expensify/questions/4856
Issue reported by: Applause-Internal Team

Action Performed:

1. Open the app and log in
2. Open the task assigned to you or create one
3. Tap the task title

Expected Result:

The keyboard opens, and the title field is in focus

Actual Result:

The keyboard does not open, and the title field is not in focus

Workaround:

Unknown

Platforms:

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

• Android: Native
• Android: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Bug6393640_1709013065452.screen-20240227-000407.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01476b0db32bd2022c
• Upwork Job ID: 1762430957116813312
• Last Price Increase: 2024-02-27

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~01476b0db32bd2022c

[melvin-bot]

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

[melvin-bot]

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

[github-actions]

👋 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 @madmax330 (Engineering), see https://stackoverflowteams.com/c/expensify/questions/9980/ for more details.

[izarutskaya]

We think that this bug might be related to #vip-vsb
CC @quinthar

[Martin-REI]

Proposal
Please re-state the problem that we are trying to solve in this issue.
The keyboard does not open, and the title field isn't in focus.

What is the root cause of that problem? Likely related to the focus management of the input field, which should trigger the keyboard to appear.

What changes do you think we should make in order to solve the problem? Check that the input component is configured properly, make sure TextInput isn't being obstructed or improperly managed by layout components.

What alternative solutions did you explore?

[melvin-bot]

📣 @Martin-REI! 📣
Hey, it seems we don’t have your contributor details yet! You'll only have to do this once, and this is how we'll hire you on Upwork.
Please follow these steps:

1. Make sure you've read and understood the contributing guidelines.
2. Get the email address used to login to your Expensify account. If you don't already have an Expensify account, create one here. If you have multiple accounts (e.g. one for testing), please use your main account email.
3. Get the link to your Upwork profile. It's necessary because we only pay via Upwork. You can access it by logging in, and then clicking on your name. It'll look like this. If you don't already have an account, sign up for one here.
4. Copy the format below and paste it in a comment on this issue. Replace the placeholder text with your actual details.
   
   Format:

Contributor details
Your Expensify account email: <REPLACE EMAIL HERE>
Upwork Profile Link: <REPLACE LINK HERE>

[Martin-REI]

Contributor details
Your Expensify account email: martinwilhelmrei@gmail.com
Upwork Profile Link: https://www.upwork.com/freelancers/~01de573da854537dcf

[melvin-bot]

✅ Contributor details stored successfully. Thank you for contributing to Expensify!

[aswin-s]

Proposal

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

Task title input is not focused on load

What is the root cause of that problem?

InputWrapper for TaskTitle page is missing autoFocus prop

App/src/pages/tasks/TaskTitlePage.js

Line 100 in 668df99

InputComponent={TextInput}

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

Add autoFocus prop to InputWrapper component in taskTitle page

<InputWrapper
 autoFocus
 InputComponent={TextInput}
 role={CONST.ROLE.PRESENTATION}
 inputID={INPUT_IDS.TITLE}

What alternative solutions did you explore? (Optional)

None

[situchan]

@aswin-s this is deploy blocker. There should be offending PR

[akinwale]

Proposal

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

The task title field is not focused after opening the task title edit view when creating or editing a task.

What is the root cause of that problem?

The title input does not get autofocused after the screen is open.

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

We can make use of the useAutoFocusInput hook to autofocus the input field, which is the preferred approach to autofocusing text inputs in the codebase. This change can be made in the TaskTitlePage and NewTaskTitlePage components.

+const {inputCallbackRef} = useAutoFocusInput();
<InputWrapper
    ...
- ref={(el) => {
- if (!el) {
-     return;
-  }
- if (!inputRef.current && didScreenTransitionEnd) {
-    el.focus();
-  }
-  inputRef.current = el;
-}}
+    ref={inputCallbackRef}

We can also update the TaskDescriptionPage to follow this approach.

What alternative solutions did you explore? (Optional)

None.

[benjaminbennet]

Proposal

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

Android - Task - Keyboard does not open after selecting task title

What is the root cause of that problem?

The logic of focus input was added in here: #26634.
However, it had some issues related to input not focus when going back or input is not focus when opening screen.

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

Use our best pratice by using useAutoFocus effect:

 const {inputCallbackRef} = useAutoFocusInput();

And update our input

<InputWrapper  ref={inputCallbackRef} />

What alternative solutions did you explore? (Optional)

[akinwale]

Proposal

Updated

Some formatting updates.

[situchan]

I think this came from #29991, same root cause as #37156, #37252. didScreenTransitionEnd is not called in android.
cc: @hannojg

[melvin-bot]

Reviewing label has been removed, please complete the "BugZero Checklist".

[melvin-bot]

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

• revert: native stack #37305

If no regressions arise, payment will be issued on 2024-03-07. 🎊

For reference, here are some details about the assignees on this issue:

• @mananjadhav requires payment through NewDot Manual Requests

[melvin-bot]

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

• [@mananjadhav] The PR that introduced the bug has been identified. Link to the PR:
• [@mananjadhav] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment:
• [@mananjadhav] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion:
• [@mananjadhav] Determine if we should create a regression test for this bug.
• [@mananjadhav] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.
• [@alexpensify] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

[alexpensify]

Awesome, looks like automation kicked in here.

---

Heads up, I will be offline until Tuesday, March 5, 2024. I will not be actively watching over this GitHub during that period. If anything urgent is needed here, please ask for help in the Open Source Slack Room-- thanks!

[melvin-bot]

Payment Summary

Upwork Job

• Reviewer: @mananjadhav owed $500 via NewDot

BugZero Checklist (@alexpensify)

• I have verified the correct assignees and roles are listed above and updated the neccesary manual offers
• I have verified that there are no duplicate or incorrect contracts on Upwork for this job (https://www.upwork.com/ab/applicants/1762430957116813312/hired)
• I have paid out the Upwork contracts or cancelled the ones that are incorrect
• I have verified the payment summary above is correct

[situchan]

Please assign me here for reviewing PR

[alexpensify]

@mananjadhav - I reviewed the PR and only see action by @situchan. Can you share the PR related to your actions for a PR related to this GitHub? Thanks! I'm trying to complete the payment process and want to make sure that I'm not missing a C+ review. Thanks!

[situchan]

@alexpensify here's context

[mananjadhav]

Yes I didn't work on this issue. The PR was solving multiple regressions, and I was afk. Hence I asked to reassign.

[alexpensify]

Thanks for the context! I wasn't aware of the Slack post and wanted to double-check that there wasn't a split here.

[melvin-bot]

❌ There was an error making the offer to @situchan for the Contributor role. The BZ member will need to manually hire the contributor.

[alexpensify]

@situchan - Please accept here:

https://www.upwork.com/jobs/~01476b0db32bd2022c

After, I can complete the required process. Thanks!

---

Here is the payment summary:

• External issue reporter - N/A
• Contributor that fixed the issue - N/A
• Contributor+ that helped on the issue and/or PR - @situchan $500

Upwork Job: See above

[alexpensify]

All set, everyone has been paid in Upwork here.