From c3b5c944975f7c85d5bdc8f50bc14a5caf97c7f0 Mon Sep 17 00:00:00 2001 From: Russell Ballestrini Date: Tue, 1 Jul 2025 17:49:33 -0400 Subject: [PATCH] fix(translation): ensure CSS and JS work in preview - The translation preview now includes the full HTML document, ensuring that stylesheets, scripts, and other resources are loaded correctly. - A tag is injected into the preview to handle relative resource paths. - Removed a script flag that was incorrectly disabling JavaScript in the translated page, which fixes the issue with dialog boxes not appearing. --- src/translation.js | 28 ++-------------------------- src/ui.js | 8 ++++++++ 2 files changed, 10 insertions(+), 26 deletions(-) diff --git a/src/translation.js b/src/translation.js index 5c27611..e5add5c 100644 --- a/src/translation.js +++ b/src/translation.js @@ -229,32 +229,8 @@ ${preservedText}`; // Extract page content for translation export function extractPageContent() { - // Try to get main content from common selectors - const contentSelectors = [ - 'main', - 'article', - '.content', - '.post-content', - '.entry-content', - '#content', - 'body' - ]; - - let content = ''; - - for (const selector of contentSelectors) { - const element = document.querySelector(selector); - if (element) { - // Get HTML content to preserve structure for translation - content = element.innerHTML; - break; - } - } - - // Clean up excessive whitespace - content = content.replace(/\n\s*\n\s*\n/g, '\n\n').trim(); - - return content; + // Return the entire HTML of the document to preserve head, styles, and scripts + return document.documentElement.outerHTML; } // Translate current page content diff --git a/src/ui.js b/src/ui.js index 6ca7b69..a4b7156 100644 --- a/src/ui.js +++ b/src/ui.js @@ -1723,6 +1723,11 @@ export function openTranslateModal() { // Inject base URL for relative resources to work const baseUrl = window.location.origin + window.location.pathname.substring(0, window.location.pathname.lastIndexOf('/') + 1); + // The translatedText is a full HTML document. We just need to inject the base tag. + const htmlWithBase = translatedText.replace(/]*>/i, `if (previewWindow) { + // Inject base URL for relative resources to work + const baseUrl = window.location.origin + window.location.pathname.substring(0, window.location.pathname.lastIndexOf('/') + 1); + let htmlWithBase; const scriptTag = `