feat(ui): extinction-chess target cycler in rules drawer
Feature 2 of post-epic-deferrals. Exposes extinction-chess's
configurable targetType through the in-game rules drawer so players
don't need to open devtools or call engine.presetState themselves.
UI:
- RulesDrawer.tsx renders a 'Target: <PieceType>' chip inside the
extinction-chess detail card when the preset is active.
Clicking advances through pawn -> knight -> bishop -> rook ->
queen -> king -> pawn (wraps). Plural labels ('Pawns', 'Knights',
...) for prose.
- data-testid='extinction-target-cycler' on the chip for e2e.
- New optional RulesDrawer props extinctionTarget +
onExtinctionTargetChange; omitted props hide the cycler (no
hard dependency on the engine).
Wiring (GameView.tsx):
- Solo-only per plan decision 2a. Multiplayer games use the
target set at room-creation time; the cycler doesn't render in
MP to avoid desync (a future preset-config.update WS message
could lift this; out of v1 scope).
- Local useState syncs with engine.presetState via a useEffect;
setExtinctionTarget writes back through the same state API and
calls refresh() so legal highlights + terminal-state panels
pick up the target flip.
Docs:
- extinction-chess.ts docblock updated to reference the shipped
UI surface + the MP deferral.
- PRESET-API.md post-landing backlog: remove the 'UI cycling'
deferral (now shipped), add the MP-target-sync deferral.
Tests:
- 2 new rule-variants.spec.ts cases: (a) cycler cycles through
all 6 labels when preset active, (b) cycler hidden when preset
inactive.
Verification: 1663 unit + 89/89 e2e (87 + 2 new). Typecheck + lint
clean.
Plan: .sisyphus/plans/post-epic-deferrals.md Feature 2 complete.
This commit is contained in:
parent
f2dff7e530
commit
0ce500906c
5 changed files with 209 additions and 6 deletions
|
|
@ -93,6 +93,65 @@ async function togglePresetInGameDrawer(
|
|||
await expect(drawer).not.toBeVisible();
|
||||
}
|
||||
|
||||
test.describe('F2 post-epic: extinction-chess target cycler', () => {
|
||||
test.beforeEach(async ({ page }) => {
|
||||
await page.goto('/');
|
||||
await page.evaluate(() => {
|
||||
for (let i = localStorage.length - 1; i >= 0; i--) {
|
||||
const k = localStorage.key(i);
|
||||
if (k?.startsWith('paratype-chess:')) localStorage.removeItem(k);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
test('cycler renders when extinction-chess is active; cycles through target types', async ({
|
||||
page,
|
||||
}) => {
|
||||
// Solo game (cycler is solo-only in v1 per plan decision 2a).
|
||||
await page.locator('[data-action="play-solo"]').click();
|
||||
await page.waitForURL('**/game');
|
||||
|
||||
// Open rules drawer and enable extinction-chess.
|
||||
await page.locator('[data-action="open-rules-drawer"]').click();
|
||||
const toggle = page.locator(
|
||||
'[data-preset="extinction-chess"] [data-role="toggle"]',
|
||||
);
|
||||
await expect(toggle).toBeVisible();
|
||||
await toggle.click();
|
||||
|
||||
// Default target is "Pawns" (seeded on activation).
|
||||
const cycler = page.locator('[data-testid="extinction-target-cycler"]');
|
||||
await expect(cycler).toBeVisible();
|
||||
await expect(cycler).toHaveText('Pawns');
|
||||
|
||||
// Cycle: pawn → knight → bishop → rook → queen → king → pawn.
|
||||
const expected = [
|
||||
'Knights',
|
||||
'Bishops',
|
||||
'Rooks',
|
||||
'Queens',
|
||||
'Kings',
|
||||
'Pawns',
|
||||
];
|
||||
for (const label of expected) {
|
||||
await cycler.click();
|
||||
await expect(cycler).toHaveText(label);
|
||||
}
|
||||
});
|
||||
|
||||
test('cycler is absent when extinction-chess is not active', async ({
|
||||
page,
|
||||
}) => {
|
||||
await page.locator('[data-action="play-solo"]').click();
|
||||
await page.waitForURL('**/game');
|
||||
await page.locator('[data-action="open-rules-drawer"]').click();
|
||||
// Drawer open, no preset toggled → no cycler.
|
||||
await expect(
|
||||
page.locator('[data-testid="extinction-target-cycler"]'),
|
||||
).toHaveCount(0);
|
||||
});
|
||||
});
|
||||
|
||||
test.describe('Rule variants — lobby vertical slice', () => {
|
||||
test.beforeEach(async ({ page }) => {
|
||||
await resetStorage(page);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue