From e59f5dbb8ff481ecadad59dc8a445c8534da5a49 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Joaqu=C3=ADn=20S=C3=A1nchez?= <userquin@gmail.com>
Date: Fri, 3 Jan 2025 01:52:04 +0100
Subject: [PATCH] fix(rtl): replace ellipsis span anchor content with bdi
(#3123)
---
composables/content-render.ts | 36 +++++++++++++++----
.../__snapshots__/content-rich.test.ts.snap | 2 +-
2 files changed, 31 insertions(+), 7 deletions(-)
diff --git a/composables/content-render.ts b/composables/content-render.ts
index 5e029d07..4062b0a1 100644
--- a/composables/content-render.ts
+++ b/composables/content-render.ts
@@ -60,16 +60,40 @@ export function nodeToVNode(node: Node): VNode | string | null {
}
if ('children' in node) {
- if (node.name === 'a' && (node.attributes.href?.startsWith('/') || node.attributes.href?.startsWith('.'))) {
- node.attributes.to = node.attributes.href
+ if (node.name === 'a') {
+ if (node.attributes.href?.startsWith('/') || node.attributes.href?.startsWith('.')) {
+ node.attributes.to = node.attributes.href
- const { href: _href, target: _target, ...attrs } = node.attributes
+ const { href: _href, target: _target, ...attrs } = node.attributes
+ return h(
+ RouterLink as any,
+ attrs,
+ () => node.children.map(treeToVNode),
+ )
+ }
+
+ // fix #3122
return h(
- RouterLink as any,
- attrs,
- () => node.children.map(treeToVNode),
+ node.name,
+ node.attributes,
+ node.children.map((n: Node) => {
+ // replace span.ellipsis with bdi.ellipsis inside links
+ if (n && n.type === ELEMENT_NODE && n.name !== 'bdi' && n.attributes?.class?.includes('ellipsis')) {
+ const children = n.children.splice(0, n.children.length)
+ const bdi = {
+ ...n,
+ name: 'bdi',
+ children,
+ } satisfies ElementNode
+ children.forEach((n: Node) => n.parent = bdi)
+ return treeToVNode(bdi)
+ }
+
+ return treeToVNode(n)
+ }),
)
}
+
return h(
node.name,
node.attributes,
diff --git a/tests/nuxt/__snapshots__/content-rich.test.ts.snap b/tests/nuxt/__snapshots__/content-rich.test.ts.snap
index 74f93d14..4e99489c 100644
--- a/tests/nuxt/__snapshots__/content-rich.test.ts.snap
+++ b/tests/nuxt/__snapshots__/content-rich.test.ts.snap
@@ -257,7 +257,7 @@ exports[`content-rich > link + mention 1`] = `
rel="nofollow noopener noreferrer"
target="_blank"
><span class="invisible">https://</span
- ><span class="ellipsis">github.com/ayoayco/astro-react</span
+ ><bdi class="ellipsis">github.com/ayoayco/astro-react</bdi
><span class="invisible">ive-library/pull/203</span></a
>
</p>