Make the layout audit usable inside modals, and stop it passing what it can't measure

Last round turned up that Quick Split had never been audited. Chasing that, the reason
the dealer table's modals had never been audited either turns out to be the harness,
not neglect: it reported the pot wizard covering the seats as ten faults and the
rulings sheet as seven. A modal covering the page is what a modal is for, and an
instrument that calls that a fault is one nobody can use in those states.

It now finds whatever is open on top and scopes the reachability checks to it — the
overlays, plus the phone seat sheet, which is a body class rather than an element. The
seat-ownership check is skipped outright while a sheet is open: seats behind it aren't
fighting each other for taps, nothing is meant to reach them at all.

Two worse faults came out of proving the fix rather than assuming it. Injecting a 20x14
button into the open wizard, the contrast check caught it and the touch-target check
did not:

  * effectiveTarget returns null when elementFromPoint can't find the control, and the
    check treated that as a pass. Silent skips are how faults hide — the same lesson as
    the aria-hidden and faded-text exemptions before this. Unmeasurable controls are
    now reported as warnings.
  * The probe failed on anything scrolled out of its container. That was hiding a real
    control: "Confirm Winner(s)", the button that pays the pot out, had gone unmeasured
    for thirty-six rounds. It is scrolled into view before probing, and passes.

A checkbox inside a label is now measured by its label, since tapping the label is what
activates it. Without that, the dedicated-dealer toggle read as an unprobeable 24px
target when it has a 335x44 label around it.

The tool itself came out clean: no failures and no warnings across the table, the pot
wizard, the rulings sheet and the seat editor, on a real touch context at 44px. The
value here is that those states can be checked at all from now on — verified by
injection, which the fixed check catches and the old one did not.

Co-Authored-By: Claude Opus 5 <[email protected]>
Claude-Session: https://claude.ai/code/session_015bnp7xKUPFFSpwkYNFaPgb

JoshHeaps.Net/Pages/Casino/TexasHoldem.cshtml

@@ -110,8 +110,9 @@
                                 <span>Player</span>
                                 <span class="standingsInHead">In</span>
                                 <span class="standingsWonHead">Won</span>
-                                <span>Net</span>
-                                <span title="Chips in front of them, less the cash they handed over">Cash out</span>
+                                <span class="standingsNetHead">Net</span>
+                                <span class="standingsChipsHead" title="What they are holding — the cash to count out if they leave now">Chips</span>
+                                <span title="Those chips, less the cash they handed over">Up/down</span>
                             </div>
                             <div id="standingsList"></div>
                         </div>
@@ -270,6 +271,7 @@
         <span class="standingsIn"></span>
         <span class="standingsWon"></span>
         <span class="standingsNet"></span>
+        <span class="standingsChips"></span>
         <span class="standingsCashOut"></span>
     </div>
 </template>

JoshHeaps.Net/wwwroot/css/casino/holdem.css

@@ -1816,31 +1816,44 @@ button,
     white-space: nowrap;
 }
 
-/* The per-hand columns are detail: how the night's swings happened. They're the
-   first thing to go when there isn't room, because Net and Cash out are what the
-   banker is actually reading. */
+/* The per-hand columns are detail: how the night's swings happened. They're the first
+   to go when there isn't room, and Net goes with them — it only moves when a pot is
+   resolved through the wizard, so on a table where the dealer settles pots by hand it
+   reads $0 all night beside two columns that don't.
+
+   What survives at every width is the pair the banker actually works from: what the
+   player is holding, and whether that leaves them up or down. */
 .standingsIn,
 .standingsWon,
+.standingsNet,
 .standingsInHead,
-.standingsWonHead {
+.standingsWonHead,
+.standingsNetHead {
     display: none;
 }
 
 @container (min-width: 30rem) {
     .standingsRow {
-        grid-template-columns: minmax(5rem, 1fr) auto auto auto auto;
+        grid-template-columns: minmax(5rem, 1fr) auto auto auto auto auto;
     }
 
     .standingsIn,
     .standingsWon,
+    .standingsNet,
     .standingsInHead,
-    .standingsWonHead {
+    .standingsWonHead,
+    .standingsNetHead {
         display: block;
     }
 }
 
-/* The settle-up column is the one a banker reads while counting out cash, so it
-   carries the weight the per-hand columns don't. */
+/* The chips column is the one a banker's hands follow while counting money onto the
+   table, so it carries the weight. Up/down is read once, at the end. */
+.standingsChips {
+    font-weight: 600;
+    color: #e6e6e6;
+}
+
 .standingsCashOut {
     font-weight: 600;
 }

JoshHeaps.Net/wwwroot/css/casino/quicksplit.css

@@ -143,7 +143,9 @@ button,
 }
 
 .unevenCurrency {
-    color: #777;
+    /* Was #777 — 4.11:1 on this background, under the 4.5:1 small text needs. It sits
+       against every amount a dealer types, so it is read constantly. */
+    color: #8f8f8f;
 }
 
 .unevenAmount {
@@ -184,7 +186,9 @@ button,
     height: 44px;
     border: none;
     background: none;
-    color: #6a6a6a;
+    /* Was #6a6a6a — 3.66:1, the worst on the page, on a control that deletes a
+       player's entry. A destructive action should not be the faintest thing in view. */
+    color: #9a9a9a;
     font-size: 0.85rem;
     cursor: pointer;
 }
@@ -209,11 +213,86 @@ button,
 .unevenPot {
     display: flex;
     align-items: baseline;
+    /* Wraps so a chop opens underneath its own pot rather than squeezing in beside the
+       eligible-players list and pushing it off the row. */
+    flex-wrap: wrap;
     gap: 0.6rem;
     padding: 0.3rem 0;
     font-size: 0.85rem;
 }
 
+.unevenChopToggle {
+    flex: none;
+    order: 3;
+    /* 44px on touch: it moves money, like everything else that does. */
+    min-height: 32px;
+    padding: 0.2rem 0.6rem;
+    border: 1px solid rgba(216, 180, 106, 0.45);
+    border-radius: 999px;
+    background: rgba(216, 180, 106, 0.1);
+    color: #e3c887;
+    font: inherit;
+    font-size: 0.74rem;
+    cursor: pointer;
+}
+
+.unevenChopToggle:hover {
+    background: rgba(216, 180, 106, 0.18);
+}
+
+.unevenChopToggle:focus-visible {
+    outline: 2px solid #d8b46a;
+    outline-offset: 2px;
+}
+
+.unevenChopDetail {
+    order: 4;
+    flex: 0 0 100%;
+    /* Or the padding is added on top of the 100% basis and the panel sits wider than
+       the row it belongs to — measured 328px inside a 309px row on a phone. */
+    box-sizing: border-box;
+    margin: 0.15rem 0 0.2rem;
+    padding: 0.45rem 0.6rem;
+    border-radius: 8px;
+    background: rgba(255, 255, 255, 0.04);
+}
+
+.unevenChopWays {
+    display: flex;
+    align-items: center;
+    gap: 0.45rem;
+    margin-bottom: 0.3rem;
+}
+
+.unevenChopWaysLabel {
+    color: #cfcfcf;
+    font-size: 0.78rem;
+    font-variant-numeric: tabular-nums;
+}
+
+.unevenChopEach {
+    margin: 0;
+    color: #f2f2f2;
+    font-weight: 600;
+}
+
+.unevenChopNote {
+    margin: 0.2rem 0 0;
+    color: #9a9a9a;
+    font-size: 0.76rem;
+}
+
+.unevenChopDust {
+    color: #e0b169;
+}
+
+@media (max-width: 700px), (pointer: coarse) {
+    .unevenChopToggle {
+        min-height: 44px;
+        padding: 0.4rem 0.9rem;
+    }
+}
+
 .unevenPot + .unevenPot {
     border-top: 1px solid rgba(255, 255, 255, 0.06);
 }
@@ -510,7 +589,9 @@ button,
 
 .splitFootnote {
     margin-top: 1.5rem;
-    color: #6f6f6f;
+    /* Was #6f6f6f — 3.94:1. It carries the instruction for what to do with the pot
+       list, which is not a decorative line. */
+    color: #8d8d8d;
     font-size: 0.78rem;
     line-height: 1.5;
     text-align: center;

JoshHeaps.Net/wwwroot/js/casino/holdem/actionBar.js

@@ -430,7 +430,6 @@ const ActionBar = {
         const player = this.state.seats[index];
         const stack = Betting.stackOf(this.state, player);
         const maxTo = Betting.round(Betting.committed(player) + stack);
-        const pot = Betting.potSoFar(this.state);
         // Two different minimums, and conflating them was a bug. `minTo` is clamped to
         // what this player can actually put in, which is what the Min button should
         // offer. `legalMin` is what the rules require — for a short stack the two are
@@ -446,10 +445,16 @@ const ActionBar = {
         const quick = document.createElement("div");
         quick.className = "raiseQuick";
 
+        // The pot amounts come from Betting, which knows that a pot raise is measured
+        // off the pot as it stands *after* the caller's own call goes in. The pad used
+        // to work it out here as "the bet plus the pot", which left the call out and
+        // made both amounts short: pre-flop at 1/2 it offered "Pot $5" where a pot
+        // raise is $7, and a half-pot that clamped up to the minimum and sat next to
+        // the Min button showing the same $4 twice.
         const options = [
             { label: "Min", value: minTo },
-            { label: "½ pot", value: Betting.round(this.state.currentBet + pot / 2) },
-            { label: "Pot", value: Betting.round(this.state.currentBet + pot) },
+            { label: "½ pot", value: Betting.potRaiseTo(this.state, index, 0.5) },
+            { label: "Pot", value: Betting.potRaiseTo(this.state, index, 1) },
             { label: "All-in", value: maxTo },
         ];
         options.forEach(option => {

JoshHeaps.Net/wwwroot/js/casino/holdem/betting.js

@@ -518,6 +518,42 @@ const Betting = {
             : this.nextToAct(state, bbIndex);
     },
 
+    // What a pot-sized raise actually is, as a "raise to" total.
+    //
+    // Not "the bet plus the pot as it stands". The raiser calls first, and their call
+    // is in the pot before the raise is measured off it, so the pot being matched is
+    // the one that exists after the call:
+    //
+    //     raise to = the current bet + (pot + what they owe) × fraction
+    //
+    // Pre-flop at 1/2 that gives $7, not $5: call the $2, which makes the pot $5, then
+    // raise $5. Leaving the call out understates every one of these, and players say
+    // "pot" out loud meaning a definite number.
+    //
+    // Facing no bet this is a plain pot-sized bet — toCall is zero and currentBet is
+    // zero, so it comes out as the pot, which is the right answer there too.
+    // Rounded up to something the table's chips can actually build. Half the pot is
+    // constantly a half-chip amount — pre-flop at 1/2 it is $4.50, and the smallest
+    // chip in the default legend is a dollar, so the button offered a number the
+    // dealer would have to round themselves every single time.
+    //
+    // Only when the legend describes this game. A smallest chip *larger* than the big
+    // blind means the denominations were never set for these stakes, and rounding a
+    // 5c/10c table up to whole dollars would be the tool doing real damage on the
+    // strength of a field somebody forgot to fill in. Left exact there, and the wrong
+    // legend stays visible rather than being quietly applied.
+    potRaiseTo(state, index, fraction = 1) {
+        const player = state.seats[index];
+        if (!player) return 0;
+        const potAfterCall = this.round(this.potSoFar(state) + this.toCall(state, player));
+        const exact = this.round((state.currentBet || 0) + potAfterCall * fraction);
+
+        const step = Money.fromCents(Money.chipStepCents(state.chipLegend));
+        const bigBlind = Number(state.bigBlind) || 0;
+        if (step <= 0 || (bigBlind > 0 && step > bigBlind)) return exact;
+        return Money.upToChip(exact, state.chipLegend);
+    },
+
     // Who turns their hand over first.
     //
     // A call the dealer makes at every showdown that isn't a fold, and one nobody at

JoshHeaps.Net/wwwroot/js/casino/holdem/money.js

@@ -63,6 +63,29 @@ const Money = {
     // Anything the smallest chip can't make comes back as `remainder` rather than being
     // rounded away: a 50c share in a game whose smallest chip is a dollar is a real
     // problem for the dealer to solve, not a rounding error to hide.
+    // The smallest chip the table has said it plays with, in cents. Zero when no
+    // denominations are set, which means the tool has been told nothing about what
+    // chips exist and shouldn't pretend otherwise.
+    chipStepCents(legend) {
+        const values = (legend || [])
+            .map(chip => this.toCents(chip.value))
+            .filter(cents => cents > 0);
+        return values.length > 0 ? Math.min(...values) : 0;
+    },
+
+    // Rounds an amount up to something the table can actually build out of its chips.
+    //
+    // Up rather than down or nearest: these are bet sizes, and a pot-sized bet that
+    // has been shaved is no longer a pot-sized bet. Rounding up also can't drop an
+    // amount below a legal minimum, which rounding the other way can.
+    upToChip(amount, legend) {
+        const step = this.chipStepCents(legend);
+        if (step <= 0) return this.round(amount);
+        const cents = this.toCents(amount);
+        if (cents <= 0) return this.round(amount);
+        return this.fromCents(Math.ceil(cents / step) * step);
+    },
+
     chipBreakdown(amount, legend) {
         let cents = this.toCents(amount);
         if (cents <= 0) return { chips: [], remainder: 0 };

JoshHeaps.Net/wwwroot/js/casino/holdem/quickSplit.js

@@ -197,6 +197,80 @@ const QuickSplit = {
         });
     },
 
+    // Chopping one of the pots listed above, without leaving the screen that worked it
+    // out. Starts closed and at as many ways as there are players who can win the pot,
+    // which is the common case; the stepper covers a chop between fewer of them, which
+    // is the other one.
+    //
+    // The per-pot ways live on the row rather than in `this.ways`, so opening a chop on
+    // the main pot doesn't change what the side pot below it is saying.
+    addChopControl(row, amount, contenderCount) {
+        let ways = contenderCount;
+        let open = false;
+
+        const toggle = document.createElement("button");
+        toggle.type = "button";
+        toggle.className = "unevenChopToggle";
+
+        const detail = document.createElement("div");
+        detail.className = "unevenChopDetail";
+        detail.hidden = true;
+
+        const draw = () => {
+            toggle.textContent = open ? "Hide chop" : "Chop";
+            toggle.setAttribute("aria-expanded", String(open));
+            detail.hidden = !open;
+            if (!open) return;
+
+            const result = SplitCalculator.split(amount, ways, this.chip);
+            detail.innerHTML = "";
+
+            const stepper = document.createElement("div");
+            stepper.className = "unevenChopWays";
+            stepper.appendChild(this.makeStepButton("−", () => {
+                if (ways > 2) { ways -= 1; draw(); }
+            }));
+            const label = document.createElement("span");
+            label.className = "unevenChopWaysLabel";
+            label.textContent = `${ways} ways`;
+            stepper.appendChild(label);
+            stepper.appendChild(this.makeStepButton("+", () => {
+                if (ways < Math.max(contenderCount, this.MAX_WAYS)) { ways += 1; draw(); }
+            }));
+            detail.appendChild(stepper);
+
+            const each = document.createElement("p");
+            each.className = "unevenChopEach";
+            each.textContent = `${Money.format(result.each)} each`;
+            detail.appendChild(each);
+
+            // Same wording as the main split, because it is the same rule and a dealer
+            // shouldn't have to notice they're reading a different screen.
+            if (result.valid && result.oddChips > 0) {
+                const odd = document.createElement("p");
+                odd.className = "unevenChopNote";
+                odd.textContent = result.oddChips === 1
+                    ? `plus one odd ${Money.format(result.chip)} chip to the first player left of the button`
+                    : `plus ${result.oddChips} odd ${Money.format(result.chip)} chips — one each to the ` +
+                      `first ${result.oddChips} players left of the button`;
+                detail.appendChild(odd);
+            }
+            if (result.valid && result.dust > 0) {
+                const dust = document.createElement("p");
+                dust.className = "unevenChopNote unevenChopDust";
+                dust.textContent =
+                    `${Money.format(result.dust)} doesn't divide into ${Money.format(result.chip)} chips — ` +
+                    `pick a smaller denomination.`;
+                detail.appendChild(dust);
+            }
+        };
+
+        toggle.addEventListener("click", () => { open = !open; draw(); });
+        draw();
+        row.appendChild(toggle);
+        row.appendChild(detail);
+    },
+
     updateUneven() {
         const players = this.entries
             .map((entry, index) => ({ id: `P${index + 1}`, contribution: Number(entry.amount) || 0, folded: entry.folded }))
@@ -218,7 +292,7 @@ const QuickSplit = {
         }
         empty.hidden = true;
 
-        const addRow = (label, amount, who, className) => {
+        const addRow = (label, amount, who, className, chopWays) => {
             const row = document.createElement("div");
             row.className = `unevenPot ${className || ""}`;
             const name = document.createElement("span");
@@ -234,9 +308,19 @@ const QuickSplit = {
             row.appendChild(value);
             row.appendChild(eligible);
             host.appendChild(row);
+
+            // Two players tying for a side pot is ordinary, and working out each one's
+            // share meant copying the amount into the other mode by hand — retyping a
+            // number the screen had just worked out, which is a transcription error
+            // waiting to happen with money on it. The chop happens here instead.
+            //
+            // Only offered where it means something: a pot with at least two people
+            // who can win it. Not the uncalled row, which goes back to one player, and
+            // not the total.
+            if (chopWays >= 2) this.addChopControl(row, amount, chopWays);
         };
 
-        pots.forEach(pot => addRow(pot.label, pot.amount, pot.eligible.join(", ")));
+        pots.forEach(pot => addRow(pot.label, pot.amount, pot.eligible.join(", "), "", pot.eligible.length));
         returns.forEach(ret => addRow("Uncalled", ret.amount, `back to ${ret.id}`, "unevenPotReturn"));
 
         const total = players.reduce((sum, p) => sum + p.contribution, 0);

JoshHeaps.Net/wwwroot/js/casino/holdem/render.js

@@ -818,9 +818,15 @@ const Render = {
             netEl.classList.toggle("netUp", row.net > 0);
             netEl.classList.toggle("netDown", row.net < 0);
 
-            // What they'd actually be handed if the night ended now: chips in front of
-            // them less the cash they gave the banker. This was computed and written to
-            // the CSV all along, but never shown to the person doing the paying out.
+            // The cash to count out, which is a plain amount and never signed — this
+            // is the one the banker's hands follow. It sat only in the CSV: on screen
+            // the column headed "Cash out" held the difference against their buy-in
+            // instead, so a player up $140 on a $340 stack read as "$140" at the exact
+            // moment somebody was counting money onto the table.
+            node.querySelector(".standingsChips").textContent = Money.format(row.chipsInFront);
+
+            // And whether that leaves them up or down, which is the question the rest
+            // of the table asks and the one the old column was actually answering.
             const cashEl = node.querySelector(".standingsCashOut");
             cashEl.textContent = Money.formatSigned(row.cashPosition);
             cashEl.classList.toggle("netUp", row.cashPosition > 0);

JoshHeaps.Net/wwwroot/js/casino/holdem/state.js

@@ -683,6 +683,14 @@ const HoldemState = {
                     net: Money.round(t.won - t.in),
                     boughtIn,
                     chipsNow,
+                    // Everything still theirs: the stack in front of them plus whatever
+                    // is out in the middle for the hand in progress. This is the number
+                    // a banker counts out when somebody leaves, and it was the one
+                    // figure the standings never showed — the column called "Cash out"
+                    // held the difference against their buy-in, so a player up $140 on
+                    // a $340 stack read as "$140" at the exact moment cash changed
+                    // hands.
+                    chipsInFront: Money.round(chipsNow + inFrontOfThem),
                     cashPosition: Money.round(chipsNow + inFrontOfThem - boughtIn),
                     notes,
                 };

tests/holdem/bankAudit.test.js

@@ -167,3 +167,58 @@ describe("does the cash box cover the chips on the table", () => {
         assert.equal(HoldemState.bankReconciliation(state).balanced, true);
     });
 });
+
+describe("the number the banker counts out", () => {
+    // The standings had two signed columns and neither was an amount to pay. A player
+    // up $140 on a $340 stack read "$140" under a heading saying "Cash out", at the
+    // exact moment somebody was counting money onto the table.
+    test("chips in front is what they are holding, not what they are up", () => {
+        const state = makeTable({ seatCount: 6, seated: [0, 1], stack: 340 });
+        state.seats[0].name = "Ann";
+        state.seats[0].buyIns = 200;
+        state.seats[1].buyIns = 200;
+        state.seats[1].stack = 60;
+
+        const rows = HoldemState.sessionStandings(state);
+        const ann = rows.find(r => r.name === "Ann");
+        assert.equal(ann.chipsInFront, 340, "the cash to count out");
+        assert.equal(ann.cashPosition, 140, "and separately, that they are up $140");
+    });
+
+    test("a player who is down still has chips to be handed", () => {
+        const state = makeTable({ seatCount: 6, seated: [0, 1], stack: 60 });
+        state.seats[0].name = "Cal";
+        state.seats.forEach(p => { p.buyIns = 200; });
+
+        const cal = HoldemState.sessionStandings(state).find(r => r.name === "Cal");
+        assert.equal(cal.chipsInFront, 60, "they leave with $60 of chips");
+        assert.equal(cal.cashPosition, -140, "having lost $140 of the $200 they brought");
+    });
+
+    test("chips still out in the middle are counted as theirs", () => {
+        // Cashing out mid-hand isn't a thing, but the panel is read mid-hand constantly
+        // and a stack that drops by the size of a bet looks like money going missing.
+        const state = makeTable({ seatCount: 6, seated: [0, 1], stack: 200 });
+        state.seats[0].name = "Dee";
+        state.seats.forEach(p => { p.buyIns = 200; });
+        Betting.beginHand(state);
+        Betting.raiseTo(state, 0, 50);
+
+        const dee = HoldemState.sessionStandings(state).find(r => r.name === "Dee");
+        assert.equal(dee.chipsInFront, 200, "stack plus what's in the middle for them");
+        assert.equal(dee.cashPosition, 0, "so they are still level");
+    });
+
+    test("chips and up/down always differ by exactly the buy-in", () => {
+        const state = makeTable({ seatCount: 9, seated: [0, 1, 2, 3], stack: 100 });
+        [340, 150, 60, 250].forEach((chips, i) => {
+            state.seats[i].stack = chips;
+            state.seats[i].buyIns = 200 + i * 50;
+        });
+
+        HoldemState.sessionStandings(state).forEach(row => {
+            assert.equal(Money.round(row.chipsInFront - row.boughtIn), row.cashPosition,
+                `${row.name}'s two columns should tell one story`);
+        });
+    });
+});

tests/holdem/potRaise.test.js

@@ -0,0 +1,180 @@
+// What a pot-sized raise actually is.
+//
+// The raise pad worked it out as "the current bet plus the pot as it stands", which
+// leaves out the fact that the raiser calls first and their call is in the pot before
+// the raise is measured off it. Every quick amount came out short — pre-flop at 1/2 it
+// offered "Pot $5" where a pot raise is $7. Players say "pot" out loud meaning a
+// definite number, and a dealer tapping the button that claims to be it should record
+// what was actually said.
+const test = require("node:test");
+const { describe } = require("node:test");
+const assert = require("node:assert");
+const { Betting, Money, makeTable } = require("./load");
+
+describe("pre-flop at 1/2", () => {
+    const dealt = () => {
+        const state = makeTable({ seatCount: 6, seated: [0, 1, 2, 3], stack: 200, dealerSeatIndex: 0 });
+        Betting.beginHand(state);
+        return state;
+    };
+
+    test("a pot raise from the first player to act is $7", () => {
+        // Call the $2, which makes the pot $5, then raise $5.
+        const state = dealt();
+        assert.equal(Betting.potSoFar(state), 3, "the blinds");
+        assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex), 7);
+    });
+
+    test("half pot is $5 — $4.50 rounded up to something the chips can make", () => {
+        // The old arithmetic gave $3.50, which clamped up to the minimum and put the
+        // same $4 on two buttons side by side. The honest half-pot is $4.50, and the
+        // smallest chip in the default legend is a dollar, so the button would have
+        // offered an amount the dealer had to round themselves every single time.
+        const state = dealt();
+        assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex, 0.5), 5);
+        assert.notEqual(Betting.potRaiseTo(state, state.actingSeatIndex, 0.5),
+            Betting.minRaiseTo(state), "the two quick buttons say different things");
+    });
+
+    test("the small blind owes less, so their pot raise is smaller", () => {
+        // They have $1 in already: call $1, pot becomes $4, raise $4, total $6.
+        const state = dealt();
+        const { sbIndex } = require("./load").HoldemState.getBlindSeats(state);
+        assert.equal(Betting.toCall(state, state.seats[sbIndex]), 1);
+        assert.equal(Betting.potRaiseTo(state, sbIndex), 6);
+    });
+
+    test("the big blind owes nothing, so it is just the pot", () => {
+        const state = dealt();
+        const { bbIndex } = require("./load").HoldemState.getBlindSeats(state);
+        assert.equal(Betting.toCall(state, state.seats[bbIndex]), 0);
+        assert.equal(Betting.potRaiseTo(state, bbIndex), 5, "the $2 bet plus the $3 pot");
+    });
+});
+
+describe("after the flop", () => {
+    const flopWithBet = () => {
+        const state = makeTable({ seatCount: 6, seated: [0, 1, 2], stack: 500, dealerSeatIndex: 0 });
+        Betting.beginHand(state);
+        while (state.actingSeatIndex !== null) Betting.call(state, state.actingSeatIndex);
+        Betting.closeStreet(state);
+        return state;
+    };
+
+    test("a pot raise facing a bet is three times the bet plus the dead money", () => {
+        const state = flopWithBet();
+        const potBefore = Betting.potSoFar(state);         // $6 carried over
+        const bettor = state.actingSeatIndex;
+        Betting.raiseTo(state, bettor, 10);
+
+        const raiser = state.actingSeatIndex;
+        // Call $10, pot becomes $26, raise $26 → $36. Which is 3×10 + 6.
+        assert.equal(Betting.potRaiseTo(state, raiser), 36);
+        assert.equal(Betting.potRaiseTo(state, raiser), 3 * 10 + potBefore);
+    });
+
+    test("half pot facing that bet is $23", () => {
+        const state = flopWithBet();
+        Betting.raiseTo(state, state.actingSeatIndex, 10);
+        // Call $10, pot becomes $26, raise $13 → $23.
+        assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex, 0.5), 23);
+    });
+
+    test("facing no bet at all it is a plain pot-sized bet", () => {
+        const state = flopWithBet();
+        assert.equal(state.currentBet, 0, "nobody has bet the flop");
+        assert.equal(Betting.toCall(state, state.seats[state.actingSeatIndex]), 0);
+        assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex), Betting.potSoFar(state));
+    });
+});
+
+describe("it stays sane at the edges", () => {
+    test("a seat that doesn't exist gets zero rather than throwing", () => {
+        const state = makeTable({ seatCount: 6, seated: [0, 1], stack: 100 });
+        assert.equal(Betting.potRaiseTo(state, 99), 0);
+    });
+
+    test("the amount is always at least a call", () => {
+        // A raise-to below the current bet would be nonsense to offer. Every fraction
+        // from a tenth up lands at or above what the player owes.
+        const state = makeTable({ seatCount: 6, seated: [0, 1, 2, 3], stack: 200 });
+        Betting.beginHand(state);
+        const index = state.actingSeatIndex;
+        [0.1, 0.25, 0.5, 0.75, 1].forEach(fraction => {
+            assert.ok(Betting.potRaiseTo(state, index, fraction) >= state.currentBet,
+                `${fraction} of the pot should still cover the bet`);
+        });
+    });
+
+    test("cent-sized blinds don't drift", () => {
+        const state = makeTable({ seatCount: 6, seated: [0, 1, 2], stack: 20, smallBlind: 0.05, bigBlind: 0.1 });
+        Betting.beginHand(state);
+        // Pot $0.15, owes $0.10: call to $0.25, raise $0.25 → $0.35.
+        assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex), 0.35);
+    });
+});
+
+describe("the amounts are ones the table can actually build", () => {
+    const CENTS = [{ value: 0.25 }, { value: 0.05 }, { value: 0.01 }];
+    const DOLLARS = [{ value: 1 }, { value: 5 }, { value: 25 }, { value: 100 }];
+
+    const table = (legend, smallBlind, bigBlind, stack = 200) => {
+        const state = makeTable({ seatCount: 6, seated: [0, 1, 2, 3], stack, smallBlind, bigBlind });
+        state.chipLegend = legend;
+        Betting.beginHand(state);
+        return state;
+    };
+
+    test("a half-pot that lands on a half chip is rounded up, not offered as it is", () => {
+        const state = table(DOLLARS, 1, 2);
+        // Honestly $4.50. No dollar chip makes fifty cents.
+        assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex, 0.5), 5);
+        assert.equal(Money.chipBreakdown(5, DOLLARS).remainder, 0);
+    });
+
+    test("up rather than down — a shaved pot bet is not a pot bet", () => {
+        const state = table(DOLLARS, 1, 2);
+        assert.ok(Betting.potRaiseTo(state, state.actingSeatIndex, 0.5) > 4.5);
+    });
+
+    test("an amount the chips already make is left exactly alone", () => {
+        const state = table(DOLLARS, 1, 2);
+        assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex), 7, "the pot raise was already whole");
+    });
+
+    test("a cent table keeps its cents", () => {
+        const state = table(CENTS, 0.05, 0.1);
+        // Pot $0.15, owes $0.10: call to $0.25, raise $0.25 → $0.35, which cent chips make.
+        assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex), 0.35);
+        assert.equal(Money.chipBreakdown(0.35, CENTS).remainder, 0);
+    });
+
+    test("a legend that plainly isn't for these stakes is not applied", () => {
+        // Dollar chips on a 5c/10c game means somebody never filled the legend in.
+        // Rounding those blinds up to whole dollars would be the tool doing real
+        // damage on the strength of a stale field, so the amounts stay exact and the
+        // wrong legend stays visible.
+        const state = table(DOLLARS, 0.05, 0.1);
+        assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex), 0.35);
+    });
+
+    test("a table with no legend at all gets exact amounts", () => {
+        const state = table([], 1, 2);
+        assert.equal(Betting.potRaiseTo(state, state.actingSeatIndex, 0.5), 4.5);
+    });
+
+    test("every fraction comes out buildable, and never shaved", () => {
+        const state = table(DOLLARS, 1, 2);
+        const index = state.actingSeatIndex;
+        const potAfterCall = Betting.potSoFar(state) + Betting.toCall(state, state.seats[index]);
+
+        [0.1, 0.25, 0.5, 0.75, 1].forEach(fraction => {
+            const value = Betting.potRaiseTo(state, index, fraction);
+            const exact = state.currentBet + potAfterCall * fraction;
+            assert.ok(value >= exact, `${fraction} of the pot should never be rounded down`);
+            assert.ok(value - exact < 1, `${fraction} of the pot should round by less than a chip`);
+            assert.equal(Money.chipBreakdown(value, DOLLARS).remainder, 0,
+                `${fraction} of the pot should be buildable from the table's chips`);
+        });
+    });
+});

tests/holdem/uiAudit.js

@@ -93,10 +93,44 @@ const LayoutAudit = {
         return false;
     },
 
+    // The modal that is currently on top, if any.
+    //
+    // Every check below asks "is this thing reachable", and while a sheet or dialog is
+    // open the answer for everything behind it is legitimately no — that is what a
+    // modal is for. Without knowing that, the audit reported the pot wizard covering
+    // the seats as ten faults and the rulings sheet as seven, which is the noise that
+    // made it useless in exactly the states nobody had audited. Now it scopes to what
+    // is actually on top and says so.
+    MODAL_SELECTOR: "#potWizardOverlay, #rulingsOverlay, #seatMenuOverlay, #cardPickerOverlay, " +
+        "#confirmOverlay, #addChipsOverlay, #seatEditorOverlay",
+
+    openModal() {
+        const open = [...document.querySelectorAll(this.MODAL_SELECTOR)]
+            .filter(el => !el.hidden && getComputedStyle(el).display !== "none");
+        // Last in the DOM wins, which is how they stack.
+        return open.length > 0 ? open[open.length - 1] : null;
+    },
+
+    // A seat sheet on a phone isn't an overlay element, it's a body class — but it
+    // covers the felt just the same.
+    modalScope() {
+        const overlay = this.openModal();
+        if (overlay) return overlay;
+        if (document.body.classList.contains("seatSheetOpen")) {
+            return document.getElementById("seatEditorPanel") || null;
+        }
+        return null;
+    },
+
     occlusion(selector = "#actionBar button, #holdemHeader button, .seat") {
         const offenders = [];
         const warnings = [];
-        [...document.querySelectorAll(selector)].forEach(el => {
+        // While something is open on top, only what is inside it can be judged. The
+        // rest of the page is meant to be unreachable.
+        const scope = this.modalScope();
+        const candidates = [...document.querySelectorAll(selector)]
+            .filter(el => !scope || scope.contains(el));
+        candidates.forEach(el => {
             const rect = el.getBoundingClientRect();
             if (rect.width === 0 || rect.height === 0) return;
 
@@ -504,10 +538,25 @@ const LayoutAudit = {
         if (!enforceOnPointerDevices && matchMedia("(hover: hover)").matches) {
             return { name: `touch targets at least ${minimum}px`, offenders, skipped: "pointer device" };
         }
+        const unmeasured = [];
         this.visibleControls()
             .filter(el => el.type !== "color")
             .filter(el => !(exempt && el.matches(exempt)))
             .forEach(el => {
+                // A control inside a scrolling sheet can sit below its container's
+                // visible area while still having a viewport rect. elementFromPoint at
+                // its centre then returns the sheet, effectiveTarget gives up, and the
+                // check used to pass it in silence — which is how "Confirm Winner(s)",
+                // the button that pays the pot out, went unmeasured for 36 rounds.
+                // Bring it into view before probing.
+                const scroller = el.closest("[style*='overflow'], .modalBody, #potWizardBody, #rulingsSheet, #seatEditorPanel");
+                if (scroller && scroller.scrollHeight > scroller.clientHeight) {
+                    const box = scroller.getBoundingClientRect();
+                    const own = el.getBoundingClientRect();
+                    if (own.bottom > box.bottom || own.top < box.top) {
+                        el.scrollIntoView({ block: "center" });
+                    }
+                }
                 const rect = el.getBoundingClientRect();
                 // Drawn big enough is big enough — no need to probe, and probing wide
                 // elements is where the cap above used to produce nonsense. Seats sit
@@ -515,15 +564,35 @@ const LayoutAudit = {
                 // measuring their reach would report the crowding as a fault.
                 if (rect.width >= minimum - 1 && rect.height >= minimum - 1) return;
 
+                // A checkbox inside a label is tapped by tapping the label, so the
+                // label is the target. Measured rather than probed, because probing
+                // fails on anything scrolled off the viewport — which is how a 24px
+                // checkbox with a 335x44 label around it came up as unprobeable
+                // instead of as the perfectly good target it is.
+                const label = el.closest("label");
+                if (label) {
+                    const lr = label.getBoundingClientRect();
+                    if (lr.width >= minimum - 1 && lr.height >= minimum - 1) return;
+                }
+
                 const size = this.effectiveTarget(el);
-                if (!size) return;
+                // Still can't measure it. That is not a pass — it is the check failing
+                // to run, and quietly returning here is exactly the kind of exemption
+                // that hides real faults. Say so instead.
+                if (!size) {
+                    unmeasured.push(
+                        `${this.describe(el)} :: could not be probed` +
+                        ` (drawn ${Math.round(rect.width)}x${Math.round(rect.height)})`
+                    );
+                    return;
+                }
                 if (size.width >= minimum - 1 && size.height >= minimum - 1) return;
                 offenders.push(
                     `${this.describe(el)} :: hittable ${size.width}x${size.height}` +
                     ` (drawn ${Math.round(rect.width)}x${Math.round(rect.height)})`
                 );
             });
-        return { name: `touch targets at least ${minimum}px`, offenders };
+        return { name: `touch targets at least ${minimum}px`, offenders, unmeasured };
     },
 
     // Tapping the middle of a seat must give you that seat.
@@ -537,6 +606,13 @@ const LayoutAudit = {
     // Reported separately from occlusion because the cause is different: not an
     // overlay on top of the table, but two pieces of the table fighting over a tap.
     seatOwnership() {
+        // Seats behind an open sheet aren't fighting each other for taps — nothing is
+        // meant to reach them at all. Asking the question there produced six offenders
+        // per modal, every one of them the modal doing its job.
+        if (this.modalScope()) {
+            return { name: "a seat's centre belongs to that seat", offenders: [],
+                skipped: "a sheet is open over the table" };
+        }
         const seats = [...document.querySelectorAll(".seat")];
         const offenders = [];
 
@@ -617,7 +693,9 @@ const LayoutAudit = {
             viewport: `${innerWidth}x${innerHeight}`,
             failed: checks.filter(c => c.offenders.length > 0),
             // Things worth knowing that aren't faults — see occlusion() on toasts.
-            warnings: checks.flatMap(c => c.warnings || []),
+            // Controls a check couldn't probe go here too: not a fault, but not a pass
+            // either, and a silent skip is how faults hide.
+            warnings: checks.flatMap(c => [...(c.warnings || []), ...(c.unmeasured || [])]),
             passed: checks.filter(c => c.offenders.length === 0).map(c => c.name),
             clean: checks.every(c => c.offenders.length === 0),
         };