feat: add LTR/RTL in hashtags and mentions support (#2541)
Co-authored-by: Daniel Roe <daniel@roe.dev>
This commit is contained in:
parent
b016320eaf
commit
3adf92ea56
|
@ -39,8 +39,10 @@ function go(evt: MouseEvent | KeyboardEvent) {
|
||||||
<div>
|
<div>
|
||||||
<h4 flex items-center text-size-base leading-normal font-medium line-clamp-1 break-all ws-pre-wrap>
|
<h4 flex items-center text-size-base leading-normal font-medium line-clamp-1 break-all ws-pre-wrap>
|
||||||
<TagActionButton :tag="tag" />
|
<TagActionButton :tag="tag" />
|
||||||
<span>#</span>
|
<bdi>
|
||||||
<span hover:underline>{{ tag.name }}</span>
|
<span>#</span>
|
||||||
|
<span hover:underline>{{ tag.name }}</span>
|
||||||
|
</bdi>
|
||||||
</h4>
|
</h4>
|
||||||
<CommonTrending v-if="tag.history" :history="tag.history" text-sm text-secondary line-clamp-1 ws-pre-wrap break-all />
|
<CommonTrending v-if="tag.history" :history="tag.history" text-sm text-secondary line-clamp-1 ws-pre-wrap break-all />
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -72,6 +72,8 @@ const sanitizer = sanitize({
|
||||||
/**
|
/**
|
||||||
* Parse raw HTML form Mastodon server to AST,
|
* Parse raw HTML form Mastodon server to AST,
|
||||||
* with interop of custom emojis and inline Markdown syntax
|
* with interop of custom emojis and inline Markdown syntax
|
||||||
|
* @param html The content to parse
|
||||||
|
* @param options The parsing options
|
||||||
*/
|
*/
|
||||||
export function parseMastodonHTML(
|
export function parseMastodonHTML(
|
||||||
html: string,
|
html: string,
|
||||||
|
@ -140,6 +142,8 @@ export function parseMastodonHTML(
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Converts raw HTML form Mastodon server to HTML for Tiptap editor
|
* Converts raw HTML form Mastodon server to HTML for Tiptap editor
|
||||||
|
* @param html The content to parse
|
||||||
|
* @param customEmojis The custom emojis to use
|
||||||
*/
|
*/
|
||||||
export function convertMastodonHTML(html: string, customEmojis: Record<string, mastodon.v1.CustomEmoji> = {}) {
|
export function convertMastodonHTML(html: string, customEmojis: Record<string, mastodon.v1.CustomEmoji> = {}) {
|
||||||
const tree = parseMastodonHTML(html, {
|
const tree = parseMastodonHTML(html, {
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { TEXT_NODE } from 'ultrahtml'
|
import { ELEMENT_NODE, TEXT_NODE } from 'ultrahtml'
|
||||||
import type { Node } from 'ultrahtml'
|
import type { ElementNode, 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'
|
||||||
|
@ -98,6 +98,23 @@ function treeToVNode(
|
||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function addBdiNode(node: Node) {
|
||||||
|
if (node.children.length === 1 && node.children[0].type === ELEMENT_NODE && node.children[0].name === 'bdi')
|
||||||
|
return
|
||||||
|
|
||||||
|
const children = node.children.splice(0, node.children.length)
|
||||||
|
const bdi = {
|
||||||
|
name: 'bdi',
|
||||||
|
parent: node,
|
||||||
|
loc: node.loc,
|
||||||
|
type: ELEMENT_NODE,
|
||||||
|
attributes: {},
|
||||||
|
children,
|
||||||
|
} satisfies ElementNode
|
||||||
|
children.forEach((n: Node) => n.parent = bdi)
|
||||||
|
node.children.push(bdi)
|
||||||
|
}
|
||||||
|
|
||||||
function handleMention(el: Node) {
|
function handleMention(el: Node) {
|
||||||
// Redirect mentions to the user page
|
// Redirect mentions to the user page
|
||||||
if (el.name === 'a' && el.attributes.class?.includes('mention')) {
|
if (el.name === 'a' && el.attributes.class?.includes('mention')) {
|
||||||
|
@ -108,11 +125,13 @@ function handleMention(el: Node) {
|
||||||
const [, server, username] = matchUser
|
const [, server, username] = matchUser
|
||||||
const handle = `${username}@${server.replace(/(.+\.)(.+\..+)/, '$2')}`
|
const handle = `${username}@${server.replace(/(.+\.)(.+\..+)/, '$2')}`
|
||||||
el.attributes.href = `/${server}/@${username}`
|
el.attributes.href = `/${server}/@${username}`
|
||||||
|
addBdiNode(el)
|
||||||
return h(AccountHoverWrapper, { handle, class: 'inline-block' }, () => nodeToVNode(el))
|
return h(AccountHoverWrapper, { handle, class: 'inline-block' }, () => nodeToVNode(el))
|
||||||
}
|
}
|
||||||
const matchTag = href.match(TagLinkRE)
|
const matchTag = href.match(TagLinkRE)
|
||||||
if (matchTag) {
|
if (matchTag) {
|
||||||
const [, , name] = matchTag
|
const [, , name] = matchTag
|
||||||
|
addBdiNode(el)
|
||||||
el.attributes.href = `/${currentServer.value}/tags/${name}`
|
el.attributes.href = `/${currentServer.value}/tags/${name}`
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -28,7 +28,7 @@ onReactivated(() => {
|
||||||
<template>
|
<template>
|
||||||
<MainContent back>
|
<MainContent back>
|
||||||
<template #title>
|
<template #title>
|
||||||
<span text-lg font-bold>#{{ tagName }}</span>
|
<bdi text-lg font-bold>#{{ tagName }}</bdi>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template #actions>
|
<template #actions>
|
||||||
|
|
|
@ -44,8 +44,9 @@ exports[`content-rich > code frame 2 1`] = `
|
||||||
class="u-url mention"
|
class="u-url mention"
|
||||||
rel="nofollow noopener noreferrer"
|
rel="nofollow noopener noreferrer"
|
||||||
to="/webtoo.ls/@antfu"
|
to="/webtoo.ls/@antfu"
|
||||||
></a
|
><bdi>@<span>antfu</span></bdi></a
|
||||||
></span>
|
></span
|
||||||
|
>
|
||||||
Testing<br />
|
Testing<br />
|
||||||
<pre class="code-block">const a = hello</pre>
|
<pre class="code-block">const a = hello</pre>
|
||||||
</p>
|
</p>
|
||||||
|
@ -56,6 +57,62 @@ exports[`content-rich > code frame empty 1`] = `"<p><pre class="code-block"></pr
|
||||||
|
|
||||||
exports[`content-rich > code frame no lang 1`] = `"<p><pre class="code-block">hello world</pre><br>no lang</p>"`;
|
exports[`content-rich > code frame no lang 1`] = `"<p><pre class="code-block">hello world</pre><br>no lang</p>"`;
|
||||||
|
|
||||||
|
exports[`content-rich > collapse mentions 1`] = `
|
||||||
|
"<p>
|
||||||
|
<span class="h-card"
|
||||||
|
><a
|
||||||
|
class="u-url mention"
|
||||||
|
rel="nofollow noopener noreferrer"
|
||||||
|
to="/m.webtoo.ls/@elk"
|
||||||
|
><bdi>@<span>elk</span></bdi></a
|
||||||
|
></span
|
||||||
|
>
|
||||||
|
<span class="h-card"
|
||||||
|
><a
|
||||||
|
class="u-url mention"
|
||||||
|
rel="nofollow noopener noreferrer"
|
||||||
|
to="/m.webtoo.ls/@elk"
|
||||||
|
><bdi>@<span>elk</span></bdi></a
|
||||||
|
></span
|
||||||
|
>
|
||||||
|
content
|
||||||
|
<span class="h-card"
|
||||||
|
><a
|
||||||
|
class="u-url mention"
|
||||||
|
rel="nofollow noopener noreferrer"
|
||||||
|
to="/m.webtoo.ls/@antfu"
|
||||||
|
><bdi>@<span>antfu</span></bdi></a
|
||||||
|
></span
|
||||||
|
>
|
||||||
|
<span class="h-card"
|
||||||
|
><a
|
||||||
|
class="u-url mention"
|
||||||
|
rel="nofollow noopener noreferrer"
|
||||||
|
to="/mastodon.roe.dev/@daniel"
|
||||||
|
><bdi>@<span>daniel</span></bdi></a
|
||||||
|
></span
|
||||||
|
>
|
||||||
|
<span class="h-card"
|
||||||
|
><a
|
||||||
|
class="u-url mention"
|
||||||
|
rel="nofollow noopener noreferrer"
|
||||||
|
to="/m.webtoo.ls/@sxzz"
|
||||||
|
><bdi>@<span>sxzz</span></bdi></a
|
||||||
|
></span
|
||||||
|
>
|
||||||
|
<span class="h-card"
|
||||||
|
><a
|
||||||
|
class="u-url mention"
|
||||||
|
rel="nofollow noopener noreferrer"
|
||||||
|
to="/m.webtoo.ls/@patak"
|
||||||
|
><bdi>@<span>patak</span></bdi></a
|
||||||
|
></span
|
||||||
|
>
|
||||||
|
content
|
||||||
|
</p>
|
||||||
|
"
|
||||||
|
`;
|
||||||
|
|
||||||
exports[`content-rich > custom emoji 1`] = `
|
exports[`content-rich > custom emoji 1`] = `
|
||||||
"Daniel Roe
|
"Daniel Roe
|
||||||
<picture class="custom-emoji" alt=":nuxt:" data-emoji-id="nuxt" title="nuxt"
|
<picture class="custom-emoji" alt=":nuxt:" data-emoji-id="nuxt" title="nuxt"
|
||||||
|
@ -81,8 +138,13 @@ exports[`content-rich > group mention > html 1`] = `
|
||||||
class="u-url mention"
|
class="u-url mention"
|
||||||
rel="nofollow noopener noreferrer"
|
rel="nofollow noopener noreferrer"
|
||||||
to="/m.webtoo.ls/@pilipinas@lemmy.ml"
|
to="/m.webtoo.ls/@pilipinas@lemmy.ml"
|
||||||
></a
|
><bdi
|
||||||
></span>
|
><span data-type="mention" data-id="pilipinas@lemmy.ml"
|
||||||
|
>@pilipinas</span
|
||||||
|
></bdi
|
||||||
|
></a
|
||||||
|
></span
|
||||||
|
>
|
||||||
</p>
|
</p>
|
||||||
"
|
"
|
||||||
`;
|
`;
|
||||||
|
@ -115,6 +177,39 @@ exports[`content-rich > handles html within code blocks 1`] = `
|
||||||
"
|
"
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
exports[`content-rich > hashtag adds bdi 1`] = `
|
||||||
|
"<p>
|
||||||
|
Testing bdi is added
|
||||||
|
<a
|
||||||
|
class="mention hashtag"
|
||||||
|
rel="nofollow noopener noreferrer"
|
||||||
|
to="/m.webtoo.ls/tags/turkey"
|
||||||
|
><bdi>#<span>turkey</span></bdi></a
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
<p></p>
|
||||||
|
"
|
||||||
|
`;
|
||||||
|
|
||||||
|
exports[`content-rich > hashtag doesn't add 2 bdi 1`] = `
|
||||||
|
"<p>
|
||||||
|
Testing bdi not added
|
||||||
|
<a
|
||||||
|
class="mention hashtag"
|
||||||
|
rel="nofollow noopener noreferrer"
|
||||||
|
to="/m.webtoo.ls/tags/turkey"
|
||||||
|
><bdi></bdi
|
||||||
|
></a>
|
||||||
|
</p>
|
||||||
|
<p></p>
|
||||||
|
"
|
||||||
|
`;
|
||||||
|
|
||||||
|
exports[`content-rich > hides collapsed mentions 1`] = `
|
||||||
|
"<p>content</p>
|
||||||
|
"
|
||||||
|
`;
|
||||||
|
|
||||||
exports[`content-rich > inline code with link 1`] = `
|
exports[`content-rich > inline code with link 1`] = `
|
||||||
"<p>
|
"<p>
|
||||||
Inline code with link:
|
Inline code with link:
|
||||||
|
@ -139,8 +234,9 @@ exports[`content-rich > link + mention 1`] = `
|
||||||
class="u-url mention"
|
class="u-url mention"
|
||||||
rel="nofollow noopener noreferrer"
|
rel="nofollow noopener noreferrer"
|
||||||
to="/webtoo.ls/@vitest"
|
to="/webtoo.ls/@vitest"
|
||||||
></a
|
><bdi>@<span>vitest</span></bdi></a
|
||||||
></span>
|
></span
|
||||||
|
>
|
||||||
(migrated from chai+mocha)
|
(migrated from chai+mocha)
|
||||||
<a
|
<a
|
||||||
href="https://github.com/ayoayco/astro-reactive-library/pull/203"
|
href="https://github.com/ayoayco/astro-reactive-library/pull/203"
|
||||||
|
@ -159,6 +255,53 @@ exports[`content-rich > plain text 1`] = `
|
||||||
"
|
"
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
exports[`content-rich > shows some collapsed mentions grouped 1`] = `
|
||||||
|
"<p>
|
||||||
|
<mention-group
|
||||||
|
><span class="h-card"
|
||||||
|
><a
|
||||||
|
class="u-url mention"
|
||||||
|
rel="nofollow noopener noreferrer"
|
||||||
|
to="/m.webtoo.ls/@antfu"
|
||||||
|
><bdi>@<span>antfu</span></bdi></a
|
||||||
|
></span
|
||||||
|
>
|
||||||
|
<span class="h-card"
|
||||||
|
><a
|
||||||
|
class="u-url mention"
|
||||||
|
rel="nofollow noopener noreferrer"
|
||||||
|
to="/m.webtoo.ls/@patak"
|
||||||
|
><bdi>@<span>patak</span></bdi></a
|
||||||
|
></span
|
||||||
|
>
|
||||||
|
<span class="h-card"
|
||||||
|
><a
|
||||||
|
class="u-url mention"
|
||||||
|
rel="nofollow noopener noreferrer"
|
||||||
|
to="/m.webtoo.ls/@sxzz"
|
||||||
|
><bdi>@<span>sxzz</span></bdi></a
|
||||||
|
></span
|
||||||
|
></mention-group
|
||||||
|
>content
|
||||||
|
</p>
|
||||||
|
"
|
||||||
|
`;
|
||||||
|
|
||||||
|
exports[`content-rich > shows some collapsed mentions inline 1`] = `
|
||||||
|
"<p>
|
||||||
|
<span class="h-card"
|
||||||
|
><a
|
||||||
|
class="u-url mention"
|
||||||
|
rel="nofollow noopener noreferrer"
|
||||||
|
to="/m.webtoo.ls/@antfu"
|
||||||
|
><bdi>@<span>antfu</span></bdi></a
|
||||||
|
></span
|
||||||
|
>
|
||||||
|
content
|
||||||
|
</p>
|
||||||
|
"
|
||||||
|
`;
|
||||||
|
|
||||||
exports[`editor > transform mentions 1`] = `
|
exports[`editor > transform mentions 1`] = `
|
||||||
"
|
"
|
||||||
@elk Hello"
|
@elk Hello"
|
||||||
|
|
|
@ -89,55 +89,7 @@ describe('content-rich', () => {
|
||||||
const { formatted } = await render('<p><span class="h-card"><a href="https://m.webtoo.ls/@elk" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>elk</span></a></span> <span class="h-card"><a href="https://m.webtoo.ls/@elk" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>elk</span></a></span> content <span class="h-card"><a href="https://m.webtoo.ls/@antfu" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>antfu</span></a></span> <span class="h-card"><a href="https://mastodon.roe.dev/@daniel" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>daniel</span></a></span> <span class="h-card"><a href="https://m.webtoo.ls/@sxzz" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>sxzz</span></a></span> <span class="h-card"><a href="https://m.webtoo.ls/@patak" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>patak</span></a></span> content</p>', {
|
const { formatted } = await render('<p><span class="h-card"><a href="https://m.webtoo.ls/@elk" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>elk</span></a></span> <span class="h-card"><a href="https://m.webtoo.ls/@elk" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>elk</span></a></span> content <span class="h-card"><a href="https://m.webtoo.ls/@antfu" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>antfu</span></a></span> <span class="h-card"><a href="https://mastodon.roe.dev/@daniel" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>daniel</span></a></span> <span class="h-card"><a href="https://m.webtoo.ls/@sxzz" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>sxzz</span></a></span> <span class="h-card"><a href="https://m.webtoo.ls/@patak" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>patak</span></a></span> content</p>', {
|
||||||
collapseMentionLink: true,
|
collapseMentionLink: true,
|
||||||
})
|
})
|
||||||
expect(formatted).toMatchInlineSnapshot(`
|
expect(formatted).toMatchSnapshot()
|
||||||
"<p>
|
|
||||||
<span class="h-card"
|
|
||||||
><a
|
|
||||||
class="u-url mention"
|
|
||||||
rel="nofollow noopener noreferrer"
|
|
||||||
to="/m.webtoo.ls/@elk"
|
|
||||||
></a
|
|
||||||
></span>
|
|
||||||
<span class="h-card"
|
|
||||||
><a
|
|
||||||
class="u-url mention"
|
|
||||||
rel="nofollow noopener noreferrer"
|
|
||||||
to="/m.webtoo.ls/@elk"
|
|
||||||
></a
|
|
||||||
></span>
|
|
||||||
content
|
|
||||||
<span class="h-card"
|
|
||||||
><a
|
|
||||||
class="u-url mention"
|
|
||||||
rel="nofollow noopener noreferrer"
|
|
||||||
to="/m.webtoo.ls/@antfu"
|
|
||||||
></a
|
|
||||||
></span>
|
|
||||||
<span class="h-card"
|
|
||||||
><a
|
|
||||||
class="u-url mention"
|
|
||||||
rel="nofollow noopener noreferrer"
|
|
||||||
to="/mastodon.roe.dev/@daniel"
|
|
||||||
></a
|
|
||||||
></span>
|
|
||||||
<span class="h-card"
|
|
||||||
><a
|
|
||||||
class="u-url mention"
|
|
||||||
rel="nofollow noopener noreferrer"
|
|
||||||
to="/m.webtoo.ls/@sxzz"
|
|
||||||
></a
|
|
||||||
></span>
|
|
||||||
<span class="h-card"
|
|
||||||
><a
|
|
||||||
class="u-url mention"
|
|
||||||
rel="nofollow noopener noreferrer"
|
|
||||||
to="/m.webtoo.ls/@patak"
|
|
||||||
></a
|
|
||||||
></span>
|
|
||||||
content
|
|
||||||
</p>
|
|
||||||
"
|
|
||||||
`)
|
|
||||||
})
|
})
|
||||||
|
|
||||||
it('hides collapsed mentions', async () => {
|
it('hides collapsed mentions', async () => {
|
||||||
|
@ -145,10 +97,7 @@ describe('content-rich', () => {
|
||||||
collapseMentionLink: true,
|
collapseMentionLink: true,
|
||||||
inReplyToStatus: { account: { acct: 'elk@webtoo.ls' }, mentions: [] as mastodon.v1.StatusMention[] } as mastodon.v1.Status,
|
inReplyToStatus: { account: { acct: 'elk@webtoo.ls' }, mentions: [] as mastodon.v1.StatusMention[] } as mastodon.v1.Status,
|
||||||
})
|
})
|
||||||
expect(formatted).toMatchInlineSnapshot(`
|
expect(formatted).toMatchSnapshot()
|
||||||
"<p>content</p>
|
|
||||||
"
|
|
||||||
`)
|
|
||||||
})
|
})
|
||||||
|
|
||||||
it('shows some collapsed mentions inline', async () => {
|
it('shows some collapsed mentions inline', async () => {
|
||||||
|
@ -156,19 +105,7 @@ describe('content-rich', () => {
|
||||||
collapseMentionLink: true,
|
collapseMentionLink: true,
|
||||||
inReplyToStatus: { account: { acct: 'elk@webtoo.ls' }, mentions: [] as mastodon.v1.StatusMention[] } as mastodon.v1.Status,
|
inReplyToStatus: { account: { acct: 'elk@webtoo.ls' }, mentions: [] as mastodon.v1.StatusMention[] } as mastodon.v1.Status,
|
||||||
})
|
})
|
||||||
expect(formatted).toMatchInlineSnapshot(`
|
expect(formatted).toMatchSnapshot()
|
||||||
"<p>
|
|
||||||
<span class="h-card"
|
|
||||||
><a
|
|
||||||
class="u-url mention"
|
|
||||||
rel="nofollow noopener noreferrer"
|
|
||||||
to="/m.webtoo.ls/@antfu"
|
|
||||||
></a
|
|
||||||
></span>
|
|
||||||
content
|
|
||||||
</p>
|
|
||||||
"
|
|
||||||
`)
|
|
||||||
})
|
})
|
||||||
|
|
||||||
it('shows some collapsed mentions grouped', async () => {
|
it('shows some collapsed mentions grouped', async () => {
|
||||||
|
@ -176,33 +113,7 @@ describe('content-rich', () => {
|
||||||
collapseMentionLink: true,
|
collapseMentionLink: true,
|
||||||
inReplyToStatus: { account: { acct: 'elk@webtoo.ls' }, mentions: [] as mastodon.v1.StatusMention[] } as mastodon.v1.Status,
|
inReplyToStatus: { account: { acct: 'elk@webtoo.ls' }, mentions: [] as mastodon.v1.StatusMention[] } as mastodon.v1.Status,
|
||||||
})
|
})
|
||||||
expect(formatted).toMatchInlineSnapshot(`
|
expect(formatted).toMatchSnapshot()
|
||||||
"<p>
|
|
||||||
<mention-group
|
|
||||||
><span class="h-card"
|
|
||||||
><a
|
|
||||||
class="u-url mention"
|
|
||||||
rel="nofollow noopener noreferrer"
|
|
||||||
to="/m.webtoo.ls/@antfu"
|
|
||||||
></a
|
|
||||||
></span>
|
|
||||||
<span class="h-card"
|
|
||||||
><a
|
|
||||||
class="u-url mention"
|
|
||||||
rel="nofollow noopener noreferrer"
|
|
||||||
to="/m.webtoo.ls/@patak"
|
|
||||||
></a
|
|
||||||
></span>
|
|
||||||
<span class="h-card"
|
|
||||||
><a
|
|
||||||
class="u-url mention"
|
|
||||||
rel="nofollow noopener noreferrer"
|
|
||||||
to="/m.webtoo.ls/@sxzz"
|
|
||||||
></a></span></mention-group
|
|
||||||
>content
|
|
||||||
</p>
|
|
||||||
"
|
|
||||||
`)
|
|
||||||
})
|
})
|
||||||
|
|
||||||
it ('block with injected html, without language', async () => {
|
it ('block with injected html, without language', async () => {
|
||||||
|
@ -237,6 +148,21 @@ describe('content-rich', () => {
|
||||||
`)
|
`)
|
||||||
expect(formatted).toMatchSnapshot()
|
expect(formatted).toMatchSnapshot()
|
||||||
})
|
})
|
||||||
|
|
||||||
|
it ('hashtag adds bdi', async () => {
|
||||||
|
const { formatted } = await render(`
|
||||||
|
<p>Testing bdi is added <a href="https://universeodon.com/tags/turkey" class="mention hashtag" rel="tag">#<span>turkey</span></a></p>
|
||||||
|
`)
|
||||||
|
expect(formatted).toMatchSnapshot()
|
||||||
|
})
|
||||||
|
|
||||||
|
// REVIEW: there is something wrong with this test in the rendered output, missing bdi content, ultrahtml parses it correctly
|
||||||
|
it ('hashtag doesn\'t add 2 bdi', async () => {
|
||||||
|
const { formatted } = await render(`
|
||||||
|
<p>Testing bdi not added <a href="https://universeodon.com/tags/turkey" class="mention hashtag" rel="tag"><bdi>#<span>turkey</span></bdi></a></p>
|
||||||
|
`)
|
||||||
|
expect(formatted).toMatchSnapshot()
|
||||||
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
describe('editor', () => {
|
describe('editor', () => {
|
||||||
|
@ -273,8 +199,10 @@ async function render(content: string, options?: ContentParseOptions) {
|
||||||
vi.mock('vue-router', async () => {
|
vi.mock('vue-router', async () => {
|
||||||
const { defineComponent, h } = await import('vue')
|
const { defineComponent, h } = await import('vue')
|
||||||
return {
|
return {
|
||||||
RouterLink: defineComponent((attrs) => {
|
RouterLink: defineComponent({
|
||||||
return () => h('a', attrs)
|
setup(props, { slots }) {
|
||||||
|
return () => h('a', props, { default: () => slots?.default?.() })
|
||||||
|
},
|
||||||
}),
|
}),
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
Loading…
Reference in a new issue