elk/tests/html-parse.test.ts

88 lines
3.6 KiB
TypeScript
Raw Normal View History

2023-01-08 06:21:09 +00:00
import type { mastodon } from 'masto'
import { describe, expect, it } from 'vitest'
import { format } from 'prettier'
import { render as renderTree } from 'ultrahtml'
describe('html-parse', () => {
it('empty', async () => {
2022-11-30 06:50:47 +00:00
const { formatted, serializedText } = await render('')
expect(formatted).toMatchSnapshot('html')
expect(serializedText).toMatchSnapshot('text')
})
it('link + mention', async () => {
// https://fosstodon.org/@ayo/109383002937620723
const { formatted, serializedText } = await render('<p>Happy 🤗 were now using <span class="h-card"><a href="https://webtoo.ls/@vitest" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>vitest</span></a></span> (migrated from chai+mocha) <a href="https://github.com/ayoayco/astro-reactive-library/pull/203" rel="nofollow noopener noreferrer" target="_blank"><span class="invisible">https://</span><span class="ellipsis">github.com/ayoayco/astro-react</span><span class="invisible">ive-library/pull/203</span></a></p>')
2022-11-30 06:50:47 +00:00
expect(formatted).toMatchSnapshot('html')
expect(serializedText).toMatchSnapshot('text')
})
it('custom emoji', async () => {
2022-11-30 06:50:47 +00:00
const { formatted, serializedText } = await render('Daniel Roe :nuxt:', {
nuxt: {
shortcode: 'nuxt',
url: 'https://media.webtoo.ls/custom_emojis/images/000/000/366/original/73330dfc9dda4078.png',
staticUrl: 'https://media.webtoo.ls/custom_emojis/images/000/000/366/original/73330dfc9dda4078.png',
visibleInPicker: true,
},
})
2022-11-30 06:50:47 +00:00
expect(formatted).toMatchSnapshot('html')
expect(serializedText).toMatchSnapshot('text')
})
2022-12-27 20:42:58 +00:00
it('emojis', async () => {
const { formatted, serializedText } = await render('🇫🇷 👨‍👩‍👦 👩‍🚒🧑🏽‍🚀')
expect(formatted).toMatchSnapshot('html')
expect(serializedText).toMatchSnapshot('text')
})
it('code frame', async () => {
// https://webtoo.ls/@antfu/109396489827394721
2022-11-30 06:50:47 +00:00
const { formatted, serializedText } = await render('<p>Testing code block</p><p>```ts<br />import { useMouse, usePreferredDark } from &#39;@vueuse/core&#39;</p><p>// tracks mouse position<br />const { x, y } = useMouse()</p><p>// is the user prefers dark theme<br />const isDark = usePreferredDark()<br />```</p>')
expect(formatted).toMatchSnapshot('html')
expect(serializedText).toMatchSnapshot('text')
})
it('code frame 2', async () => {
const { formatted, serializedText } = await render('<p><span class=\"h-card\"><a href=\"https://webtoo.ls/@antfu\" class=\"u-url mention\">@<span>antfu</span></a></span> Testing<br />```ts<br />const a = hello<br />```</p>')
2022-11-30 06:50:47 +00:00
expect(formatted).toMatchSnapshot('html')
expect(serializedText).toMatchSnapshot('text')
})
it('inline markdown', async () => {
2022-11-30 06:50:47 +00:00
const { formatted, serializedText } = await render('<p>text `code` **bold** *italic* ~~del~~</p><p>```js<br />code block<br />```</p>')
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')
})
})
2023-01-08 06:21:09 +00:00
async function render(input: string, emojis?: Record<string, mastodon.v1.CustomEmoji>) {
2023-01-07 09:31:48 +00:00
const tree = parseMastodonHTML(input, { emojis })
const html = await renderTree(tree)
let formatted = ''
const serializedText = treeToText(tree).trim()
try {
formatted = format(html, {
parser: 'html',
})
}
catch (e) {
formatted = html
}
return {
2022-11-30 06:50:47 +00:00
serializedText,
input,
tree,
html,
formatted,
}
}