This content originally appeared on Go Make Things and was authored by Go Make Things
Years ago, I learned about reduced test cases from Chris Coyier.
So what is a reduced test case, anyway? A reduced test case is a demo/example page you create which reproduces the problem you are having with the least amount of code possible. Only the HTML needed to show the problem content. Only CSS that is related to that reduced HTML. Only the JavaScript related to the problem functionality at hand.
Whenever one of my students is having trouble figuring out what’s wrong with their code, the first thing I do is ask them to create a reduced test case.
Strip out any JavaScript, CSS, or HTML that’s not needed to replicate the problem.
Why?
At a minimum, removing all of the extra noise makes it easier to focus on what’s actually causing the problem.
But often, in the process of removing “stuff you don’t need” the problem stops. That thing you just deleted and then the bug went away? That’s the problem code. Dig into it!
Reduced test cases are the single most effective tool I use for debugging broken code.
The Vanilla JS Academy is a project-based online JavaScript workshop for beginners. Click here to learn more.
This content originally appeared on Go Make Things and was authored by Go Make Things

Go Make Things | Sciencx (2023-05-01T14:30:00+00:00) The power of the reduced test case. Retrieved from https://www.scien.cx/2023/05/01/the-power-of-the-reduced-test-case/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.