Fix DEV mode on Safari when view transitioning to client:only compone…

…nts (#9000) * Fix DEV mode on Safari when view transitioning to client:only components * Update .changeset/eighty-ladybugs-shake.md Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca> --------- Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
withastro · Nov 22, 2023 · 75529b4 · 75529b4
1 parent d557557
commit 75529b4
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 3 deletions.
diff --git a/.changeset/eighty-ladybugs-shake.md b/.changeset/eighty-ladybugs-shake.md
@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Fixes an error in dev mode on Safari where view transitions prevented navigating to pages with `client:only` components
diff --git a/packages/astro/src/transitions/router.ts b/packages/astro/src/transitions/router.ts
@@ -529,9 +529,8 @@ async function prepareForClientOnlyComponents(newDocument: Document, toLocation:
 	if (newDocument.body.querySelector(`astro-island[client='only']`)) {
 		// Load the next page with an empty module loader cache
 		const nextPage = document.createElement('iframe');
-		// do not fetch the file from the server, but use the current newDocument
-		nextPage.srcdoc =
-			(newDocument.doctype ? '<!DOCTYPE html>' : '') + newDocument.documentElement.outerHTML;
+		// with srcdoc resolving imports does not work on webkit browsers
+		nextPage.src = toLocation.href;
 		nextPage.style.display = 'none';
 		document.body.append(nextPage);
 		// silence the iframe's console