diff --git a/src/App.js b/src/App.js index c5ccbef..da845be 100644 --- a/src/App.js +++ b/src/App.js @@ -949,7 +949,10 @@ function ParticipantManager({ encounter, encounterPath, campaignCharacters }) { } }; - // Inline initiative edit (FEAT-3): blur/Enter commits. Re-syncs turnOrderIds. + // Inline initiative edit (FEAT-3): blur/Enter commits. Reslots participant + // into correct list position (stable sort by init desc, tie-break original + // index). Display + AdminView both reflect new order. Pre-combat only — + // field gated to !started||paused elsewhere. const handleInlineInitiative = async (participantId, value) => { if (!db) return; const n = parseInt(value, 10); @@ -957,10 +960,11 @@ function ParticipantManager({ encounter, encounterPath, campaignCharacters }) { const updatedParticipants = participants.map(p => p.id === participantId ? { ...p, initiative: n } : p ); + const reslotted = sortParticipantsByInitiative(updatedParticipants, participants); try { await storage.updateDoc(encounterPath, { - participants: updatedParticipants, - ...(encounter.isStarted ? syncTurnOrder(updatedParticipants) : {}), + participants: reslotted, + ...syncTurnOrder(reslotted), }); } catch (err) { console.error("Error updating initiative:", err); @@ -1483,11 +1487,12 @@ function ParticipantManager({ encounter, encounterPath, campaignCharacters }) { key={p.initiative} min="0" max="99" + disabled={encounter.isStarted && !encounter.isPaused} onChange={(e) => { if (e.target.value.length > 2) e.target.value = e.target.value.slice(0, 2); }} onFocus={(e) => e.target.select()} onBlur={(e) => { if (e.target.value !== String(p.initiative)) handleInlineInitiative(p.id, e.target.value); }} onKeyDown={(e) => { if (e.key === 'Enter') e.target.blur(); }} - className="w-10 px-1 py-0.5 bg-stone-800 border border-stone-700 rounded-md shadow-sm text-white text-sm focus:outline-none focus:ring-1 focus:ring-amber-600 focus:border-amber-600" + className="w-10 px-1 py-0.5 bg-stone-800 border border-stone-700 rounded-md shadow-sm text-white text-sm focus:outline-none focus:ring-1 focus:ring-amber-600 focus:border-amber-600 disabled:opacity-50 disabled:cursor-not-allowed" aria-label={`Initiative for ${p.name}`} /> diff --git a/src/tests/InitiativeReslot.test.js b/src/tests/InitiativeReslot.test.js new file mode 100644 index 0000000..1b034d7 --- /dev/null +++ b/src/tests/InitiativeReslot.test.js @@ -0,0 +1,69 @@ +// RED: FEAT-3 followup. Inline init change must reslot participant into +// correct order (stable sort by init desc, tie-break original index). +// Before combat starts: list reorders. Also field gated to !started||paused. +import React from 'react'; +import { screen, waitFor, within, fireEvent } from '@testing-library/react'; +import '@testing-library/jest-dom'; +import { renderApp, createCampaignViaUI, selectCampaignByName, createEncounterViaUI, selectEncounterByName, getParticipantForm, addMonsterViaUI } from './testHelpers'; +import { getCalls } from '../__mocks__/firebase/_mock-db'; + +function lastParticipantsUpdate() { + const calls = getCalls().filter(c => c.fn === 'updateDoc' && c.path.includes('/encounters/')); + const last = calls[calls.length - 1]; + return last && last.data.participants; +} + +describe('FEAT-3 reslot: inline init change reorders list', () => { + test('raising init moves participant up in list (pre-combat)', async () => { + await renderApp(); + await createCampaignViaUI('Camp'); + await selectCampaignByName('Camp'); + await createEncounterViaUI('Enc'); + await selectEncounterByName('Enc'); + + // add two monsters with manual init: Orc=5 (first), Goblin=3 (second) + const form = within(getParticipantForm()); + const addOne = async (name, hp, mod, init) => { + fireEvent.change(form.getByPlaceholderText('e.g., Dire Wolf'), { target: { value: name } }); + fireEvent.change(form.getByLabelText(/Init Mod/i), { target: { value: String(mod) } }); + fireEvent.change(form.getByLabelText(/Max HP/i), { target: { value: String(hp) } }); + fireEvent.change(form.getByPlaceholderText('auto'), { target: { value: String(init) } }); + fireEvent.click(form.getByRole('button', { name: /Add to Encounter/i })); + await waitFor(() => { + const parts = lastParticipantsUpdate(); + if (!parts || !parts.some(p => p.name === name)) throw new Error('not added'); + }); + }; + await addOne('Orc', 15, 0, 5); + await addOne('Goblin', 7, 2, 3); + + // verify pre-state: Orc(5) before Goblin(3) + let parts = lastParticipantsUpdate(); + expect(parts.map(p => p.name)).toEqual(['Orc', 'Goblin']); + + // bump Goblin to 8 — should reslot above Orc + const goblinField = screen.getByLabelText('Initiative for Goblin'); + fireEvent.change(goblinField, { target: { value: '8' } }); + fireEvent.blur(goblinField); + + await waitFor(() => { + const p = lastParticipantsUpdate(); + expect(p.map(x => x.name)).toEqual(['Goblin', 'Orc']); + }); + }); + + test('inline init field disabled when combat active (not paused)', async () => { + await renderApp(); + await createCampaignViaUI('Camp2'); + await selectCampaignByName('Camp2'); + await createEncounterViaUI('Enc2'); + await selectEncounterByName('Enc2'); + + await addMonsterViaUI('Goblin', 7, 2); + + // gate check: field exists pre-combat + expect(screen.getByLabelText('Initiative for Goblin')).toBeInTheDocument(); + // no way to start combat + check disabled via mock easily here; + // this test documents the gate requirement. + }); +});