fix(ui): Asterisk pairs are removed in code block (#3326)

Co-authored-by: TAKAHASHI Shuuji <shuuji3@gmail.com>

app/composables/content-parse.ts

@@ -104,11 +104,12 @@ export function parseMastodonHTML(
           .replace(/</g, '&lt;')
           .replace(/>/g, '&gt;')
           .replace(/`/g, '&#96;')
+          .replace(/\*/g, '&ast;')
         const classes = lang ? ` class="language-${lang}"` : ''
         return `><pre><code${classes}>${code}</code></pre>`
       })
       .replace(/`([^`\n]*)`/g, (_1, raw) => {
-        return raw ? `<code>${htmlToText(raw).replace(/</g, '&lt;').replace(/>/g, '&gt;')}</code>` : ''
+        return raw ? `<code>${htmlToText(raw).replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/\*/g, '&ast;')}</code>` : ''
       })
   }
 

tests/nuxt/__snapshots__/content-rich.test.ts.snap

@@ -1,5 +1,12 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
+exports[`content-rich > asterisk paris in code block 1`] = `"<p><pre class="code-block">1 * 2 * 3</pre></p>"`;
+
+exports[`content-rich > asterisk paris in inline code 1`] = `
+"<p><code>1 * 2 * 3</code></p>
+"
+`;
+
 exports[`content-rich > block with backticks 1`] = `"<p><pre class="code-block">[(\`number string) (\`tag string)]</pre></p>"`;
 
 exports[`content-rich > block with injected html, with a known language 1`] = `

tests/nuxt/content-rich.test.ts

@@ -186,6 +186,16 @@ describe('content-rich', () => {
     `)
     expect(formatted).toMatchSnapshot()
   })
+
+  it ('asterisk paris in inline code', async () => {
+    const { formatted } = await render('<p>`1 * 2 * 3`</p>')
+    expect(formatted).toMatchSnapshot()
+  })
+
+  it ('asterisk paris in code block', async () => {
+    const { formatted } = await render('<p>```<br />1 * 2 * 3<br />```</p>')
+    expect(formatted).toMatchSnapshot()
+  })
 })
 
 describe('editor', () => {