[HOLD for payment 2023-02-18] [$1000] Sending multiline messages with 1st line as h1 and 2nd line regular, both lines appears in the LHN

[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
2. Open any chat
3. Send bold text using # and normal text on next line
4. Open another chat
5. Send same text as sent in point 3 but without making it bold using #

Expected Result:

Only first line of both the messages should be visible in the LHN

Actual Result:

For chat with bold text and normal text on next line, both the bold text and normal text are visible adjacent to each other on LHN

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.2.61-0
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:

Recording.1405.mp4

multiline.reports.page.view.issue.mp4

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

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~0108354374b8e7c006
• Upwork Job ID: 1620446934113501184
• Last Price Increase: 2023-01-31

[melvin-bot]

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

[melvin-bot]

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

[melvin-bot]

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

[melvin-bot]

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

[tienifr]

Proposal

This is due to an issue in parser.htmlToText that we're parsing the <h1> incorrectly.

We're parsing things like
<h1>Test</h1>message into Testmessage, which is incorrect because h1 always make the next block go to next line. In order to fix this, we need to add a new rule to htmlToTextRules to parse </h1> into /n instead of empty string:

this.htmlToTextRules = [
            {
                name: 'breakline',
                regex: /<br[^>]*>/gi,
                replacement: '\n',
            },
            {
                name: 'blockquoteopen',
                regex: /(.|\s)(<blockquote>)/gi,
                replacement: '$1\n',
            },
            {
                name: 'blockquote',
                regex: /<\/blockquote>(.|\s)/gm,
                replacement: '\n$1',
            },
+            {
+                name: 'headingClose',
+                regex: /<\/h1>/gi,
+                replacement: '\n',
+            },
            {
                name: 'stripTag',
                regex: /(<([^>]+)>)/gi,
                replacement: '',
            },
        ];

We need to apply the same fix for the back-end as well, the above fix works for the optimistic data case, but after a few seconds the back-end will update it to the wrong value.

[tienifr]

We can improve the regex for the h1 if we want to, for example: /<\/h1[^>]*>/gi to account for the case when there's whitespace between </h1 and >, but the basic idea is the same