[$250] Web - Chat - Pasted message not always displays no hyperlink format when paste as plain text

[IuliiaHerets]

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

---

Version Number: undefined
Reproducible in staging?: Yes
Reproducible in production?: Yes
Issue reported by: Applause Internal Team

Action Performed:

1. Open https://staging.new.expensify.com/
2. At any chat, type hello and send message
3. Click three dots of message action menu
4. Click "Copy to clipboard"
5. At compose box, right click mouse and select "Paste as plain text"
6. Send message
7. Repeat 3 times from step 2 to step 6

Expected Result:

When choosing "Paste as plain text", the message is pasted without any hyperlink format

Actual Result:

The first time paste as plain text, the message is pasted with hyperlink format, the second time it is pasted without hyperlink format as expected

Workaround:

Unknown

Platforms:

• Android: Standalone
• Android: HybridApp
• Android: mWeb Chrome
• iOS: Standalone
• iOS: HybridApp
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Bug6679622_1732842325268.Recording__740_1_.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021866332344495527627
• Upwork Job ID: 1866332344495527627
• Last Price Increase: 2025-01-14
• Automatic offers:
• prakashbask | Contributor | 105699511

Issue Owner

Current Issue Owner: @Pujan92

[melvin-bot]

Triggered auto assignment to @alexpensify (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[FitseTLT]

Edited by proposal-police: This proposal was edited at 2024-12-06 21:28:37 UTC.

Proposal

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

Web - Chat - Pasted message not always displays no hyperlink format when paste as plain text

What is the root cause of that problem?

We are setting the plain text to a markdown value if it is anchor tag and plain text value if it is not

App/src/pages/home/report/ContextMenu/ContextMenuActions.tsx

Line 52 in 48b80f6

const plainText = isAnchorTag ? Parser.htmlToMarkdown(content) : Parser.htmlToText(content);

but anchor regex test passes intermittently for the same value as explained here because:

When the RegExp test method is run with global flag (/g), the regex keeps internally the state of the search. Therefore at each invocation the regular exception will be run from the last index that was found previously.

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

This isAnchorRegex check is introduced in #42147 to achieve copy paste consistency across web and native platforms but to achieve it the correct way to do it is to copy the mardown content to the plain clipboard here

App/src/pages/home/report/ContextMenu/ContextMenuActions.tsx

Lines 47 to 52 in 476f397

	} else {
	const anchorRegex = CONST.REGEX_LINK_IN_ANCHOR;
	const isAnchorTag = anchorRegex.test(content);
	const plainText = isAnchorTag ? Parser.htmlToMarkdown(content) : Parser.htmlToText(content);
	Clipboard.setHtml(content, plainText);
	}

        Clipboard.setHtml(content, Parser.htmlToMarkdown(content));

then convert from markdown > text here for web

App/src/hooks/useHtmlPaste/index.ts

Lines 93 to 98 in 476f397

	const handlePastePlainText = useCallback(
	(event: ClipboardEvent) => {
	const plainText = event.clipboardData?.getData('text/plain');
	if (plainText) {
	paste(plainText);
	}

const markdownText = event.clipboardData?.getData('text/plain');
            if (markdownText) {
                const pastedHTML = Parser.replace(markdownText);
                paste(Parser.htmlToText(pastedHTML));
            }

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

We can make a unit test for setClipboardMessage passing the same anchor link content (mocking canSetHtml to return true) and asserting the text argument it is passing to setHtml is the same (markdown not plain text version) for consecutive calls of the function.

What alternative solutions did you explore? (Optional)

[melvin-bot]

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

[melvin-bot]

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

[alexpensify]

@Pujan92 - Can you please review and confirm if one of these proposals will fix the issue? Thanks!

[AK-web]

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

Web - Chat - Pasted message not always displays no hyperlink format when paste as plain text

What is the root cause of that problem?

ContextMenuActions.tsx (lines 45–55)

The root cause is that the plain text fallback wasn't being reliably set as the primary clipboard content before the HTML, leading to inconsistent behavior during the first "Paste as plain text" operation.

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

After:

	const plainText = isAnchorTag ? Parser.htmlToMarkdown(content) : Parser.htmlToText(content);

        // First, set the plain text to the clipboard to ensure it is prioritized
	Clipboard.setString(plainText);
	
	
        // Then, set the HTML content with plain text fallback
        Clipboard.setHtml(content, plainText);

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

To prevent reintroducing this issue in the future, automated tests should cover a range of scenarios to verify clipboard behavior and ensure consistency across environments.
Plain Text Fallback: Ensure that if Clipboard.canSetHtml() returns false, the plain text content is set correctly.
HTML Content and Plain Text: Verify that when Clipboard.canSetHtml() is true, both HTML and plain text versions of the content are set as expected.

What alternative solutions did you explore? (Optional)

[melvin-bot]

📣 @AK-web! 📣
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>

[prakashbask]

Edited by proposal-police: This proposal was edited at 2024-12-10 15:20:03 UTC.

Proposal

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

Chat - Pasted message is not always displayed without hyperlink format when paste as plain text

What is the root cause of that problem?

There are two problems here

1. During copy to clipboard, we have inconsistent behavior observed when using the regex CONST.REGEX_LINK_IN_ANCHOR as it has global flag ('g') which is stateful and the regex lastIndex is not reset to zero before using it again. So alternatively, markdown and plain text gets copied. In the condition for isAnchorTag, only markdown should be copied to clipboard

App/src/pages/home/report/ContextMenu/ContextMenuActions.tsx

Lines 50 to 52 in df7ab48

	const anchorRegex = CONST.REGEX_LINK_IN_ANCHOR;
	const isAnchorTag = anchorRegex.test(content);
	const plainText = isAnchorTag ? Parser.htmlToMarkdown(content) : Parser.htmlToText(content);

2. If we solve root cause (1), since markdown will be copied to clipboard as plain text, in useHTMLPaste hook when handlePastePlainText is called, we don't have the text extraction of the markdown so instead of "hello" we will be pasting [hello](<link>) which is not the expected behaviour

App/src/hooks/useHtmlPaste/index.ts

Lines 79 to 81 in 9fe5511

	const plainText = event.clipboardData?.getData('text/plain');
	if (plainText) {
	paste(plainText);

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

We should create a new instance of RegExp. The updated code in

App/src/pages/home/report/ContextMenu/ContextMenuActions.tsx

Line 50 in df7ab48

const anchorRegex = CONST.REGEX_LINK_IN_ANCHOR;

will be

const anchorRegex = new RegExp(CONST.REGEX_LINK_IN_ANCHOR);

To handle root cause (2), we should check and convert the markdown to plain text in

App/src/hooks/useHtmlPaste/index.ts

Line 81 in 9fe5511

paste(plainText);

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

None

What alternative solutions did you explore? (Optional)

[melvin-bot]

@alexpensify, @Pujan92 Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[Pujan92]

Thanks for the proposals.

@FitseTLT and @prakashbask's proposal of regex new instance won't solve the problem as it will only make it consistent(isAnchorTag gets true) and paste will be always the link format.

@AK-web's RCA and solution don't look correct to me.

2. If we solve root cause (1), since markdown will be copied to clipboard as plain text, in useHTMLPaste hook when handlePastePlainText is called, we don't have the text extraction of the markdown so instead of "hello" we will be pasting hello which is not the expected behaviour

I agree with the @prakashbask RCA but why do we need the text extraction within the useHTMLPaste? Isn't the right plainText should be passed from ContextMenuActions Clipboard.setHtml?

[FitseTLT]

Thanks for the proposals.

@FitseTLT and @prakashbask's proposal of regex new instance won't solve the problem as it will only make it consistent(isAnchorTag gets true) and paste will be always the link format.

@Pujan92 You have misunderstood the problem. The problem is that isAnchorTag is being inconsistent and the solution is to make it consistent. You have to first understand the purposes of isAnchorTag check please refer to #42147 for more context where they have implemented to make the copy of anchor to be always the markdown text for both plain and HTML clipboard. The purpose is to make it consistent whether anchor link are copied to clipboard from web or native. 👍

[Pujan92]

@FitseTLT The problem isn't only making isAnchorTag consistent, it also should paste correct text without the link when the user chooses "Paste as plain text".

[FitseTLT]

@FitseTLT The problem isn't only making isAnchorTag consistent, it also should paste correct text without the link when the user chooses "Paste as plain text".

We will cause regression on #42147 please read the PR for more context.

[Pujan92]

You have to first understand the purposes of isAnchorTag check please refer to #42147 for more context where they have implemented to make the copy of anchor to be always the markdown text for both plain and HTML clipboard.

As a hint, I would like to suggest checking whether #40564 is an actual issue or correct behavior.

[FitseTLT]

You have to first understand the purposes of isAnchorTag check please refer to #42147 for more context where they have implemented to make the copy of anchor to be always the markdown text for both plain and HTML clipboard.

As a hint, I would like to suggest checking whether #40564 is an actual issue or correct behavior.

That's a nice idea. My first proposal was like your suggestions but after digging deep I found out the PR and that's why I proposed the fix for the RCA of the inconsistency.

In case your expectation is accepted I have Updated to incorporate it to my alt solution

Ok @Pujan92 Let's ask for the expected behaviour 👍

[Pujan92]

When choosing "Paste as plain text", the message is pasted without any hyperlink format

@alexpensify Could you plz confirm the expected behavior for this issue as @FitseTLT is requesting? To me, it looks correct.

[prakashbask]

When choosing "Paste as plain text", the message is pasted without any hyperlink format

@alexpensify Could you plz confirm the expected behavior for this issue as @FitseTLT is requesting? To me, it looks correct.

@Pujan92 @alexpensify We will need to club this 53832 issue also to discuss the expected behaviour

[FitseTLT]

@alexpensify To make it clear for you. The problem here is inconsistency in the paste behaviour as mentioned in the Actual Result

Actual Result:
The first time paste as plain text, the message is pasted with hyperlink format, the second time it is pasted without hyperlink format as expected

We have no doubt on fixing the inconsistency. What we want from you is to confirm on the behaviour of paste as a plain text for links. what should be pasted?
A. plain text
B. link

In all other cases for past as plain we paste the text without the formating, for instance, if it was a bold text markdown when we paste as plain we paste only the raw text without formatting but the problem is they have made an exception for anchor links in this PR to fix an issue That change made links to be pasted with the link for both normal paste and paste as plain text options. WDYT is the expected behaviour? Should we revert the change by that PR or fix the inconsistency based on the expectations from that PR.

[Pujan92]

@Pujan92 @alexpensify We will need to club this 53832 issue also to discuss the expected behaviour

Agree @prakashbask, both can be clubbed. The only platform that differs is Android as it doesn't support HTML paste and we need to consider it a special case for deriving plainText. cc @ZhenjaHorbach

As a hint, I would like to suggest checking whether #40564 is an actual issue or correct behavior.

I might be wrong here @FitseTLT, I think that issue needs to be generic to render all markdowns on Android instead of plain text.

[melvin-bot]

⚠️ Looks like this issue was linked to a Deploy Blocker here

If you are the assigned CME please investigate whether the linked PR caused a regression and leave a comment with the results.

If a regression has occurred and you are the assigned CM follow the instructions here.

If this regression could have been avoided please consider also proposing a recommendation to the PR checklist so that we can avoid it in the future.

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

• Web - Chat - Pasted message not always displays no hyperlink format w… #55932

If no regressions arise, payment will be issued on 2025-02-18. 🎊

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

• @prakashbask requires payment automatic offer (Contributor)
• @Pujan92 requires payment through NewDot Manual Requests

[melvin-bot]

@Pujan92 @alexpensify @Pujan92 The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed. Please copy/paste the BugZero Checklist from here into a new comment on this GH and complete it. If you have the K2 extension, you can simply click: [this button]

[melvin-bot]

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

• Web - Chat - Pasted message not always displays no hyperlink format w… #55932

If no regressions arise, payment will be issued on 2025-02-19. 🎊

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

• @prakashbask requires payment automatic offer (Contributor)
• @Pujan92 requires payment through NewDot Manual Requests

[melvin-bot]

@Pujan92 @alexpensify @Pujan92 The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed. Please copy/paste the BugZero Checklist from here into a new comment on this GH and complete it. If you have the K2 extension, you can simply click: [this button]

[Pujan92]

We have reverted the PR due to the below issues where paste/paste as plain text isn't consistent and breaking bcoz of setting the markdown in the "text/plain".

#56484
#55932 (comment)

I think we should avoid setting markdown for the anchor tag in the current code which I believe is incorrectly implemented here because that isn't pasted correct text for plain text.

Screen.Recording.2025-02-13.at.22.49.38.mov

I suggest revert the changes applied for issue and set the plain text only for "text/plain" instead of the markdown. This is something we discussed earlier in this issue.

It means we won't be able to achieve #53832 as android isn't supporting "text/html".

@jasperhuangg @prakashbask Let me know your thoughts.

[prakashbask]

@Pujan92 @jasperhuangg
Please refer to the scenario description below, where I have mentioned both current and proposed

I fee that "Paste as plain text" should paste only markdown format and not strip out the markdown syntax in order to maintain consistency across different scenarios. (e.g Copy to Clipboard and Copy from composer)

[alexpensify]

I believe that this payment is on hold now because the PR was reverted. @Pujan92 please correct me if my summary is incorrect.

[Pujan92]

You are correct @alexpensify.

[alexpensify]

Thanks for the update!

[melvin-bot]

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

[Pujan92]

I just raised @prakashbask's point in slack.

@prakashbask Have you already requested to join the Slack channel? If yes, then @alexpensify can help to grant access.

[prakashbask]

slack

@Pujan92 @alexpensify I submitted a request to join Slack by filling out a Google Form about three months ago using my email ID, [email protected]. However, the request is still pending.