Browser JavaScript TDD

Use this skill when browser-side behavior needs fast feedback before or alongside end-to-end tests. Keep JavaScript unit tests focused on DOM behavior and use broader browser tests only for integration confidence.

Source Traceability

Primary source: Harry Percival, Test-Driven Development with Python, 3rd ed. Guidance is transformed and paraphrased from chapters 17, 25, and Appendix B, especially browser-based Jasmine tests, DOM fixtures, onload timing, selector refactoring, and JavaScript CI integration.

Workflow

1. Start with the user-visible browser behavior.

   • Decide what the JavaScript owns: DOM update, class toggle, client-side validation, enhancement, or integration hook.
   • Keep server-owned state out of client unit tests.

2. Choose the test boundary.

   • Use JavaScript unit tests for pure functions and DOM manipulation.
   • Use one end-to-end test when Django/server, CSS, and browser wiring must be proven together.
   • Do not use Selenium to exhaustively test JavaScript branches.