Lesson 7
Testing & DevTools
Build a practical mental model for testing & devtools and use it in working JavaScript.
By the end, you will be able to…
- Explain testing & devtools in your own words
- Use testing & devtools in a small program
- Recognize and debug a common failure mode
Build the mental model
A test states an expected result and fails loudly the moment reality diverges from it, catching regressions the moment they're introduced instead of weeks later. DevTools' breakpoints, watch expressions, and network tab complement tests during investigation.
Syntax and working example
Read the code from inputs to output. Predict what it prints, then run it and change one value.
Why this matters
Tests turn 'I think this still works' into 'I know this still works', and are what let you refactor confidently.
Real-world example
Every automated test suite (Vitest, Jest) that runs in CI on every pull request is this exact idea, scaled to a whole codebase.
Common mistakes
- Only testing the happy path and skipping edge cases (empty input, zero, negative numbers)
- Writing a test so vague it can't tell you what specifically broke
- Relying only on manual clicking through the app instead of an automated test
Try it yourself
Challenge
Write a test-style check that catches a bug in a subtract function.
Knowledge check
What is the main value of an automated test over manually checking behavior?
Summary
Tests encode expected behavior so regressions fail loudly and immediately; pair them with DevTools for live investigation.