From bf9d7da770555d1b326f1a7312917951c9fad885 Mon Sep 17 00:00:00 2001
From: Russell Ballestrini <russell.ballestrini@gmail.com>
Date: Wed, 9 Jul 2025 16:30:14 -0400
Subject: [PATCH] fix: use base tag to resolve relative URLs in translated
 pages

---
 src/translation.js | 55 ++++++++++------------------------------------
 1 file changed, 12 insertions(+), 43 deletions(-)

diff --git a/src/translation.js b/src/translation.js
index 1e78108..bf08360 100644
--- a/src/translation.js
+++ b/src/translation.js
@@ -378,53 +378,22 @@ export async function translateCurrentPage(targetLanguage) {
 	// Replace the body content with translated content
 	doc.body.innerHTML = translatedContent;
 	
-	// Convert ALL relative URLs to absolute URLs so they work in new window
-	const currentOrigin = window.location.origin;
+	// Add a base tag to resolve all relative URLs correctly
 	const currentUrl = window.location.href;
+	const baseUrl = new URL('.', currentUrl).href; // Get base URL (without filename)
 	
-	// Convert CSS links
-	const cssLinks = doc.querySelectorAll('link[rel="stylesheet"]');
-	cssLinks.forEach(link => {
-		const href = link.getAttribute('href');
-		if (href && !href.startsWith('http') && !href.startsWith('//')) {
-			const absoluteUrl = new URL(href, currentUrl).href;
-			link.setAttribute('href', absoluteUrl);
-			console.log('Converted CSS URL:', href, '->', absoluteUrl);
-		}
-	});
+	// Remove any existing base tag
+	const existingBase = doc.querySelector('base');
+	if (existingBase) {
+		existingBase.remove();
+	}
 	
-	// Convert script sources
-	const scripts = doc.querySelectorAll('script[src]');
-	scripts.forEach(script => {
-		const src = script.getAttribute('src');
-		if (src && !src.startsWith('http') && !src.startsWith('//')) {
-			const absoluteUrl = new URL(src, currentUrl).href;
-			script.setAttribute('src', absoluteUrl);
-			console.log('Converted script URL:', src, '->', absoluteUrl);
-		}
-	});
+	// Add new base tag to head
+	const baseTag = doc.createElement('base');
+	baseTag.setAttribute('href', baseUrl);
+	doc.head.insertBefore(baseTag, doc.head.firstChild);
 	
-	// Convert image sources
-	const images = doc.querySelectorAll('img[src]');
-	images.forEach(img => {
-		const src = img.getAttribute('src');
-		if (src && !src.startsWith('http') && !src.startsWith('//') && !src.startsWith('data:')) {
-			const absoluteUrl = new URL(src, currentUrl).href;
-			img.setAttribute('src', absoluteUrl);
-			console.log('Converted image URL:', src, '->', absoluteUrl);
-		}
-	});
-	
-	// Convert link hrefs (for navigation)
-	const links = doc.querySelectorAll('a[href]');
-	links.forEach(link => {
-		const href = link.getAttribute('href');
-		if (href && !href.startsWith('http') && !href.startsWith('//') && !href.startsWith('#') && !href.startsWith('mailto:') && !href.startsWith('tel:')) {
-			const absoluteUrl = new URL(href, currentUrl).href;
-			link.setAttribute('href', absoluteUrl);
-			console.log('Converted link URL:', href, '->', absoluteUrl);
-		}
-	});
+	console.log('Added base tag with href:', baseUrl);
 	
 	return doc.documentElement.outerHTML;
 }