fc5a97ee91
- Verifies default 3-panel layout - Collapse button hides sidebar - Alt+1 editor-only, Alt+2 editor+notes, Alt+3 restore all - Uses JS-dispatched keyboard events (macOS Alt produces special chars) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
91 lines
3.1 KiB
TypeScript
91 lines
3.1 KiB
TypeScript
import { test, expect } from '@playwright/test'
|
|
|
|
// On macOS, Alt+key produces special characters, so we dispatch events directly
|
|
function dispatchAltKey(page: import('@playwright/test').Page, key: string) {
|
|
return page.evaluate((k) => {
|
|
window.dispatchEvent(new KeyboardEvent('keydown', {
|
|
key: k, altKey: true, metaKey: false, ctrlKey: false,
|
|
bubbles: true, cancelable: true,
|
|
}))
|
|
}, key)
|
|
}
|
|
|
|
async function loadApp(page: import('@playwright/test').Page) {
|
|
await page.goto('/')
|
|
// Clear stored view mode so we start fresh
|
|
await page.evaluate(() => localStorage.removeItem('laputa-view-mode'))
|
|
await page.reload()
|
|
await page.waitForTimeout(500)
|
|
}
|
|
|
|
test.describe('Sidebar collapse', () => {
|
|
test('default: all three panels visible', async ({ page }) => {
|
|
await loadApp(page)
|
|
|
|
await expect(page.locator('.app__sidebar')).toBeVisible()
|
|
await expect(page.locator('.app__note-list')).toBeVisible()
|
|
await expect(page.locator('.app__editor')).toBeVisible()
|
|
|
|
await page.screenshot({ path: 'test-results/collapse-all-panels.png', fullPage: true })
|
|
})
|
|
|
|
test('collapse button hides sidebar', async ({ page }) => {
|
|
await loadApp(page)
|
|
|
|
const collapseBtn = page.locator('button[aria-label="Collapse sidebar"]')
|
|
await expect(collapseBtn).toBeVisible()
|
|
await collapseBtn.click()
|
|
await page.waitForTimeout(500)
|
|
|
|
await expect(page.locator('.app__sidebar')).toHaveCount(0)
|
|
await expect(page.locator('.app__note-list')).toBeVisible()
|
|
await expect(page.locator('.app__editor')).toBeVisible()
|
|
|
|
await page.screenshot({ path: 'test-results/collapse-sidebar-hidden.png', fullPage: true })
|
|
})
|
|
|
|
test('Alt+1 shows editor only', async ({ page }) => {
|
|
await loadApp(page)
|
|
|
|
await dispatchAltKey(page, '1')
|
|
await page.waitForTimeout(500)
|
|
|
|
await expect(page.locator('.app__sidebar')).toHaveCount(0)
|
|
await expect(page.locator('.app__note-list')).toHaveCount(0)
|
|
await expect(page.locator('.app__editor')).toBeVisible()
|
|
|
|
await page.screenshot({ path: 'test-results/collapse-editor-only.png', fullPage: true })
|
|
})
|
|
|
|
test('Alt+2 shows editor + note list', async ({ page }) => {
|
|
await loadApp(page)
|
|
|
|
await dispatchAltKey(page, '2')
|
|
await page.waitForTimeout(500)
|
|
|
|
await expect(page.locator('.app__sidebar')).toHaveCount(0)
|
|
await expect(page.locator('.app__note-list')).toBeVisible()
|
|
await expect(page.locator('.app__editor')).toBeVisible()
|
|
|
|
await page.screenshot({ path: 'test-results/collapse-editor-list.png', fullPage: true })
|
|
})
|
|
|
|
test('Alt+3 restores all panels after collapse', async ({ page }) => {
|
|
await loadApp(page)
|
|
|
|
// Collapse first
|
|
await dispatchAltKey(page, '1')
|
|
await page.waitForTimeout(500)
|
|
await expect(page.locator('.app__sidebar')).toHaveCount(0)
|
|
|
|
// Restore
|
|
await dispatchAltKey(page, '3')
|
|
await page.waitForTimeout(500)
|
|
await expect(page.locator('.app__sidebar')).toBeVisible()
|
|
await expect(page.locator('.app__note-list')).toBeVisible()
|
|
await expect(page.locator('.app__editor')).toBeVisible()
|
|
|
|
await page.screenshot({ path: 'test-results/collapse-restored.png', fullPage: true })
|
|
})
|
|
})
|