Demo Make Updates to Issue Branch

This lesson walks through diagnosing and fixing issue #1 in the BlockBuster repository: exponential growth of balls when the multiBall power-up is applied. It includes the root cause analysis, a safe fix, and the Git workflow for fetching, checking out, committing, and pushing the change. Repository / user context

Repo: BlockBuster
User: GH900
Issue: #1 — exponential ball growth caused by the multiBall power-up

Problem summary The multiBall handler duplicates all current balls by iterating gameState.balls and pushing clones into the same array. Because the code mutates the array while iterating it, newly pushed balls are also iterated, causing exponential growth on repeated activation. Reproduction (relevant snippet)

// script.js:
case 'multiBall':
if (gameState.balls.length < 5) { // This check is insufficient
    gameState.balls.forEach(ball => {
        gameState.balls.push({...ball});
    });
}

Root cause

Mutating (pushing into) an array while iterating it with forEach causes the loop to process elements added during iteration.
The guard if (gameState.balls.length < 5) only checks at the start; pushing inside the loop invalidates the assumption and allows the array to grow beyond intended limits.

Best practice note

When modifying arrays you are iterating over, iterate over a shallow copy (for example, arr.slice()) or use an index-based loop that references the original length. Always enforce an explicit maximum when duplicating entities to prevent runaway growth.

Safe fix

Iterate over a copy of the original balls so newly added balls are not reprocessed.
Apply a strict upper bound (MAX_BALLS) to stop duplication once reached.

Corrected implementation:

// script.js:
case 'multiBall': {
  const MAX_BALLS = 5;
  // Copy the current balls so we don't iterate newly added ones
  const originals = gameState.balls.slice();

  // Add clones of original balls up to MAX_BALLS total
  for (const ball of originals) {
    if (gameState.balls.length >= MAX_BALLS) break;
    gameState.balls.push({ ...ball });
  }
  break;
}

This ensures:

Only balls that existed at activation are duplicated.
The total number of balls never exceeds MAX_BALLS.

Working with the issue branch (Git workflow) Fetch the remote branch, inspect it locally, check it out to track the remote, apply the fix, test, then commit and push.

Fetch remote branches

git fetch
# sample fetched output
remote: Enumerating objects: 8, done.
remote: Counting objects: 100% (8/8), done.
remote: Compressing objects: 100% (7/7), done.
Total 7 (delta 1), reused 0 (delta 0), pack-reused 0
Unpacking objects: 100% (7/7), 1.87 KiB | 639.00 KiB/s, done.
From https://github.com/sid-990/block-buster
 * [new branch]      1-exponential-ball-growth-with-multiple-multi-ball-power-ups-causes-lag -> origin/1-exponential-ball-growth-with-multiple-multi-ball-power-ups-causes-lag

List local and remote branches

git branch --list -a
* feature-1
  main
  remotes/origin/1-exponential-ball-growth-with-multiple-multi-ball-power-ups-causes-lag
  remotes/origin/HEAD -> origin/main
  remotes/origin/feature-1
  remotes/origin/main

Check out the remote issue branch and set it to track origin

git checkout 1-exponential-ball-growth-with-multiple-multi-ball-power-ups-causes-lag
# sample output:
# Branch '1-exponential-ball-growth-with-multiple-multi-ball-power-ups-causes-lag' set up to track remote branch '1-exponential-ball-growth-with-multiple-multi-ball-power-ups-causes-lag' from 'origin'.
# Switched to a new branch '1-exponential-ball-growth-with-multiple-multi-ball-power-ups-causes-lag'

Make the change and test locally

Open script.js, apply the corrected code above (or an equivalent safe approach).
Run the application locally to confirm the fix and check for regressions.

Example local test command:

# start your local dev server / preview as appropriate for the project
# e.g., npm start
npm start

Commit and push the fix

Reference the issue number in the commit message so GitHub links the commit to the issue (e.g., refs #1 or #1).

git add script.js
git commit -m "fix: avoid exponential ball growth when applying multiBall (refs #1)"
git push origin 1-exponential-ball-growth-with-multiple-multi-ball-power-ups-causes-lag

Sample push output:

# sample output:
Counting objects: 5, done.
Delta compression using up to 8 threads.
Compressing objects: 100% (3/3), done.
Writing objects: 100% (3/3), 450 bytes | 450.00 KiB/s, done.
Total 3 (delta 0), reused 0 (delta 0)
To https://github.com/sid-990/block-buster
   abc1234..def5678  1-exponential-ball-growth-with-multiple-multi-ball-power-ups-causes-lag -> 1-exponential-ball-growth-with-multiple-multi-ball-power-ups-causes-lag

On GitHub

After pushing, refresh the repo page. The commit will appear on the remote branch and GitHub will auto-link the commit to issue #1 if the commit message includes the issue reference.
From there, open a pull request to start code review and CI checks.

Common Git commands used in this workflow

Command	Purpose
`git fetch`	Retrieve updates from the remote without changing local branches
`git branch --list -a`	List local and remote branches
`git checkout <branch>`	Switch to a branch; can set up tracking to origin
`git add <file>`	Stage changes for commit
`git commit -m "msg"`	Commit staged changes with a message
`git push origin <branch>`	Push local branch to the specified remote branch

Next steps

Open a pull request from the branch and continue with code review and CI.
Consider adding a unit or integration test that validates the multiBall behavior to prevent regressions (for example, assert the ball count never exceeds MAX_BALLS after activation).

Links and references

Watch Video

Demo Explain Issue Templates

Pull Request

Introduction

Git and GitHub Basics

GitHub Entities

GitHub Markdown

GitHub Desktop

GitHub Mobile

GitHub Repositories

Issues

Pull Requests

Discussions

Notifications

Gists, Wikis, and GitHub Pages

GitHub Actions

GitHub Copilot

GitHub Codespaces

Manage Your Work with GitHub Projects

Authentication and Security

GitHub Administration

Benefits of Open-Source Community

Benefits of Open Source – Applications

Demo Make Updates to Issue Branch

Watch Video