mirrors/elk
1
0
Fork 0
mirror of https://github.com/elk-zone/elk.git synced 2024-11-28 13:28:52 +03:00
Code Issues Projects Releases Packages Wiki Activity

fix: don't decode HTML entities (&foo;) until rendering (#465)

Browse source
This commit is contained in:
Robert van Hoesel 2022-12-20 01:23:06 +01:00 committed by GitHub
parent 9a7c37db24
commit f8ebc0e99a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 18 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
composables/content-parse.ts
View file

@ -3,7 +3,7 @@ import type { Node } from 'ultrahtml'
import { TEXT_NODE, parse, render, walkSync } from 'ultrahtml' import { TEXT_NODE, parse, render, walkSync } from 'ultrahtml'
const decoder = process.client ? document.createElement('textarea') : null as any as HTMLTextAreaElement const decoder = process.client ? document.createElement('textarea') : null as any as HTMLTextAreaElement
function decode(text: string) { export function decodeHtml(text: string) {
decoder.innerHTML = text decoder.innerHTML = text
return decoder.value return decoder.value
} }
@ -40,7 +40,6 @@ export function parseMastodonHTML(html: string, customEmojis: Record<string, Emo
[/\*(.*?)\*/g, '<em>$1</em>'], [/\*(.*?)\*/g, '<em>$1</em>'],
[/~~(.*?)~~/g, '<del>$1</del>'], [/~~(.*?)~~/g, '<del>$1</del>'],
[/`([^`]+?)`/g, '<code>$1</code>'], [/`([^`]+?)`/g, '<code>$1</code>'],
[/&[^;]+;/g, (val: string) => decode(val)],
] as any ] as any
for (const [re, replacement] of replacements) { for (const [re, replacement] of replacements) {
@ -77,7 +76,7 @@ export function treeToText(input: Node): string {
let post = '' let post = ''
if (input.type === TEXT_NODE) if (input.type === TEXT_NODE)
return input.value return decodeHtml(input.value)
if (input.name === 'br') if (input.name === 'br')
return '\n' return '\n'

5
composables/content-render.ts
View file

@ -4,7 +4,7 @@ import type { Node } from 'ultrahtml'
import { Fragment, h, isVNode } from 'vue' import { Fragment, h, isVNode } from 'vue'
import type { VNode } from 'vue' import type { VNode } from 'vue'
import { RouterLink } from 'vue-router' import { RouterLink } from 'vue-router'
import { parseMastodonHTML } from './content-parse' import { decodeHtml, parseMastodonHTML } from './content-parse'
import ContentCode from '~/components/content/ContentCode.vue' import ContentCode from '~/components/content/ContentCode.vue'
import AccountHoverWrapper from '~/components/account/AccountHoverWrapper.vue' import AccountHoverWrapper from '~/components/account/AccountHoverWrapper.vue'
@ -45,11 +45,12 @@ export function nodeToVNode(node: Node): VNode | string | null {
} }
return null return null
} }
function treeToVNode( function treeToVNode(
input: Node, input: Node,
): VNode | string | null { ): VNode | string | null {
if (input.type === TEXT_NODE) if (input.type === TEXT_NODE)
return input.value as string return decodeHtml(input.value)
if ('children' in input) { if ('children' in input) {
const node = handleNode(input) const node = handleNode(input)

7
tests/__snapshots__/html-parse.test.ts.snap
View file

@ -58,6 +58,13 @@ exports[`html-parse > empty > html 1`] = `""`;
exports[`html-parse > empty > text 1`] = `""`; exports[`html-parse > empty > text 1`] = `""`;
exports[`html-parse > html entities > html 1`] = `
"<p>Hello &lt;World /&gt;.</p>
"
`;
exports[`html-parse > html entities > text 1`] = `"Hello <World />."`;
exports[`html-parse > inline markdown > html 1`] = `"<p>text <code>code</code> <b>bold</b> <em>italic</em> <del>del</del></p><p><pre><code class=\\"language-js\\">code block</code></pre></p>"`; exports[`html-parse > inline markdown > html 1`] = `"<p>text <code>code</code> <b>bold</b> <em>italic</em> <del>del</del></p><p><pre><code class=\\"language-js\\">code block</code></pre></p>"`;
exports[`html-parse > inline markdown > text 1`] = ` exports[`html-parse > inline markdown > text 1`] = `

6
tests/html-parse.test.ts
View file

@ -52,6 +52,12 @@ describe('html-parse', () => {
expect(formatted).toMatchSnapshot('html') expect(formatted).toMatchSnapshot('html')
expect(serializedText).toMatchSnapshot('text') expect(serializedText).toMatchSnapshot('text')
}) })
it('html entities', async () => {
const { formatted, serializedText } = await render('<p>Hello &lt;World /&gt;.</p>')
expect(formatted).toMatchSnapshot('html')
expect(serializedText).toMatchSnapshot('text')
})
}) })
async function render(input: string, emojis?: Record<string, Emoji>) { async function render(input: string, emojis?: Record<string, Emoji>) {