As I became a better programmer, I found myself analyzing code by running it in my head. I was simulating what the computer would do with the data.
This was an advantage back in the day when the
edit-run-inspect cycle was slow due to tooling. sobs in gradle
But now, with modern tooling like vite, we have live reloading.
With a quick feedback cycle, the computer runs code faster than I can simulate it in my head.
splitAtIndex(array, index). It returns two subarrays, split at the index.
splitAtIndex(['a', 'b', 'c'], 1) ⇒ [['a'], ['b', 'c']]
A jest unit test would looks like,
But what about all the other scenarios? We need to test splitting an empty array, splitting at 0, and splitting at length. As we add more unit tests, we simulate the code in our head, then run the test. We are back to
How can we escape this trap? How can we get back to
What if we created a workbench to visualize all the test scenarios for
The same "middle odd left" scenario is visualized:
That is so much easier to understand, and this effect would be compounded with a more complicated system under test.
To avoid duplicating the scenario in both the unit test and workbench, we can extract it into
Jest can be made generic:
The workbench visualizes the scenarios.
This can be implemented with any web framework. The key implementation idea is to iterate over the scenarios in both jest and the workbench to trivialize adding a new scenario to simply adding another
Now adding a new scenario doesn't requires me to simulate the code anymore! All I need to do is add the new scenario input and any expected. I let the computer produce the actual result for me to inspect. If the actual result is correct, I copy it into expected. If it is not, it means I have a bug. I add the expected and then fix the code until expected is the same as actual.
That is too abstract, so let's go over the example of adding the split at "start" scenario.
The actual is correct in this case.
Remember all these steps can be done with the editor side-by-side with the visualization. There is no context switching to the visualization; the visualization is live reloading as we type.
Do you want to stop running code in your head? You're in luck, Battlefy is hiring.