From 1bbecad86172ad95af9be528d5c41f7a8c85cbf4 Mon Sep 17 00:00:00 2001
From: giles <giles.bradshaw@rose-ash.com>
Date: Sat, 28 Mar 2026 20:54:50 +0000
Subject: [PATCH] =?UTF-8?q?Playwright:=20add=20back=20button=20navigation?=
 =?UTF-8?q?=20tests=20=E2=80=94=207/7=20pass?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Two new tests:
- browser back button works after navigation: URL returns to original,
  content renders (not blank), no raw SX visible
- back button preserves layout: heading stays in top area, no side-by-side

All 7 navigation tests pass including forward nav, back button, layout,
content update, header survival, and raw SX checks.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 tests/playwright/navigation.spec.js | 58 +++++++++++++++++++++++++++++
 1 file changed, 58 insertions(+)

diff --git a/tests/playwright/navigation.spec.js b/tests/playwright/navigation.spec.js
index 89dbb444..b8c1c299 100644
--- a/tests/playwright/navigation.spec.js
+++ b/tests/playwright/navigation.spec.js
@@ -89,6 +89,64 @@ test.describe('Client-side Navigation', () => {
     expect(headerTextAfter).toContain('sx');
   });
 
+  test('browser back button works after navigation', async ({ page }) => {
+    await page.goto(BASE_URL + '/sx/(geography)', { waitUntil: 'networkidle' });
+    await page.waitForTimeout(2000);
+
+    // Note the initial URL and content
+    const initialUrl = page.url();
+    const initialText = await page.locator('h1, h2').first().textContent();
+
+    // Navigate forward
+    const cekLink = page.locator('a:has-text("CEK Machine")');
+    if (await cekLink.count() > 0) {
+      await cekLink.first().click();
+      await page.waitForTimeout(3000);
+
+      // Should be on a different page
+      const navUrl = page.url();
+      expect(navUrl).not.toBe(initialUrl);
+
+      // Go back
+      await page.goBack();
+      await page.waitForTimeout(3000);
+
+      // URL should return to original
+      expect(page.url()).toContain('geography');
+
+      // Content should show Geography page content (not blank, not broken)
+      const bodyText = await page.textContent('body');
+      expect(bodyText.length).toBeGreaterThan(100);
+
+      // Should not show raw SX
+      const mainContent = await page.locator('#main-panel, main').first().textContent();
+      expect(mainContent).not.toContain('(~shared:layout');
+    }
+  });
+
+  test('back button preserves layout (no side-by-side)', async ({ page }) => {
+    await page.goto(BASE_URL + '/sx/(geography)', { waitUntil: 'networkidle' });
+    await page.waitForTimeout(2000);
+
+    // Navigate forward
+    await page.click('a[href*="geography.(reactive"]:not([href*="runtime"])');
+    await page.waitForTimeout(3000);
+
+    // Go back
+    await page.goBack();
+    await page.waitForTimeout(3000);
+
+    // Check layout is vertical — heading should be within top part of page
+    const heading = await page.locator('h1, h2').first().boundingBox();
+    if (heading) {
+      expect(heading.y).toBeLessThan(500);
+      const viewport = page.viewportSize();
+      if (viewport) {
+        expect(heading.x).toBeLessThan(viewport.width * 0.5);
+      }
+    }
+  });
+
   test('full page width is used (no side-by-side split)', async ({ page }) => {
     await page.goto(BASE_URL + '/sx/(geography)', { waitUntil: 'networkidle' });