From 637b70465572eda52cff92553ec9dc4d3203caf0 Mon Sep 17 00:00:00 2001
From: Yash Rajpal <58601732+yash-rajpal@users.noreply.github.com>
Date: Mon, 30 Sep 2024 18:22:06 +0530
Subject: [PATCH] regression: MarkdownText component to parse nested emphasis
tokens (#33385)
---
.../client/components/MarkdownText.spec.tsx | 34 +++++++++++++------
.../meteor/client/components/MarkdownText.tsx | 8 ++---
2 files changed, 27 insertions(+), 15 deletions(-)
diff --git a/apps/meteor/client/components/MarkdownText.spec.tsx b/apps/meteor/client/components/MarkdownText.spec.tsx
index 86ebadad846..69e7a8c25cd 100644
--- a/apps/meteor/client/components/MarkdownText.spec.tsx
+++ b/apps/meteor/client/components/MarkdownText.spec.tsx
@@ -15,26 +15,30 @@ const markdownText = `
**Paragraph text**: *Bold with one asterisk* **Bold with two asterisks** Lorem ipsum dolor sit amet, consectetur adipiscing elit.
## Heading 2
_Italic Text_: _Italic with one underscore_ __Italic with two underscores__ Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- ### Heading 3
+ ### Heading 3
Lists, Links and elements
- **Unordered List**
- - List Item 1
- - List Item 2
- - List Item 3
+ **Unordered List**
+ - List Item 1
+ - List Item 2
+ - List Item 3
- List Item 4
- **Ordered List**
+ **Ordered List**
1. List Item 1
2. List Item 2
3. List Item 3
4. List Item 4
- **Links:**
+ **Links:**
[Rocket.Chat](rocket.chat)
- gabriel.engel@rocket.chat
- +55991999999
+ gabriel.engel@rocket.chat
+ +55991999999
\`Inline code\`
- \`\`\`typescript
+ \`\`\`typescript
const test = 'this is code'
\`\`\`
+ **Bold text within __Italics__**
+ *Bold text with single asterik and underscore within _Italics_*
+ __Italics within **Bold** text__
+ _Italics within *Bold* text with single underscore and asterik_
`;
it('should render html elements as expected using default parser', async () => {
@@ -54,13 +58,17 @@ it('should render html elements as expected using default parser', async () => {
'<em>Italic Text</em>: <em>Italic with one underscore</em> <em>Italic with two underscores</em> Lorem ipsum dolor sit amet',
);
expect(normalizedHtml).toContain('<h3>Heading 3</h3>');
- expect(normalizedHtml).toContain('<ul> <li>List Item 1 </li><li>List Item 2 </li><li>List Item 3 </li><li>List Item 4');
+ expect(normalizedHtml).toContain('<ul> <li>List Item 1</li><li>List Item 2</li><li>List Item 3</li><li>List Item 4');
expect(normalizedHtml).toContain('<ol> <li>List Item 1</li><li>List Item 2</li><li>List Item 3</li><li>List Item 4');
expect(normalizedHtml).toContain('<a title="" rel="nofollow noopener noreferrer" target="_blank">Rocket.Chat</a>');
expect(normalizedHtml).toContain('gabriel.engel@rocket.chat');
expect(normalizedHtml).toContain('+55991999999');
expect(normalizedHtml).toContain('<code>Inline code</code>');
expect(normalizedHtml).toContain('<pre><code class="language-typescript">const test = \'this is code\' </code></pre>');
+ expect(normalizedHtml).toContain('<strong>Bold text within <em>Italics</em></strong>');
+ expect(normalizedHtml).toContain('<strong>Bold text with single asterik and underscore within <em>Italics</em></strong>');
+ expect(normalizedHtml).toContain('<em>Italics within <strong>Bold</strong> text</em>');
+ expect(normalizedHtml).toContain('<em>Italics within <strong>Bold</strong> text with single underscore and asterik</em>');
});
it('should render html elements as expected using inline parser', async () => {
@@ -89,4 +97,8 @@ it('should render html elements as expected using inline parser', async () => {
expect(normalizedHtml).toContain('+55991999999');
expect(normalizedHtml).toContain('Inline code');
expect(normalizedHtml).toContain(`typescript const test = 'this is code'`);
+ expect(normalizedHtml).toContain('<strong>Bold text within <em>Italics</em></strong>');
+ expect(normalizedHtml).toContain('<strong>Bold text with single asterik and underscore within <em>Italics</em></strong>');
+ expect(normalizedHtml).toContain('<em>Italics within <strong>Bold</strong> text</em>');
+ expect(normalizedHtml).toContain('<em>Italics within <strong>Bold</strong> text with single underscore and asterik</em>');
});
diff --git a/apps/meteor/client/components/MarkdownText.tsx b/apps/meteor/client/components/MarkdownText.tsx
index 0b7d2efa780..a116ad83ddd 100644
--- a/apps/meteor/client/components/MarkdownText.tsx
+++ b/apps/meteor/client/components/MarkdownText.tsx
@@ -23,10 +23,10 @@ const inlineWithoutBreaks = new marked.Renderer();
const walkTokens = (token: marked.Token) => {
const boldPattern = /^\*[^*]+\*$|^\*\*[^*]+\*\*$/;
const italicPattern = /^__(?=\S)([\s\S]*?\S)__(?!_)|^_(?=\S)([\s\S]*?\S)_(?!_)/;
- if (boldPattern.test(token.raw)) {
- token.type = 'strong';
- } else if (italicPattern.test(token.raw)) {
- token.type = 'em';
+ if (boldPattern.test(token.raw) && token.type === 'em') {
+ token.type = 'strong' as 'em';
+ } else if (italicPattern.test(token.raw) && token.type === 'strong') {
+ token.type = 'em' as 'strong';
}
};
--
GitLab