powergrid-viewer 2.0.6 → 2.0.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "powergrid-viewer",
-  "version": "2.0.6",
+  "version": "2.0.8",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/boardgamers/powergrid.git",

package/src/components/Game.vue

@@ -727,6 +727,7 @@ import type { GameState, LogItem, Move, Player } from 'powergrid-engine';
 import { EventEmitter } from 'events';
 import {
     bufferedBuyCounts,
+    engineRefusedIt,
     lastBuyIndex,
     matchesTurnBuffer,
     rebaseTurnBuffer,
@@ -980,6 +981,9 @@ export default class Game extends Vue {
     // server-side from the last committed state; undo simply shortens it.
     turnMoves: Move[] = [];
 
+    /** Why the last local replay stopped, if it did — see `engineRefusedIt`. */
+    private lastReplayFailure: unknown;
+
     // Last committed state received from the platform. Undo replays the shortened
     // turn buffer from this state; when the buffer empties, the preview resets to it
     // without any server call (the platform's saved state IS the turn start).
@@ -1039,8 +1043,9 @@ export default class Game extends Vue {
      * engine now rejects — possible after a rebase) and returns the preview.
      */
     replayTurnBuffer(): GameState {
-        const { state, applied } = replayBuffer(this.committedState!, this.turnMoves, this.player!);
+        const { state, applied, failure } = replayBuffer(this.committedState!, this.turnMoves, this.player!);
         this.turnMoves = applied;
+        this.lastReplayFailure = failure;
         return state;
     }
 
@@ -1529,11 +1534,20 @@ export default class Game extends Vue {
             return;
         }
 
+        // What the board offered when this click was judged — the same list the
+        // button that produced it was enabled from.
+        const offeredWhenClicked =
+            this.player != undefined && this.G && this.G.players[this.player]
+                ? this.G.players[this.player].availableMoves
+                : undefined;
+        const theServerOfferedThisMove = !!offeredWhenClicked && !!offeredWhenClicked[move.name];
+
         // Stamp the move ONCE, when it enters the turn buffer, so the engine can
         // advance the per-player clocks. The engine never reads the system clock
         // itself — the stamp travels with the move on every resend of the buffer, so
         // replays (and the eventual committed log) reproduce the same times.
-        this.turnMoves.push({ ...move, time: Date.now() });
+        const stamped = { ...move, time: Date.now() };
+        this.turnMoves.push(stamped);
 
         // Preview the move locally BEFORE sending it. Without this the board — and with
         // it `availableMoves` — stays frozen on the last server reply, so every click
@@ -1542,9 +1556,6 @@ export default class Game extends Vue {
         // replayed buffer with "Wrong argument for the command BuyResource"; the
         // rejected move then stays in the buffer, so every later action resends it and
         // fails again until the page is refreshed (#131).
-        //
-        // Replaying the buffer on the committed state is exact: any move with hidden
-        // side effects commits, which ends the buffer (see util/turn-buffer).
         let preview: GameState | null = null;
 
         if (this.committedState && this.player != undefined) {
@@ -1552,9 +1563,31 @@ export default class Game extends Vue {
             preview = this.replayTurnBuffer();
 
             if (this.turnMoves.length < buffered) {
-                // The engine refused the move we just added, so it never reaches the
-                // server and the board already shows the truth.
-                return;
+                // The replay could not carry the move — which is NOT the same thing as
+                // the move being illegal, and telling them apart is the whole job here.
+                //
+                // The state a player holds is stripped of everything they may not see.
+                // A fastBid auction keeps the other players' sealed bids hidden, so the
+                // response that RESOLVES that auction cannot be replayed on this copy at
+                // all: the engine reaches for a bid that was stripped out and throws.
+                // A human is almost always the last to answer — bots reply instantly —
+                // so treating that as a refusal silently swallowed nearly every Pass in
+                // a fastBid auction, with an enabled button and no way to tell.
+                //
+                // So defer to the only authority on legality that this viewer has: the
+                // `availableMoves` the server sent. If it offered the move, send it and
+                // let the server replay it from the full state; just do not pretend to
+                // preview what could not be previewed.
+                const onlyThisMoveWasDropped = this.turnMoves.length === buffered - 1;
+
+                if (engineRefusedIt(this.lastReplayFailure) || !theServerOfferedThisMove || !onlyThisMoveWasDropped) {
+                    // A genuinely stale click (#131): the engine asserted against it on
+                    // a state it could read in full. The board already shows the truth.
+                    return;
+                }
+
+                this.turnMoves.push(stamped);
+                preview = null;
             }
         }
 
@@ -2024,6 +2057,10 @@ export default class Game extends Vue {
      * the choice would disappear along with the layout.
      */
     portraitViewport = false;
+
+    /** Viewport the board was last laid out against, as `WxH` — see onViewportResize. */
+    private lastViewport = '';
+    private viewportObserver: ResizeObserver | null = null;
     /** Height of the stacked canvas, in scene units. */
     stackHeight = STACK_WIDTH;
     /** Wrapper transform per slot; empty means "render as authored". */
@@ -2062,6 +2099,16 @@ export default class Game extends Vue {
         return window.innerWidth < 900 && window.innerHeight > window.innerWidth * 1.1;
     }
 
+    /**
+     * The platform mounts the viewer in an iframe that is `display: none` until the
+     * game state arrives, so the first measurement here is 0x0 — which is not a
+     * landscape phone, it is nothing at all. Answering then would settle the layout
+     * against a viewport that does not exist yet.
+     */
+    private viewportIsMeasurable(): boolean {
+        return window.innerWidth > 0 && window.innerHeight > 0;
+    }
+
     private shouldStack(): boolean {
         return this.isPortraitViewport() && this.preferences.stackOnPortrait !== false;
     }
@@ -2075,6 +2122,11 @@ export default class Game extends Vue {
     }
 
     relayout() {
+        if (!this.viewportIsMeasurable()) {
+            // Still hidden. Whoever reveals us triggers the observer below.
+            return;
+        }
+
         this.portraitViewport = this.isPortraitViewport();
 
         if (!this.shouldStack()) {
@@ -2189,17 +2241,57 @@ export default class Game extends Vue {
         this.$nextTick(() => this.relayout());
     }
 
-    private onViewportResize = () => this.scheduleRelayout();
+    /**
+     * Re-lay out only when the viewport itself changed size. The observer below also
+     * fires for our OWN output — laying out the board changes the document's box — and
+     * without this that would be a loop.
+     */
+    private onViewportResize = () => {
+        const size = `${window.innerWidth}x${window.innerHeight}`;
+
+        if (size === this.lastViewport) {
+            return;
+        }
+
+        this.lastViewport = size;
+        this.scheduleRelayout();
+    };
 
     mounted() {
         window.addEventListener('resize', this.onViewportResize);
         window.addEventListener('orientationchange', this.onViewportResize);
+        window.addEventListener('load', this.onViewportResize);
+
+        if (window.visualViewport) {
+            window.visualViewport.addEventListener('resize', this.onViewportResize);
+        }
+
+        // The one signal that does not depend on the browser dispatching an event:
+        // being revealed changes the document's own box. Safari does not reliably fire
+        // `resize` inside an iframe going from `display: none` to visible, and the
+        // board then stays in the landscape layout with no toggle to escape it — the
+        // measurement was taken at 0x0 and nothing ever asked again.
+        if (typeof ResizeObserver !== 'undefined') {
+            this.viewportObserver = new ResizeObserver(this.onViewportResize);
+            this.viewportObserver.observe(document.documentElement);
+        }
+
         this.scheduleRelayout();
     }
 
     beforeDestroy() {
         window.removeEventListener('resize', this.onViewportResize);
         window.removeEventListener('orientationchange', this.onViewportResize);
+        window.removeEventListener('load', this.onViewportResize);
+
+        if (window.visualViewport) {
+            window.visualViewport.removeEventListener('resize', this.onViewportResize);
+        }
+
+        if (this.viewportObserver) {
+            this.viewportObserver.disconnect();
+            this.viewportObserver = null;
+        }
     }
 
     // Boards grow as players buy plants, so the row heights are re-derived on

package/src/util/turn-buffer.ts

@@ -131,21 +131,43 @@ export function replayTurnBuffer(
     committedState: GameState,
     turnMoves: Move[],
     player: number
-): { state: GameState; applied: Move[] } {
+): { state: GameState; applied: Move[]; failure?: unknown } {
     let state: GameState = JSON.parse(JSON.stringify(committedState));
     const applied: Move[] = [];
+    let failure: unknown;
 
     for (const move of turnMoves) {
         try {
             state = engineMove(state, move, player);
         } catch (err) {
             console.error('dropping turn-buffer tail no longer legal on the committed state', move, err);
+            failure = err;
             break;
         }
         applied.push(move);
     }
 
-    return { state, applied };
+    return { state, applied, failure };
+}
+
+/**
+ * Did the engine REFUSE this move, or could this copy of the state simply not carry it?
+ *
+ * The engine refuses with an assertion. A state stripped of what a player may not see —
+ * a fastBid auction's sealed bids — instead fails while reaching for something that was
+ * stripped out, which says nothing at all about legality.
+ */
+export function engineRefusedIt(failure: unknown): boolean {
+    if (!failure) {
+        return false;
+    }
+
+    // Node stamps `code: 'ERR_ASSERTION'`; the browser build of `assert` does not, and
+    // checking only for the code let every illegal move through in the bundle while
+    // passing every test in Node.
+    const err = failure as { name?: string; code?: string };
+
+    return err.name === 'AssertionError' || err.code === 'ERR_ASSERTION';
 }
 
 /**