46 lines
2.1 KiB
TypeScript
46 lines
2.1 KiB
TypeScript
import { expect, test } from '@playwright/test';
|
|
|
|
test.use({ javaScriptEnabled: true, reducedMotion: 'reduce' });
|
|
|
|
test('fold controls appear on row hover or keyboard focus without shifting the tree', async ({ page }) => {
|
|
await page.goto('./book/');
|
|
await expect(page.locator('.demo-tree')).toHaveAttribute('data-enhanced');
|
|
const node = page.locator('.demo-node[data-path="/book"]');
|
|
const toggle = page.locator('[data-toggle-path="/book"]');
|
|
await page.mouse.move(0, 0);
|
|
await expect(toggle).toHaveCSS('opacity', '0');
|
|
await expect(toggle).toHaveCSS('pointer-events', 'none');
|
|
const before = await node.boundingBox();
|
|
await node.hover();
|
|
await expect(toggle).toHaveCSS('opacity', '1');
|
|
expect(await node.boundingBox()).toEqual(before);
|
|
await toggle.click();
|
|
await expect(node).toHaveAttribute('aria-expanded', 'false');
|
|
await toggle.click();
|
|
await expect(node).toHaveAttribute('aria-expanded', 'true');
|
|
await page.locator('[data-selected-content]').focus();
|
|
await page.mouse.move(0, 0);
|
|
await expect(toggle).toHaveCSS('opacity', '0');
|
|
await node.focus();
|
|
await expect(toggle).toHaveCSS('opacity', '1');
|
|
await page.keyboard.press('ArrowLeft');
|
|
await expect(node).toHaveAttribute('aria-expanded', 'false');
|
|
await page.keyboard.press('ArrowRight');
|
|
await expect(node).toHaveAttribute('aria-expanded', 'true');
|
|
});
|
|
|
|
test.describe('touch without hover', () => {
|
|
test.use({ hasTouch: true, isMobile: true });
|
|
test('fold controls remain visible and tappable', async ({ page }) => {
|
|
await page.goto('./book/');
|
|
await expect(page.locator('.demo-tree')).toHaveAttribute('data-enhanced');
|
|
expect(await page.evaluate(() => matchMedia('(hover: none)').matches)).toBe(true);
|
|
const toggle = page.locator('[data-toggle-path="/book"]');
|
|
await expect(toggle).toHaveCSS('opacity', '1');
|
|
await toggle.tap();
|
|
await expect(page.locator('.demo-node[data-path="/book"]')).toHaveAttribute('aria-expanded', 'false');
|
|
await toggle.tap();
|
|
await expect(page.locator('.demo-node[data-path="/book"]')).toHaveAttribute('aria-expanded', 'true');
|
|
});
|
|
});
|