feat(ui): pinned modifier inspection panel
- Create ModifierPinnedPanel.tsx: fixed-position side panel with piece header, modifier list (label + describe() value), and close button - Board.tsx: add onPieceClick prop, fire on piece click (distinct from drag) - GameView.tsx: add pinnedPieceId state; clicking a piece toggles pin; clicking same piece again or × closes panel; panel renders fixed right-4 - 2 new e2e tests: click b1 pins panel with 'knight' text; × dismisses it
This commit is contained in:
parent
cfc68bba51
commit
278370a630
4 changed files with 170 additions and 1 deletions
|
|
@ -191,6 +191,58 @@ test.describe('Modifier Profiles — hover tooltip (T24)', () => {
|
|||
});
|
||||
});
|
||||
|
||||
// ── T25: Pinned modifier inspection panel ────────────────────────────────
|
||||
|
||||
test.describe('Modifier Profiles — pinned panel (T25)', () => {
|
||||
test.beforeEach(async ({ page }) => {
|
||||
await page.goto('/');
|
||||
|
||||
// Clear any stale autosave so Play Solo starts a fresh game.
|
||||
await page.evaluate(() => {
|
||||
for (let i = localStorage.length - 1; i >= 0; i--) {
|
||||
const key = localStorage.key(i);
|
||||
if (key !== null && key.startsWith('paratype-chess:v2:autosave:')) {
|
||||
localStorage.removeItem(key);
|
||||
}
|
||||
}
|
||||
localStorage.removeItem('paratype-chess:v1:autosave');
|
||||
});
|
||||
|
||||
// Navigate into the game WITHOUT opening the rules drawer —
|
||||
// the board must remain fully interactive.
|
||||
await page.locator('[data-action="play-solo"]').click();
|
||||
await page.waitForURL('**/game');
|
||||
});
|
||||
|
||||
test('click piece pins side panel', async ({ page }) => {
|
||||
// Click the b1 square — white knight in the classic starting position.
|
||||
await page.click('[data-square="b1"]');
|
||||
|
||||
// The pinned panel must appear and identify the piece.
|
||||
await expect(
|
||||
page.locator('[data-testid="modifier-pinned-panel"]'),
|
||||
).toBeVisible({ timeout: 2000 });
|
||||
await expect(
|
||||
page.locator('[data-testid="modifier-pinned-panel"]'),
|
||||
).toContainText(/knight/i);
|
||||
});
|
||||
|
||||
test('closing pinned panel removes it', async ({ page }) => {
|
||||
// Pin the panel.
|
||||
await page.click('[data-square="b1"]');
|
||||
await expect(
|
||||
page.locator('[data-testid="modifier-pinned-panel"]'),
|
||||
).toBeVisible({ timeout: 2000 });
|
||||
|
||||
// Dismiss via the close button.
|
||||
await page.click('[data-testid="close-pinned-panel"]');
|
||||
|
||||
await expect(
|
||||
page.locator('[data-testid="modifier-pinned-panel"]'),
|
||||
).not.toBeVisible({ timeout: 1000 });
|
||||
});
|
||||
});
|
||||
|
||||
// ── T26: Lobby profile picker + GameView badge ─────────────────────────
|
||||
|
||||
test.describe('Modifier Profiles — Lobby integration (T26)', () => {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue