The Front-end TDD challenge

on YouTube ↗28m

" summary

Claim: a front end app is developed entirely by TDD without opening the browser, using WebStorm, npm/karma and Web Components. The talk codes a modal component step by step, asserts DOM parts exist, implements open and close methods that toggle the overlay hidden class, refactors, and keeps tests green; the demos show tests passing and the component working. Notes: audience estimates ~10% do TDD and the repository and slides are provided.

AI-written summary · about

" chapters (6)

1. 0:00Start
2. 23:04Test Drive Quiz
3. 23:42Scoreboard
4. 23:54Code that goes to production without tests is considered to be
5. 24:28What are the benefits of testing code? (select all the applies)
6. 25:01What type of testing is not part of TDD?

" related talks

• 33mTDCD: Test Driven Component DevelopmentTim Doherty · JSConf US 2019
• 17mThe pragmatic front-end testerAdrià Fontcuberta · dotJS 2019
• 01h 00mFront end First — surviving with testing in JavaScriptMichele Aponte · Codemotion Rome 2016
• 33mTDD w aplikacjach webowychMaja Miarecki · Infoshare F3 2022
• 42mTest-Driven Development in JavascriptAndrey Kucherenko · OdessaJS 2015
• 32mDOM Testing: Test Your Frontend Apps More Easily and EffectivelyWilliam Marques · Devoxx France 2022
• 30mTesting Front-End ApplicationsJakub Janczyk · FrontEnd Con 2018
• 51mToDo: Test Driven Development and AccessibilityRita Castro · JNation 2026