[$500] Chat - Text partially cut for last text on paste of long text

[kbecciv]

If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!

---

Action Performed:

1. Open the app
2. Open any report
3. Type in multiline text which just triggers scroll and copy it or copy similar length text from any other source
4. Paste it in composer and observe that last line text is displayed partially cut

Expected Result:

App should scroll to bottom to ensure that pasted text is displayed fully

Actual Result:

App should scroll to bottom to ensure that pasted text is displayed fully

Workaround:

Unknown

Platforms:

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

• Android / native
• Android / Chrome
• iOS / native
• iOS / Safari
• MacOS / Chrome / Safari
• MacOS / Desktop

Version Number: 1.3.77.5
Reproducible in staging?: y
Reproducible in production?: y
If this was caught during regression testing, add the test name, ID and link from TestRail:
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Notes/Photos/Videos: Any additional supporting documentation

mac.desktop.paste.scroll.half.text.mov

mac.chrome.paste.scroll.half.text.mov

windows.chrome.partially.cut.text.on.paste.mp4

Recording.4853.mp4

Expensify/Expensify Issue URL:
Issue reported by: @dhanashree-sawant
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1696347080023239

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01f1d1d117c4970023
• Upwork Job ID: 1709626352655679488
• Last Price Increase: 2023-10-11

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~01f1d1d117c4970023

[melvin-bot]

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

[melvin-bot]

Bug0 Triage Checklist (Main S/O)

• This "bug" occurs on a supported platform (ensure Platforms in OP are ✅)
• This bug is not a duplicate report (check E/App issues and #expensify-bugs)
  • If it is, comment with a link to the original report, close the issue and add any novel details to the original issue instead
• This bug is reproducible using the reproduction steps in the OP. S/O
  • If the reproduction steps are clear and you're unable to reproduce the bug, check with the reporter and QA first, then close the issue.
  • If the reproduction steps aren't clear and you determine the correct steps, please update the OP.
• This issue is filled out as thoroughly and clearly as possible
  • Pay special attention to the title, results, platforms where the bug occurs, and if the bug happens on staging/production.
• I have reviewed and subscribed to the linked Slack conversation to ensure Slack/Github stay in sync

[melvin-bot]

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

[saiKumarGanji]

Proposal

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

On paste of long text which just triggers scroll, the text is getting partially cut, instead of displaying until the bottom

What is the root cause of that problem?

The textarea element on paste is not scrolling entirely down, which results in partial text cut

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

When we copy into textarea, we can catch the copy event and set the textarea scroll to the bottom using js dom methods

What alternative solutions did you explore? (Optional)

NA

[nebiyuelias1]

Proposal

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

When pasting a very long text, the composer is not scrolled all the way to the bottom. It's scrolled partially. But it seems this happens only for edge cases. If the text is substantially long it's scrolled fully.

What is the root cause of that problem?

It seems the Composer was refactored into a FC with this PR. Inside the updateNumberOfLines function. It seems the author used a workaround of setting height to 0 first and then to auto, and it seems it's having a jumping effect. But it doesn't guarantee it will be scrolled all the way.

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

To ensure it's scrolled all the way to the bottom we can include something like the following inside the updateNumberOfLines function to make sure it will always be scrolled all the way to the bottom:
textInput.current.scrollTop = textInput.current.scrollHeight;

What alternative solutions did you explore? (Optional)

[hoangzinh]

I gonna review current proposals today.

[hoangzinh]

@saiKumarGanji @nebiyuelias1 Thanks for your proposals. I don't think it's correct. Your proposal could lead to a regression bug where a user is typing somewhere in the middle of the composer, and tries to copy and paste something then it would scroll to the end of the composer instead of staying focused in the end of pasting text.

[lschurr]

Waiting on new proposals.

[nebiyuelias1]

I don't think it's correct. Your proposal could lead to a regression bug where a user is typing somewhere in the middle of the composer, and tries to copy and paste something then it would scroll to the end of the composer instead of staying focused in the end of pasting text.

But after doing some tests on the staging environment, it seems that's what is happening even with the current implementation. So I don't think it will be a regression. But what other problem could my proposal create? It's a very strange issue because when the text you're pasting is greater than numberOfLines + 2, it's being scrolled without no problem.

[melvin-bot]

📣 It's been a week! Do we have any satisfactory proposals yet? Do we need to adjust the bounty for this issue? 💸

[hoangzinh]

@nebiyuelias1 please take a look at my recording before and after applying your proposal. The composer jumps every time I paste a text

Screen.Recording.2023-10-11.at.23.48.22.mov

[hoangzinh]

btw @lschurr can you reproduce this bug? I couldn't, it works normally from my end

Screen.Recording.2023-10-11.at.23.51.19.mov

[nebiyuelias1]

@nebiyuelias1 take a look at my recording before and after applying your proposal. The composer jumps every time I paste a text

Screen.Recording.2023-10-11.at.23.48.22.mov

Ok thank you for showing me the problem. Well what if I actually do the manual scrolling only when pasting text? Do you think that will solve the problem?

[hoangzinh]

@nebiyuelias1 I think we should find out the root cause first. Otherwise, all proposals might be work-around solutions. We need to find out the root cause and fix it.

[nebiyuelias1]

btw @lschurr can you reproduce this bug? I couldn't, it works normally from my end

Screen.Recording.2023-10-11.at.23.51.19.mov

That's probably because you've added a multiline text with more than 17 rows. This bug happens only when you have 17 lines of text. The default behavior of HTML textarea is consistent with the partial problem we have. I just couldn't figure out where we're actually manually scrolling.

[nebiyuelias1]

@hoangzinh you can look this pr from the past. Basically, they tried changing the focus of the element and as a result, the browser automatically scrolls the content. But the browser's behavior is not always consistent it seems. It will have a partial scroll on text content that is not very large. So I don't see any other way to fix this issue other than manually scrolling it ourselves. But making sure our scrolling code only happens for pasting events. The pr basically removed the change I was suggesting because it had unintended side effects like the one you described.

[hoangzinh]

Great finding @nebiyuelias1. Actually, I tried with 17 lines but I couldn't reproduce this bug, is it related to a specific browser? If you can reproduce this bug, can you share your recording? @nebiyuelias1 . Thanks

Screen.Recording.2023-10-12.at.18.17.14.mov

[nebiyuelias1]

@hoangzinh The text is not partially cut anymore. It's just that the scrollbar is not scrolled all the way to the bottom. When this issue was first created the problem was that the text was being partially cut but I'm no longer observing that behavior. So I feel like we might have wasted time on this issue. You can probably close it.

[lschurr]

Going to close!

[hoangzinh]

@nebiyuelias1 It's great. looking forward to seeing your proposals in other issues.