This is a presentation I gave at JSLou on Wednesday, August 17th, 2016.
Figuring out the root cause of a bug is often the hardest part of fixing it. I will show how to use your browser's built-in developer tools to track down bugs so you can fix them.
How to run the examples:
git clone https://github.com/TwoScoopGames/Cluster-Junk.git
git checkout ed47c187149d06104d3fa3eca7259b4efb9d2719
- Download file cluster-junk-bugs.patch
git apply <cluster-junk-bugs.patch
- Open http://localhost:4000
- Open your browser's developer tools (Usually the F12 key on PCs)
So you have a problem...
- Complex app with complex problems.
- Not every bug is a crash
- Admiral Grace Hopper
- console.log / println
- interactive debugger
- Divide and Conquer
- Logging complex objects
- Example: rain doesn't draw
- How does a computer know where to
- Think of a stack of plates
- Example: stacktrace.html
- Example: crash when you click to start game
Pause the program, and look at the variables.
- step in/over/out
- watch expressions
- Example: waves should be offset every other row