Through the Wall

why testing matters

$ git blame pacman

Who was here last presentation?

What went wrong then?

I tested it hundreds of times

AT HOME voice command ✓ Pac-Man ✓ DURING PRESENTATION voice command ✗ Pac-Man ✗

“It worked on my computer”

Bug 1: the voice command

AT HOME phone wifi server next slide ✓ AT SCHOOL phone 5G ✗ never heard it waiting… mobile data: OFF for that one app
TAKE TWO

Or by voice command?

waiting

Bug 2: Pac-Man walked into a wall

The Pac-Man slide, with Pac-Man sitting inside the solid block in the middle of the maze

Why was he in a wall?

Nothing stopped him.

What stops him at a wall?

A check in the middle of each square.

When does that check run?

Only if a jump lands near the middle.

When wouldn’t it land there?

When the jumps are big.

What makes the jumps big?

Fewer frames a second.

LIVE DEMO

Pac-Man lives on a grid

In the middle of each square he asks:
turn? keep going? stop?

SLOW MOTION

A game is a flipbook

The screen is redrawn about 60 times a second.
Each time, he jumps a little bit. Each dot is one jump.

“Am I in the middle?”

MIDDLE the zone: “close enough” snap lands in the zone? snap to the middle, then decide jump, jump, jump →

A jump hardly ever lands exactly in the middle,
so the game checks for close enough.

SLOW MOTION · 60 FPS

Small jumps land in the zone

Every square gets a check. He sees the wall coming and stops.

SLOW MOTION · 24 FPS

Slow computer: big jumps

A big jump can hop right over the zone.
No check → nobody tells him to stop → into the wall.

SLOW MOTION · 120 FPS

Very fast computer: tiny jumps

The jump is so small he’s still in the zone —
snapped back to the middle, every frame. He never moves.

TESTING THE GUESS

135 computers in one second

Steady frames: only 23–24 fail.
Wobbly, real ones: 20–35. Above about 65: frozen.

In the real game

The Pac-Man slide at normal speed: he has stopped in front of the middle block
normal: stops at the block
The Pac-Man slide with slow frames faked: he is inside the middle block
faked slow frames: inside it

I made the browser pretend to be slow.
Then I could replicate it every time.

Why I couldn't repeat it

60 fps works fine on its own screen (how I always tested) fewer frames walks through walls more pixels to draw, or a slower refresh (30 Hz, 24 Hz…)
LIVE DEMO · THE ORIGINAL

Pick a computer, then play

arrow keys or a controller · LB / RB change computer · START restarts
on slow he can only turn at every other square: a skipped check is a skipped turn

The fix: never skip a stop

LOOK OUT NOW AND THEN missed it! A BUS ROUTE running late? still stops at every stop

Don’t ask “am I near a middle right now?”
Ask “which middles did I pass?” — and stop at each one.

Split the big jump

OLD — one big jump in the wall NEW — stop at every middle on the way CHECK: wall ahead → stop rest of the jump: cancelled

Walk to the middle → check → walk what’s left.
Big jumps, tiny jumps — every middle gets its check.

// old: only if a jump lands near a middle
if (nearMiddle(pac)) decide(pac);
move(pac, jump);
// new: stop at every middle we pass
travel(pac, jump);   // calls decide()
                     // at each middle

The whole fix

function travel(pac, distance) {
  while (distance > 0) {
    if (atMiddle(pac)) decide(pac);      // turn? stop?
    if (pac.stopped) return;             // wall ahead: throw the rest away

    const toMiddle = distanceToNextMiddle(pac);
    const step = Math.min(distance, toMiddle);   // never past a middle
    moveBy(pac, step);
    distance -= step;
  }
}
LIVE DEMO · FIXED

Now try to break it

arrow keys or a controller · LB / RB change computer · START restarts

Why not just bump into walls?

// move, and if you hit a wall, push back
if (!hitsWall(pac, wanted)) go(wanted);
// stop at every middle and decide
travel(pac, jump);

Both are holding ↑. He’s exactly as wide as the corridor,
so bumping only fits through the gap if he’s perfectly lined up.

Remember

  • Test in front of real people.
  • Test the situations, not just the code.Wifi and 5G. The laptop screen and the big monitor. Slow and fast.
  • Can’t repeat a bug? Ask what was different.Then fake that difference on purpose.
QR code to playground.hackenshaw.com/join

playground.hackenshaw.com/join