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

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

View file

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

View file

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

View file

@ -58,6 +58,13 @@ exports[`html-parse > empty > html 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 > text 1`] = `

View file

@ -52,6 +52,12 @@ describe('html-parse', () => {
expect(formatted).toMatchSnapshot('html')
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>) {