diff --git a/tests/playwright/isomorphic.spec.js b/tests/playwright/isomorphic.spec.js index 11042f5..52a274c 100644 --- a/tests/playwright/isomorphic.spec.js +++ b/tests/playwright/isomorphic.spec.js @@ -85,37 +85,29 @@ test.describe('Isomorphic SSR', () => { await context.close(); }); - test('page renders with JavaScript and matches SSR structure', async ({ browser }) => { - // First: get SSR content (no JS) + test('JS and no-JS render the same DOM structure and styles', async ({ browser }) => { + // Get SSR DOM (no JS) const noJsContext = await browser.newContext({ javaScriptEnabled: false }); const noJsPage = await noJsContext.newPage(); await noJsPage.goto(BASE_URL + TEST_PAGE, { waitUntil: 'domcontentloaded' }); - const ssrText = await getSxRootText(noJsPage); const ssrStructure = await getSxRootStructure(noJsPage); + const ssrText = await getSxRootText(noJsPage); await noJsContext.close(); - // Then: get client-rendered content (with JS) + // Get client DOM (with JS) const jsContext = await browser.newContext({ javaScriptEnabled: true }); const jsPage = await jsContext.newPage(); await jsPage.goto(BASE_URL + TEST_PAGE, { waitUntil: 'networkidle' }); - // Wait for islands to hydrate - await jsPage.waitForSelector('[data-sx-island].sx-processed', { timeout: 10000 }).catch(() => {}); - await jsPage.waitForTimeout(500); // settle - + await jsPage.waitForTimeout(2000); // wait for hydration + const clientStructure = await getSxRootStructure(jsPage); const clientText = await getSxRootText(jsPage); await jsContext.close(); - // Text content should be the same (article text, headings, etc) - expect(ssrText.length).toBeGreaterThan(100); - expect(clientText.length).toBeGreaterThan(100); + // Text content must match + expect(ssrText).toBe(clientText); - // The core content should match — both should have the article headings - expect(clientText).toContain('Language games'); - expect(clientText).toContain('The limits of my language'); - - // SSR should also have these - expect(ssrText).toContain('Language games'); - expect(ssrText).toContain('The limits of my language'); + // Structure must match — same tags, ids, classes + expect(JSON.stringify(ssrStructure)).toBe(JSON.stringify(clientStructure)); }); test('header island has CSSX styling without JavaScript', async ({ browser }) => {