[HOLD for payment 2023-01-19] Unpin tooltip text is splitting into 2 lines

[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:

1. Open the app and navigate to chat
2. Press the pin icon in the header of the chat screen
3. Hover over the pin icon again and check the tooltip text

Expected Result:

Unpin text should be in a single line

Actual Result:

Unpin text is splitting in 2 lines

Workaround:

unknown

Platforms:

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

• MacOS / Chrome / Safari
• MacOS / Desktop

Version Number: 1.2.51-0
Reproducible in staging?: Y
Reproducible in production?: N
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:

unpin-tooltip-text.mov

Expensify/Expensify Issue URL:
Issue reported by: @jayeshmangwani
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1673208539820589

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01757fe35604e7bf17
• Upwork Job ID: 1612617865531674624
• Last Price Increase: 2023-01-10

[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.

[alex-mechler]

@roryabraham possibly related to #12168?

[alex-mechler]

Confirmed its related to that PR by reverting it locally

[alex-mechler]

This appears to be because of a delay in rerendering the Portal's components. If we do not set a text width in updateTooltipTextWidth, but read the ref's offsetWidth, we see that the offsetWidth is correct when it has not been overwritten

[alex-mechler]

Okay, adding a timeout before recalculating the width of the tooltip fixes this, but I think that narrows it down to the Portal component not re-rendering its children fast enough