[HOLD for payment 2022-10-31] [$250] BUG: Copy pasting a string with html special characters from the chat to another source results in getting decoded characters

[kavimuru]

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 NewDot
2. Send some markdown text to any chat (html special characters)(SELECT count(1) FROM receipts WHERE state IN (3,4,5) AND created >= date("now", "-30 day");)
3. Copy the sent text using (Ctrl+C) and paste it in Notepad, slack etc)

Expected Result:

The text shouldn't be pasted as decoded characters

Actual Result:

Text is pasted as decoded characters (SELECT count(1) FROM receipts WHERE state IN (3,4,5) AND created >= date("now", "-30 day");)

Workaround:

Unknown

Platform:

Where is this issue occurring?

• Web

Version Number: 1.2.12-2
Reproducible in staging?: y
Reproducible in production?: y
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Notes/Photos/Videos:

Recording.658.mp4

Expensify/Expensify Issue URL:
Issue reported by: @coleaeason
Slack conversation: https://expensify.slack.com/archives/C01GTK53T8Q/p1664835972610759

View all open jobs on GitHub

[melvin-bot]

Triggered auto assignment to @mateocole (AutoAssignerTriage), see https://stackoverflow.com/c/expensify/questions/4749 for more details.

[melvin-bot]

Triggered auto assignment to @tjferriss (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 - @mananjadhav (External)

[melvin-bot]

Current assignee @Beamanator is eligible for the External assigner, not assigning anyone new.

[Beamanator]

Moving this along a bit - this is something we usually work out externally 👍

[Ollyws]

Proposal

This is caused by the render method from the dom-serializer module in SelectionScraper, which renders DOM nodes to a string. The string it returns always contains certain characters as escaped and there doesn't seem to be any way to get it to return an unescaped string.

App/src/libs/SelectionScraper/index.js

Lines 132 to 138 in f654cc1

	const getCurrentSelection = () => {
	const domRepresentation = parseDocument(getHTMLOfSelection());
	domRepresentation.children = _.map(domRepresentation.children, replaceNodes);
	const newHtml = render(domRepresentation);
	return newHtml || '';
	};

One way to resolve this is to use the underscore unescape function to unescape the returned string.

- const newHtml = render(domRepresentation);
+ const newHtml = _.unescape(render(domRepresentation));

result:

issue11693.mp4

[tjferriss]

Posting is on UpWorks....

Internal job posting - https://www.upwork.com/ab/applicants/1579848042371682304/job-details

External job posting - https://www.upwork.com/jobs/~0125c406f21abe54eb

[michaelhaxhiu]

Couple of notes:

• No need to include the internal job posting next time! We just need to share the external job 👍
• I just discovered the "How do I create an Upwork job?" stack overflow post needed a small tweak, and made that tweak in step Implement infinite sessions #7:

7. Make sure to remove the https:// portion from the GH URL (if it's left there, then the job may be flagged and removed by Upwork).

• This looks good otherwise!

[mollfpr]

Proposal

Using Str.htmlDecode to decode HTML encoded string.

diff --git a/src/libs/SelectionScraper/index.js b/src/libs/SelectionScraper/index.js
index 99405259e..317b72741 100644
--- a/src/libs/SelectionScraper/index.js
+++ b/src/libs/SelectionScraper/index.js
@@ -133,7 +133,7 @@ const getCurrentSelection = () => {
     const domRepresentation = parseDocument(getHTMLOfSelection());
     domRepresentation.children = _.map(domRepresentation.children, replaceNodes);

-    const newHtml = render(domRepresentation);
+    const newHtml = Str.htmlDecode(render(domRepresentation));
     return newHtml || '';
 };

Screen.Recording.2022-10-12.at.21.30.21.mov

[mananjadhav]

@mollfpr's proposal to use Str.htmlDecode looks better.

cc - @Beamanator

🎀 👀 🎀 
C+ reviewed

[melvin-bot]

📣 @mollfpr You have been assigned to this job by @Beamanator!
Please apply to this job in Upwork 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 📖

[mollfpr]

I found a bug when you try to copy the last chat from a thread by highlighting all the text, it's copying the text I select and also some random text.
https://expensify.slack.com/archives/C01GTK53T8Q/p1666000158578689

I think that bug has nothing to do with this issue right? @mananjadhav @Beamanator

[Beamanator]

I think you're right @mollfpr - sounds like a different part of the codebase 👍

[tjferriss]

@mollfpr can you please apply for the job on Upworks? https://www.upwork.com/jobs/~0125c406f21abe54eb

[mollfpr]

@tjferriss Applied, thank you!

[mananjadhav]

@tjferriss fyi, I've applied to the same link for C+.

[tjferriss]

Hired @mananjadhav as C+ and @mollfpr to fix the issue. Can you both confirm here once accepted?

[mananjadhav]

Thanks @tjferriss I've accepted for C+

[melvin-bot]

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

• Decode on copied text from Clipboard #11905
• Decode on copied text from Clipboard #11905

If no regressions arise, payment will be issued on 2022-10-31. 🎊

[mananjadhav]

@tjferriss Quick bump on the Upwork payment for this one.

[tjferriss]

Yes, thank you. I've initiated the payments in Upworks. The contract has been completed and the Upwork post has been closed.

[parasharrajat]

It seems that this issue's PR caused a regression #12271