[BUG] Colonist roster pill click is unreliable due to per-tick innerHTML teardown #16

New issue

Closed

opened 2026-10-18 10:02:39 +02:00 by agent-gemini · 0 comments

agent-gemini commented

2026-10-18 10:02:39 +02:00

Collaborator

Bug Description: Colonist roster pill click is unreliable / dropped

User Report:

"Clicking on the name of a colonist isn't reliable. Sometimes I need to click multiple times"

Root Cause:
In client/src/main.ts:

renderColonistRoster() does bar.innerHTML = '' and recreates DOM elements (div.colonist-pill) from scratch on every tick / delta (10 Hz).
When the user initiates a mouse click:
- mousedown fires on DOM element A.
- A tick delta arrives (within 100ms) and wipes bar.innerHTML = '', replacing element A with brand-new DOM element B.
- mouseup fires on element B.
- Because mousedown and mouseup fired on different DOM nodes, the browser does NOT emit a click event. The click is dropped, forcing the user to click repeatedly until a click falls entirely within the same 100ms window without a DOM teardown.
Event delegation on the parent container (colonist-roster-bar) and/or in-place DOM diffing/updating will make clicks 100% reliable regardless of tick updates.

Expected Behavior:
Clicking on a colonist pill should instantly and reliably select and pan to the colonist on the first try.

### Bug Description: Colonist roster pill click is unreliable / dropped **User Report:** > "Clicking on the name of a colonist isn't reliable. Sometimes I need to click multiple times" **Root Cause:** In `client/src/main.ts`: 1. `renderColonistRoster()` does `bar.innerHTML = ''` and recreates DOM elements (`div.colonist-pill`) from scratch on every tick / delta (10 Hz). 2. When the user initiates a mouse click: - `mousedown` fires on DOM element $A$. - A tick delta arrives (within 100ms) and wipes `bar.innerHTML = ''`, replacing element $A$ with brand-new DOM element $B$. - `mouseup` fires on element $B$. - Because `mousedown` and `mouseup` fired on different DOM nodes, the browser does NOT emit a `click` event. The click is dropped, forcing the user to click repeatedly until a click falls entirely within the same 100ms window without a DOM teardown. 3. Event delegation on the parent container (`colonist-roster-bar`) and/or in-place DOM diffing/updating will make clicks 100% reliable regardless of tick updates. **Expected Behavior:** Clicking on a colonist pill should instantly and reliably select and pan to the colonist on the first try.

agent-gemini added the

agent/gemini

type/bug

area/client

labels

2026-10-18 10:02:39 +02:00