refactor(games): migrate 9 legacy games to BaseGame framework - #42

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/lib/games/2048/Game2048.ts`:
- Around line 208-210: The game-over branch in Game2048 currently fires
`this.end()` without handling failures, which can lead to an unhandled
rejection. Update the `canMove(this.state.board)` path in `Game2048` to await or
otherwise handle the async `end()` call with proper error handling, and make
sure any rejection from score saving or end hooks is caught and logged/processed
consistently with the rest of the class.
- Around line 185-213: `Game2048.move()` returns a stale board because
`result.board` is still the pre-spawn value from `computeMove()` while
`this.state.board` is updated after `spawnTile()`. Update `move()` so the
returned result reflects the post-spawn board, keeping `result.board` in sync
with the final `this.state.board` before `emitStateChange()` and the game-over
check, using the existing `computeMove`/`spawnTile` flow to locate the change.

In `@src/lib/games/2048/Game2048Renderer.ts`:
- Around line 111-131: Destroy the previously rendered Pixi children when
redrawing the 2048 board, because drawBoard() and drawTiles() recreate Graphics,
Container, and Text objects every render. Update Game2048Renderer so the
existing boardContainer children are removed and destroyed before new ones are
added, and make sure the same cleanup is applied to any tile containers created
in drawTiles() to prevent resource buildup during long sessions.

In `@src/lib/games/2048/initFramework.test.ts`:
- Around line 228-243: The pre-start guard test is using a second
init2048GameFramework instance while the beforeEach game is still active, so the
keydown can be handled by the wrong listener and leak animation work. In the
“does not move before the game starts” test, clean up the already-started game
from beforeEach before creating fresh, then attach the move spy to that fresh
instance and dispatch the event against the correct document listener. Use
init2048GameFramework, move, and cleanup to locate the affected test setup.

In `@src/lib/games/2048/initFramework.ts`:
- Line 193: The touch swipe sensitivity is still hardcoded in the 2048 init
flow, so callers cannot use the merged swipe threshold from customConfig. Update
the touch handling path in initFramework and setupTouchControls to read the
configured swipeThreshold from config instead of GAME_CONSTANTS.SWIPE_THRESHOLD,
and thread that value through any helper used for touch movement detection. Make
sure the logic in handleMove/setupTouchControls uses the same config source
everywhere so custom swipe tuning takes effect.
- Around line 320-322: The End button handler in initFramework currently fires
game.end() without handling failures, which can lead to unhandled promise
rejections. Update endHandler to catch errors from the async game.end() call and
route them through the existing error handling/logging path used in this flow,
keeping the handler safe when the user ends the game.

In `@src/lib/games/bubble-shooter/BubbleShooterGame.ts`:
- Around line 426-429: The row-add logic in BubbleShooterGame should skip adding
a new row when the current shot triggers an all-clear. Update the shot handling
in attachBubble() and the matching flow in checkMatches() so the all-clear state
is detected before the rowAddInterval check runs, and gate this.state.shotCount
% this.config.rowAddInterval accordingly. Use the existing BubbleShooterGame
methods attachBubble(), checkMatches(), and addNewRow() to ensure the board
stays empty after the bonus is awarded.
- Around line 435-436: The game-over branch in BubbleShooterGame should not drop
the promise returned by end(), since this can surface as unhandled rejections.
Update the checkGameOverCondition path in BubbleShooterGame to await or
otherwise handle the async end() call with explicit error handling, using the
end() method and the surrounding game-over logic as the anchor points.
- Line 153: The displayed accuracy in BubbleShooterGame is using bubblesPopped /
shotsFired, which can exceed 100% because a single shot may pop multiple
bubbles. Update the accuracy calculation in BubbleShooterGame so it is capped at
100% (or switch to a true hit-rate based on successful shots) before it is
exposed to the UI, keeping the logic localized around the
shotsFired/bubblesPopped stats.

In `@src/lib/games/bubble-shooter/initFramework.ts`:
- Around line 450-476: Update the input handling in initFramework by replacing
the canvas mouse listeners with pointer events so aiming and shooting work on
touch devices as well as mouse devices. Refactor mouseMoveHandler and
clickHandler wiring to use pointermove and pointerdown on the canvas, and ensure
the canvas disables default touch gestures (for example via touch-action
handling) so pointer input is not blocked. Keep the existing aim-angle logic and
game.shoot() behavior, just adapt the event types and canvas interaction setup
for mobile compatibility.
- Around line 345-347: The button handler in startHandler/endHandler is dropping
the async game.end() promise, so update the handler logic to await or chain the
promise and handle any rejection. Use the existing startHandler and endHandler
functions in initFramework to add proper error handling around game.end(),
matching the async safety pattern used elsewhere in the codebase.

In `@src/lib/games/evader/EvaderGame.test.ts`:
- Around line 392-408: The test in EvaderGame.test should await the async
lifecycle shutdown before resetting and restarting, since game.end() may still
be doing cleanup when the next game begins. Update the stuck-keys test to use
the same awaited pattern as the other lifecycle tests around game.end(), so the
reset()/start() sequence only runs after the previous game is fully finished.

In `@src/lib/games/evader/EvaderRenderer.test.ts`:
- Around line 162-174: The test description in EvaderRenderer.test.ts does not
match its expectation: the case named by the EvaderRenderer render-after-cleanup
scenario asserts that render is a no-op instead of throwing. Rename the test to
reflect the actual behavior exercised by initialize(), cleanup(), and render(),
so the title clearly indicates render does not throw when the app is unavailable
after cleanup.

In `@src/lib/games/evader/initFramework.ts`:
- Around line 327-352: `setupKeyboardControls` only wires keyboard events, so
Evader remains unusable on touch-only devices. Extend this input setup in
`initFramework.ts` with a touch/pointer (or mouse) movement handler that
translates directional gestures/presses into the same movement input path used
by `game.pressKey` and `game.releaseKey`. Keep the existing
`handleKeyDown`/`handleKeyUp` behavior intact, and ensure the cleanup function
removes any new listeners added for mobile-friendly controls.

In `@src/lib/games/memory-matrix/MemoryMatrixGame.test.ts`:
- Around line 130-142: Add regression coverage in MemoryMatrixGame.test for
calling reset() while two cards are face-up but before FLIP_DELAY completes,
since this is the stale-timeout crash path in MemoryMatrixGame. Extend the
existing reset test or add a new one that flips two cards, calls game.reset()
before the timeout fires, then advances timers and asserts reset() does not
throw, the state remains reset, and no delayed match/score changes occur after
FLIP_DELAY. Refer to game.start(), game.reset(), getState(), and the flip-delay
behavior in MemoryMatrixGame to keep the test targeted.

In `@src/lib/games/memory-matrix/MemoryMatrixGame.ts`:
- Line 39: `onGameReset()` in `MemoryMatrixGame` should also clear any pending
match-check timer, since `matchTimeoutId` can survive a reset and later run
against the new state. Update the reset flow to invoke `cleanup()` from
`onGameReset()` so the delayed `cardsMatch` callback is canceled before it can
access stale `flippedCards` and throw.

In `@src/lib/games/memory-matrix/MemoryMatrixRenderer.ts`:
- Around line 58-95: In createCardElement, remove the unconditional inline
backgroundColor and borderColor assignment for cards that are flipped or
matched, because it overrides the Tailwind state classes returned by
getCardClasses. Keep styling driven by the class list so matched cards use the
green theme and flipped cards use the cyan/slate theme consistently. If
card.color is still needed, apply it only in a way that does not override the
state-based classes, and verify the rendered styles in the MemoryMatrixRenderer
flow.

---

Nitpick comments:
In `@src/lib/games/evader/EvaderRenderer.ts`:
- Around line 108-126: The player in EvaderRenderer.renderPlayer is still drawn
as a flat green square, unlike the neon/glow styling used for coins and bombs.
Update renderPlayer to use the same sci-fi visual treatment as the other
entities, ideally by applying a PIXI.FillGradient or similar glow effect with
matching stroke styling. Keep the existing playerGraphic clear/rect flow, but
swap the solid fill for the themed gradient so the player matches the rest of
the game’s holographic look.

In `@src/lib/games/evader/initFramework.ts`:
- Around line 164-197: The render loop in initFramework’s startRenderLoop
currently passes an unbounded deltaTime into game.update, which can spike after
tab throttling or long pauses. Clamp or cap the computed deltaTime before
calling game.update so the physics step stays stable, and keep the change
localized to the renderLoop logic using the existing lastUpdateTime and
game.update flow.

In `@src/lib/games/memory-matrix/MemoryMatrixRenderer.test.ts`:
- Around line 193-215: The matched/flipped card tests in
MemoryMatrixRenderer.test are only checking className, so they miss inline-style
overrides from MemoryMatrixRenderer. Update the assertions in the relevant
renderer test cases to verify the actual rendered background/border styling (for
example via computed style or inline style on the card element) in addition to,
or instead of, Tailwind classes. Use the existing createRenderer, makeState, and
boardEl/cardEl setup to locate the affected checks.

In `@src/lib/games/memory-matrix/MemoryMatrixRenderer.ts`:
- Around line 78-82: The card interaction in MemoryMatrixRenderer is mouse-only,
so update the card element setup to support keyboard access as well. In the
render logic where the card click listener is attached, add appropriate
semantics and focusability to the card div, wire a keydown handler in addition
to the existing click handler, and ensure the same onCardClick path is triggered
from keyboard activation. Also add focus-visible styling alongside the existing
hover treatment so the card interaction is accessible and matches the sci-fi
theme consistently.

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Nitpick comments:
In `@src/lib/games/evader/EvaderRenderer.test.ts`:
- Around line 1-68: The PixiJS mock setup in EvaderRenderer.test is duplicated
across several test suites, so centralize the shared scaffolding into a common
helper and import it here. Extract the repeated mock factories used by the
vi.mock('pixi.js') block, including the application/container/graphics helpers,
into a shared test utility such as a pixi mock module, then update
EvaderRenderer.test and the other renderer/init tests to use that shared setup
so future PixiJS API changes only need one update.