[Hold for Payment June 19][$250] Workspace - Inconsistency in Block Quote Usage Between Workspace Description and Chat

[lanitochka17]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Version Number: 1.4.63-7
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught during regression testing, add the test name, ID and link from TestRail: N/A
Email or phone of affected tester (no customers): abebemiherat@gmail.com
Issue reported by: Applause - Internal Team

Action Performed:

1. Navigate to profile > workspace
2. Go to Description, erase the default statement, and add a block quote markdown (e.g., ">>abebe"). Notice it displays correctly
3. Click on Description again, and notice that one quote is reduced
4. Go to any chat, write the same block quote as in the description, click on edit, and then save it. Notice that it doesn't change

Expected Result:

The block quote should be displayed correctly in the workspace description section, like in chat, ensuring consistency

Actual Result:

When writing a block code example (">>abebe") in the workspace description, clicking on it and saving it without changes reduces one quote. However, this inconsistency does not occur in chat

Workaround:

Unknown

Platforms:

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

• Android: Native
• Android: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

Bug6454831_1713528210858.Screen_Recording_2024-04-19_at_4.59.16_AM.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~015e52952078f428b3
• Upwork Job ID: 1781372065227497472
• Last Price Increase: 2024-04-19
• Automatic offers:
• jjcoffee | Reviewer | 0

Issue Owner

Current Issue Owner: @jjcoffee

[melvin-bot]

Triggered auto assignment to @isabelastisser (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.

[lanitochka17]

@isabelastisser FYI I haven't added the External label as I wasn't 100% sure about this issue. Please take a look and add the label if you agree it's a bug and can be handled by external contributors

[lanitochka17]

We think that this bug might be related to #vip-vsp

[melvin-bot]

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

[melvin-bot]

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

[skyweb331]

Proposal

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

Inconsistency in Block Quote Usage in text

What is the root cause of that problem?

App/src/pages/workspace/WorkspaceProfileDescriptionPage.tsx

Lines 29 to 40 in c1827d8

	const [description, setDescription] = useState(() =>
	parser.htmlToMarkdown(
	// policy?.description can be an empty string
	// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
	policy?.description ||
	parser.replace(
	translate('workspace.common.welcomeNote', {
	workspaceName: policy?.name ?? '',
	}),
	),
	),
	);

parser.htmlToMarkdown does not parse html correctly.

For example
parser.htmlToMarkdown('<blockquote><blockquote>abc</blockquote></blockquote>') => >abc which should be >>abc

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

Need to fix ExpensiMark module.

https://github.com/Expensify/expensify-common/blob/c0f7f3b6558fbeda0527c80d68460d418afef219/lib/ExpensiMark.js#L408-L424

FYI, this problem also exists on chat, but if message is saved without changes, it does not call API. That's why this problem does not detected by @lanitochka17. If user edits a blockquote message on chat, it eats blockquotes too.

What alternative solutions did you explore? (Optional)

N/A

[saifelance]

@skyweb331

The root cause of the problem is that the parser.htmlToMarkdown function does not correctly parse HTML. Specifically, when encountering nested

elements, it produces incorrect Markdown output.

To solve this issue, you'll need to fix the ExpensiMark module, which is responsible for parsing HTML into Markdown. The problematic behavior is identified in the ExpensiMark file, particularly in the section that handles blockquote elements.

You can address the issue by modifying the logic in the ExpensiMark.js file to correctly handle nested blockquote elements and ensure that the Markdown output reflects the correct nesting level.