Fix flaky E2E test by using fresh frame locator after navigation

The ZIP import tests were failing because after navigating the WordPress
iframe to a marker page, the test was checking the body content immediately
before navigation completed.

Fixed by:
- Using website.wordpress() instead of the wordpress fixture to get a fresh
  frame locator reference after navigation
- Increasing the timeout to 30 seconds to allow for iframe navigation time

Author: adamziel

packages/playground/website/playwright/e2e/opfs.spec.ts

@@ -701,23 +701,20 @@ test('should import ZIP into temporary site when a saved site exists', async ({
 		{ timeout: 30000 }
 	);
 
-	// Navigate to the test marker page and verify the original content is intact
-	await website.wordpress().locator('body').waitFor();
+	// Get the site slug from the URL to reload with the marker page
+	const currentUrl = new URL(website.page.url());
+	const siteSlug = currentUrl.searchParams.get('site-slug');
+	expect(siteSlug).toBeTruthy();
 
-	// Use the playground to navigate to our test page
-	const playgroundViewport = website.page.frameLocator(
-		'#playground-viewport:visible,.playground-viewport:visible'
-	);
-	await playgroundViewport
-		.locator('#wp')
-		.evaluate((iframe: HTMLIFrameElement) => {
-			iframe.contentWindow!.location.href = '/test-marker.php';
-		});
+	// Navigate directly to the marker page by reloading with url parameter
+	await website.goto(`./?site-slug=${siteSlug}&url=/test-marker.php`);
+	await website.waitForNestedIframes();
 
 	// Verify the saved site still has the original marker (not the imported content)
-	await expect(wordpress.locator('body')).toContainText(savedSiteMarker, {
-		timeout: 10000,
-	});
+	await expect(website.wordpress().locator('body')).toContainText(
+		savedSiteMarker,
+		{ timeout: 30000 }
+	);
 });
 
 test('should create temporary site when importing ZIP while on a saved site with no existing temporary site', async ({
@@ -825,4 +822,19 @@ test('should create temporary site when importing ZIP while on a saved site with
 		savedSiteName,
 		{ timeout: 30000 }
 	);
+
+	// Get the site slug from the URL to reload with the marker page
+	const currentUrl = new URL(website.page.url());
+	const siteSlug = currentUrl.searchParams.get('site-slug');
+	expect(siteSlug).toBeTruthy();
+
+	// Navigate directly to the marker page by reloading with url parameter
+	await website.goto(`./?site-slug=${siteSlug}&url=/saved-only-marker.php`);
+	await website.waitForNestedIframes();
+
+	// Verify the saved site still has the original marker
+	await expect(website.wordpress().locator('body')).toContainText(
+		savedSiteMarker,
+		{ timeout: 30000 }
+	);
 });