[HOLD for payment 2023-10-25] [$500] Dev: Web - The "Copy URL to clipboard" tooltip does not appear when hovering over a task description link

[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 a chat.
2. Navigate to the "Assign task" section.
3. Enter a title and insert a link in the description, then create the task.
4. After task creation, right-click on the description link.
5. Observe that the tooltip for "Copy URL to clipboard" does not appear

Expected Result:

When hovering over a task description link and right-clicking, the "Copy URL to clipboard" tooltip should be displayed

Actual Result:

The "Copy URL to clipboard" tooltip does not appear when hovering over a task description link

Workaround:

Can the user still use Expensify without this being fixed? Have you informed them of the 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: Dev 1.3.71.7
Reproducible in staging?: n
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: Any additional supporting documentation

screen-recording-2023-09-19-at-65133-pm_3LXLwhH6.mp4

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

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~015f37f0d47d0bab66
• Upwork Job ID: 1704225979412377600
• Last Price Increase: 2023-10-04
• Automatic offers:
• jjcoffee | Reviewer | 27066533
• ZhenjaHorbach | Contributor | 27066534

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~015f37f0d47d0bab66

[melvin-bot]

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

[melvin-bot]

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

[rmm-fl]

Regression from #27736

[ZhenjaHorbach]

Regression from #27736

It's true (

Proposal

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

The "Copy URL" tooltip is not displayed when hovering over a task description link and right-clicking

What is the root cause of that problem?

We don't use <comment> wrapper for links in MenuItem

App/src/components/MenuItem.js

Lines 131 to 133 in 6d67552

	if (props.shouldParseTitle) {
	return html;
	}

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

We can use <comment></comment> tag for result this function

App/src/components/MenuItem.js

Lines 126 to 133 in 6d67552

	const getProcessedTitle = useMemo(() => {
	if (props.shouldRenderAsHTML) {
	return convertToLTR(props.title);
	}
	if (props.shouldParseTitle) {
	return html;
	}

I can guess why this was done ( was deleted)
So that when creating a task we cannot click on links

Therefore, it would be nice to add a new prop that will allow us to disable and enable clickability depending on the situation(optional)

What alternative solutions did you explore? (Optional)

NA

[jjcoffee]

We may want to hold this on #27769 in case they want to fix the regression. I've asked there.

[jjcoffee]

@alexpensify can you update the title to hold on #27769, per this comment.

[alexpensify]

Thanks for flagging @jjcoffee -- Done!

[alexpensify]

@jjcoffee - this GH we were holding on is in production now. Can you test to confirm if we should keep this one open? Thanks!

[jjcoffee]

@alexpensify Thanks for the heads up! Looks like they decided not to fix it, and I can still repro, so we're good to take this off hold.

We also already have a proposal from @ZhenjaHorbach we can go with. I like the idea of adding a shouldEnableLinks prop, but I'm unsure how necessary it is. Did you think of a situation where we would not want this enabled @ZhenjaHorbach?

🎀👀🎀 C+ reviewed

[melvin-bot]

Triggered auto assignment to @youssef-lr, see https://stackoverflow.com/c/expensify/questions/7972 for more details.

[ZhenjaHorbach]

@jjcoffee
I don’t even remember anymore))
But looking at my proposal

So that when creating a task we cannot click on links

I think at least in this case we would like to disable the links

[jjcoffee]

@ZhenjaHorbach Hmm I'm not sure what the expected behaviour is when creating a task. It does autolink there too at the moment (unless that's a separate bug 😄) so I think I would err on the side of making it copyable (as links generally are in the app).

[ZhenjaHorbach]

@jjcoffee
I was thinking about this case )
I don't know how reasonable it is to add ability to copy
If this is just a preview (Screenshot with changes if we add <comment>${html}</comment> for all links)

But I think that is not critical
So we can remove the condition from my proposition )

[alexpensify]

@jjcoffee any feedback for @ZhenjaHorbach's latest update? Thanks!

[alexpensify]

@youssef-lr we need the assignment so that @ZhenjaHorbach can carry on with the next steps. Thanks!

[youssef-lr]

Done!

[melvin-bot]

📣 @jjcoffee 🎉 An offer has been automatically sent to your Upwork account for the Reviewer role 🎉 Thanks for contributing to the Expensify app!

Offer link
Upwork job

[melvin-bot]

📣 @ZhenjaHorbach 🎉 An offer has been automatically sent to your Upwork account for the Contributor role 🎉 Thanks for contributing to the Expensify app!

Offer link
Upwork job
Please accept the offer and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻
Keep in mind: Code of Conduct | Contributing 📖

[melvin-bot]

📣 @ayazhussain79 We're missing your Upwork ID to automatically send you an offer for the Reporter role.
Once you apply to the Upwork job, your Upwork ID will be stored and you will be automatically hired for future jobs!

[alexpensify]

@ZhenjaHorbach -- there is a more recent discussion going on in Slack. Please jump in there before starting this PR. Thanks!

[alexpensify]

I've followed up in the Slack thread to confirm if we need to make changes here or close this GH.

[jjcoffee]

@alexpensify Sorry, should've posted an update - we've settled on there needing to be markdown rendering correctly in all these views (Confirm Task, Task detail, Private Notes), so we're good to keep this open. Just waiting for @youssef-lr to approve the PR!

[alexpensify]

Whoops - thanks for calling that out because I didn't check the PR 🤦🏼

[alexpensify]

I reached out in Chat to see if we can get the review soon.

[melvin-bot]

Based on my calculations, the pull request did not get merged within 3 working days of assignment. Please, check out my computations here:

• when @ZhenjaHorbach got assigned: 2023-10-06 22:42:31 Z
• when the PR got merged: 2023-10-17 19:31:17 UTC
• days elapsed: 6

On to the next one 🚀

[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.3.86-5 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• The "Copy URL to clipboard" tooltip does not appear when hovering over a task description link #28951

If no regressions arise, payment will be issued on 2023-10-25. 🎊

After the hold period is over and BZ checklist items are completed, please complete any of the applicable payments for this issue, and check them off once done.

• External issue reporter
• Contributor that fixed the issue
• Contributor+ that helped on the issue and/or PR

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

• @jjcoffee requires payment offer (Reviewer)
• @ZhenjaHorbach requires payment offer (Contributor)
• @ayazhussain79 requires payment

As a reminder, here are the bonuses/penalties that should be applied for any External issue:

• Merged PR within 3 business days of assignment - 50% bonus
• Merged PR more than 9 business days after assignment - 50% penalty

[jjcoffee]

• The PR that introduced the bug has been identified. Link to the PR: [CP Staging] create common render for html and fix wrapping of title #27736
• 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: Create different files for HTML Render and fix scroll width #27769 (comment)
• 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: N/A
• Determine if we should create a regression test for this bug. Yes
• 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.

Regression test proposal

1. Open any chat
2. Click the + and "Assign task"
3. Enter a title and insert the following in the description field

https://new.expensify.com/
~https://new.expensify.com/~
# https://new.expensify.com/

5. Save the description and verify that the Confirm Task screen correctly renders the markdown and links.
6. Right click any of the links in the description and verify that the "Copy URL to clipboard" tooltip appears
7. Save the task.
8. On the task detail screen, verify the same as in steps 5 and 6.

Do we agree 👍 or 👎

[alexpensify]

Here is the payment summary:

• External issue reporter - @ayazhussain79 $50
• Contributor that fixed the issue - @ZhenjaHorbach $500
• Contributor+ that helped on the issue and/or PR - @jjcoffee $500

Upwork Job: https://www.upwork.com/jobs/~015f37f0d47d0bab66

*If applicable, the bonuses will be applied on the final payment

Extra Notes regarding payment: There is no urgency bonus but no penalty either since this GH required discussion and review on the right solution.

[alexpensify]

@ayazalavi - I need your help to accept the offer in Upwork, looks like automation failed here.

[ayazhussain79]

@alexpensify offer accepted, Thank you

[alexpensify]

Closing - everyone has been paid and I've created the regression test request.