fix: add markdown rendering error handling and debug logs
This commit is contained in:
parent
8a2b5a0d5d
commit
29f1e172b4
@ -6,9 +6,9 @@ const indexHTML = `<!DOCTYPE html>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>orca.agent</title>
|
||||
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js" onload="console.log('marked loaded')" onerror="console.error('marked failed to load')"></script>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github-dark.min.css">
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js" onload="console.log('hljs loaded')" onerror="console.error('hljs failed to load')"></script>
|
||||
<style>
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
body {
|
||||
@ -368,19 +368,50 @@ const indexHTML = `<!DOCTYPE html>
|
||||
let currentAssistantDiv = null;
|
||||
let eventSource = null;
|
||||
let currentContent = '';
|
||||
let mdAvailable = false;
|
||||
|
||||
function initMarked() {
|
||||
if (typeof marked === 'undefined') {
|
||||
console.error('marked.js not loaded, using plain text fallback');
|
||||
mdAvailable = false;
|
||||
return;
|
||||
}
|
||||
mdAvailable = true;
|
||||
try {
|
||||
marked.setOptions({
|
||||
highlight: function(code, lang) {
|
||||
if (lang && hljs.getLanguage(lang)) {
|
||||
try {
|
||||
return hljs.highlight(code, { language: lang }).value;
|
||||
} catch (e) {}
|
||||
if (typeof hljs !== 'undefined' && lang && hljs.getLanguage(lang)) {
|
||||
try { return hljs.highlight(code, { language: lang }).value; } catch (e) {}
|
||||
}
|
||||
return hljs.highlightAuto(code).value;
|
||||
if (typeof hljs !== 'undefined') {
|
||||
try { return hljs.highlightAuto(code).value; } catch (e) {}
|
||||
}
|
||||
return code;
|
||||
},
|
||||
breaks: true,
|
||||
gfm: true
|
||||
});
|
||||
console.log('marked.js initialized successfully');
|
||||
|
||||
const test = marked.parse('# Hello\n\nThis is **bold** text.');
|
||||
console.log('Markdown test result:', test.substring(0, 100));
|
||||
} catch (e) {
|
||||
console.error('Failed to initialize marked:', e);
|
||||
mdAvailable = false;
|
||||
}
|
||||
}
|
||||
|
||||
initMarked();
|
||||
|
||||
function renderMarkdown(text) {
|
||||
if (!mdAvailable || !text) return text;
|
||||
try {
|
||||
return marked.parse(text);
|
||||
} catch (e) {
|
||||
console.error('Markdown parse error:', e);
|
||||
return text;
|
||||
}
|
||||
}
|
||||
|
||||
function connectSSE() {
|
||||
eventSource = new EventSource('/api/stream');
|
||||
@ -390,11 +421,14 @@ const indexHTML = `<!DOCTYPE html>
|
||||
});
|
||||
|
||||
eventSource.onmessage = function(e) {
|
||||
console.log('SSE data received:', e.data.substring(0, 50) + '...');
|
||||
if (currentAssistantDiv) {
|
||||
currentContent += e.data;
|
||||
const content = currentAssistantDiv.querySelector('.message-content');
|
||||
content.innerHTML = marked.parse(currentContent);
|
||||
content.innerHTML = renderMarkdown(currentContent);
|
||||
if (typeof hljs !== 'undefined') {
|
||||
hljs.highlightAll();
|
||||
}
|
||||
chatBox.scrollTop = chatBox.scrollHeight;
|
||||
}
|
||||
};
|
||||
@ -429,7 +463,7 @@ const indexHTML = `<!DOCTYPE html>
|
||||
if (role === 'user') {
|
||||
text.textContent = content;
|
||||
} else {
|
||||
text.innerHTML = marked.parse(content);
|
||||
text.innerHTML = renderMarkdown(content);
|
||||
}
|
||||
|
||||
div.appendChild(label);
|
||||
@ -437,7 +471,7 @@ const indexHTML = `<!DOCTYPE html>
|
||||
chatBox.appendChild(div);
|
||||
chatBox.scrollTop = chatBox.scrollHeight;
|
||||
|
||||
if (role !== 'user') {
|
||||
if (role !== 'user' && typeof hljs !== 'undefined') {
|
||||
hljs.highlightAll();
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user