diff --git a/tests/e2e/drag-layout.e2e.ts b/tests/e2e/drag-layout.e2e.ts index 32db2c6..1d19a17 100644 --- a/tests/e2e/drag-layout.e2e.ts +++ b/tests/e2e/drag-layout.e2e.ts @@ -536,82 +536,6 @@ test('a capture-lost drag with no usable coordinates keeps the last applied widt await page.mouse.up() }) -/* ── issue #248: HMR center-column replacement must be re-located ────── */ - -test('bottom panel re-locates a center column replaced deep inside #root (issue #248)', async ({ page }) => { - await page.goto(BASE_URL, { waitUntil: 'domcontentloaded' }) - await expect(page.locator('#root > *')).not.toHaveCount(0, { timeout: 90_000 }) - const sidebar = page.locator('[data-dsh-better-sidebar]') - await expect(sidebar).toBeAttached({ timeout: 90_000 }) - await dismissOnboarding(page) - await expandSidebar(page, sidebar) - - // Open the bottom panel; it must become visible with the center column - // measured (its right edge tracking the column's right edge). - const bottomExpand = sidebar.getByRole('button', { name: 'Expand bottom panel' }) - await expect(bottomExpand, 'the toggle cluster must offer the bottom-panel expand button').toHaveCount(1) - await bottomExpand.click() - await expect - .poll(async () => { - const value = await page.evaluate(() => document.documentElement.style.getPropertyValue('--dsh-sidebar-height')) - return value !== '' && value !== '0px' - }, { timeout: 90_000 }) - .toBe(true) - - const probe = (): Promise<{ visible: boolean; drift: number } | null> => page.evaluate(() => { - const el = document.querySelector('[data-dsh-better-sidebar] [data-dsh-bottom-panel]') - const col = document.querySelector('#root [data-slot="conversation"]')?.parentElement - if (el === null || col == null) return null - const panel = el.getBoundingClientRect() - const center = col.getBoundingClientRect() - return { - visible: getComputedStyle(el).visibility !== 'hidden', - drift: Math.abs(panel.right - center.right), - } - }) - await expect - .poll(async () => { - const p = await probe() - return p !== null && p.visible && p.drift <= 8 - }, { timeout: 30_000 }) - .toBe(true) - - // Simulate the HMR re-render: the shell swaps the center column node - // DEEP inside #root (a mutation the old childList-only watcher never - // saw — #root's own children don't change), first with a zero-size stub - // (mid-teardown), then with a re-created column of different geometry. - await page.evaluate(() => { - const col = document.querySelector('#root [data-slot="conversation"]')?.parentElement - if (col == null || col.parentElement === null) throw new Error('center column not found') - const stub = document.createElement('div') - const slot = document.createElement('div') - slot.setAttribute('data-slot', 'conversation') - stub.appendChild(slot) - col.parentElement.replaceChild(stub, col) - }) - await page.evaluate(() => { - const col = document.querySelector('#root [data-slot="conversation"]')?.parentElement - if (col == null || col.parentElement === null) throw new Error('center column stub not found') - const fresh = document.createElement('div') - fresh.style.width = '300px' - fresh.style.height = '200px' - const slot = document.createElement('div') - slot.setAttribute('data-slot', 'conversation') - fresh.appendChild(slot) - col.parentElement.replaceChild(fresh, col) - }) - - // The locate chain (subtree watcher / html-style watcher / 1.5s retry) - // must converge on the new column within a couple of seconds; the old - // code kept observing the detached column and never recovered. - await expect - .poll(async () => { - const p = await probe() - return p !== null && p.visible && p.drift <= 8 - }, { timeout: 15_000 }) - .toBe(true) -}) - /* ── issue #258: the bottom panel must not flash full-width after a width drag release ─────────────────────────────────────────────────────── */