chore(diagnostics): add logging to _renderPreview to trace markdown rendering

This will help identify whether the issue is:
1. marked.parse returning a Promise instead of string
2. DOMPurify.sanitize failing
3. The preview element not existing
4. Libraries not being loaded

Amit Haridas
This commit is contained in:
2026-05-25 00:32:27 +05:30
parent cfaafc07b2
commit c982b3e90f
+9
View File
@@ -682,17 +682,26 @@ class TabManager {
_renderPreview(tabId) { _renderPreview(tabId) {
const tab = this.tabs.get(tabId); const tab = this.tabs.get(tabId);
const preview = document.getElementById(`preview-${tabId}`); const preview = document.getElementById(`preview-${tabId}`);
console.log('[_renderPreview] tabId:', tabId, 'tab exists:', !!tab, 'preview exists:', !!preview, 'content length:', tab?.content?.length);
if (!tab || !preview) return; if (!tab || !preview) return;
try { try {
// Check if libraries are available // Check if libraries are available
if (!marked || !DOMPurify) { if (!marked || !DOMPurify) {
console.error('[_renderPreview] Libraries not available:', { marked: !!marked, DOMPurify: !!DOMPurify });
preview.innerHTML = '<div class="preview-error"><div class="preview-error-icon">⚠️</div><div class="preview-error-title">Libraries Not Loaded</div><div class="preview-error-message">Required libraries (marked/DOMPurify) could not be loaded. Please check your installation.</div></div>'; preview.innerHTML = '<div class="preview-error"><div class="preview-error-icon">⚠️</div><div class="preview-error-title">Libraries Not Loaded</div><div class="preview-error-message">Required libraries (marked/DOMPurify) could not be loaded. Please check your installation.</div></div>';
return; return;
} }
console.log('[_renderPreview] About to call marked.parse, content length:', tab.content.length);
const html = marked.parse(tab.content); const html = marked.parse(tab.content);
console.log('[_renderPreview] marked.parse returned type:', typeof html, 'isPromise:', html instanceof Promise);
if (html instanceof Promise) {
console.error('[_renderPreview] marked.parse returned a Promise! Need to await it.');
return;
}
let sanitizedHtml = DOMPurify.sanitize(html); let sanitizedHtml = DOMPurify.sanitize(html);
console.log('[_renderPreview] DOMPurify.sanitize returned, length:', sanitizedHtml.length);
// TOC generation // TOC generation
if (sanitizedHtml.includes('[[toc]]') || sanitizedHtml.includes('[TOC]')) { if (sanitizedHtml.includes('[[toc]]') || sanitizedHtml.includes('[TOC]')) {