teutat3s/elk
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

fix: escape backticks within codeblocks

Browse source 
resolves https://github.com/elk-zone/elk/issues/970
This commit is contained in:
Daniel Roe 2023-01-11 23:54:45 +00:00
parent a12d3d09b1
commit 8da4a8e78a
3 changed files with 11 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
composables/content-parse.ts
View file

@ -55,7 +55,10 @@ export function parseMastodonHTML(
// Handle code blocks // Handle code blocks
html = html html = html
.replace(/>(```|~~~)(\w*)([\s\S]+?)\1/g, (_1, _2, lang: string, raw: string) => { .replace(/>(```|~~~)(\w*)([\s\S]+?)\1/g, (_1, _2, lang: string, raw: string) => {
const code = htmlToText(raw).replace(/</g, '&lt;').replace(/>/g, '&gt;') const code = htmlToText(raw)
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;')
.replace(/`/, '&#96;')
const classes = lang ? ` class="language-${lang}"` : '' const classes = lang ? ` class="language-${lang}"` : ''
return `><pre><code${classes}>${code}</code></pre>` return `><pre><code${classes}>${code}</code></pre>`
}) })

2
tests/__snapshots__/content-rich.test.ts.snap
View file

@ -1,5 +1,7 @@
// Vitest Snapshot v1 // Vitest Snapshot v1
exports[`content-rich > block with backticks 1`] = `"<p><pre>[(\`number string) (\`tag string)]</pre></p>"`;
exports[`content-rich > code frame 1`] = ` exports[`content-rich > code frame 1`] = `
"<p>Testing code block</p><p></p><p><pre lang=\\"ts\\">import { useMouse, usePreferredDark } from &#39;@vueuse/core&#39; "<p>Testing code block</p><p></p><p><pre lang=\\"ts\\">import { useMouse, usePreferredDark } from &#39;@vueuse/core&#39;
// tracks mouse position // tracks mouse position

5
tests/content-rich.test.ts
View file

@ -20,6 +20,11 @@ describe('content-rich', () => {
expect(formatted).toMatchSnapshot() expect(formatted).toMatchSnapshot()
}) })
it ('block with backticks', async () => {
const { formatted } = await render('<p>```<br />[(`number string) (`tag string)]<br />```</p>')
expect(formatted).toMatchSnapshot()
})
it('group mention', async () => { it('group mention', async () => {
const { formatted } = await render('<p><span class="h-card"><a href="https://lemmy.ml/c/pilipinas" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>pilipinas</span></a></span></p>', undefined, [{ id: '', username: 'pilipinas', url: 'https://lemmy.ml/c/pilipinas', acct: 'pilipinas@lemmy.ml' }]) const { formatted } = await render('<p><span class="h-card"><a href="https://lemmy.ml/c/pilipinas" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>pilipinas</span></a></span></p>', undefined, [{ id: '', username: 'pilipinas', url: 'https://lemmy.ml/c/pilipinas', acct: 'pilipinas@lemmy.ml' }])
expect(formatted).toMatchSnapshot('html') expect(formatted).toMatchSnapshot('html')