fix(ui): force wasm highlighter for markdown code blocks (#17373)

1 files changed, 10 insertions, 2 deletions

diff --git a/packages/ui/src/context/marked.tsx b/packages/ui/src/context/marked.tsx
index c5ff3c767..46f4993ba 100644
--- a/packages/ui/src/context/marked.tsx
+++ b/packages/ui/src/context/marked.tsx
@@ -428,7 +428,11 @@ async function highlightCodeBlocks(html: string): Promise<string> {
   const matches = [...html.matchAll(codeBlockRegex)]
   if (matches.length === 0) return html
 
-  const highlighter = await getSharedHighlighter({ themes: ["OpenCode"], langs: [] })
+  const highlighter = await getSharedHighlighter({
+    themes: ["OpenCode"],
+    langs: [],
+    preferredHighlighter: "shiki-wasm",
+  })
 
   let result = html
   for (const match of matches) {
@@ -479,7 +483,11 @@ export const { use: useMarked, provider: MarkedProvider } = createSimpleContext(
       }),
       markedShiki({
         async highlight(code, lang) {
-          const highlighter = await getSharedHighlighter({ themes: ["OpenCode"], langs: [] })
+          const highlighter = await getSharedHighlighter({
+            themes: ["OpenCode"],
+            langs: [],
+            preferredHighlighter: "shiki-wasm",
+          })
           if (!(lang in bundledLanguages)) {
             lang = "text"
           }