I am a huge fan of testing, but for the most part, you either have to remember to run your preferred test runner of choice in some kind of watch mode and keep an eye on any terminal output for broken tests.
If you're using Karma, it opens up a web browser and can steal away focus at times when tests re-run. Jest is great for watching tests and output the result to the console, but if you don't have it visible at all times, the console output can be missed.
Which is why I want to talk about Wallaby.js. It's a test runner which runs your tests in your IDE/code editor of choice and provides distraction-free feedback to you when tests pass or fail.
I use Visual Studio Code as my editor of choice and Wallaby runs inside of it, as well as almost every other editor you can think of. Furthermore, you get realtime inline test feedback.
As you can see, I have a passing test and a test which is broken (highlighted by the shades of red on the left-hand side).
If you were to open up the code being tested, you get code coverage indicators as well as whether or not a test is passing or failing on specific pieces of your code.
If you look at the status bar in VSCode (or whatever editor you happen to be using) you will see some useful information:
The percentage indicator there changes depending on the file you have open. Wallaby automatically checks to see how much coverage you have. In the case of the file, I have open, I have achieved 100% code coverage. To the right, you can see I have 316 passing tests and 2 failing tests (indicated by the x and checkmark).
The file in question being tested looks like this in VSCode:
The number of times I have been writing code and noticed I have inherently broken a test thanks to Wallaby have been too many to count. Wallaby pays for itself the first time you use it. If you do not have any tests, maybe it will take a bit longer to pay itself off.
If you are a fan of TDD (Test Driven Development), Wallaby is the perfect accompaniment for TDD fans as you get that realtime information (the inline coloured blocks are super helpful). Wallaby actually highlights how poor traditional test runners really are.
If at any time you get stuck, the Wallaby team are very responsive (as can be seen on their GitHub here. They respond very fast to questions/issues and always manage to resolve them (even going as far as providing you with configuration and code examples).
I've only ever had a couple of interactions with the team whilst trying to get Wallaby configured for Aurelia (a couple of years ago) and they really know their product, providing a solution fast.
The Downsides
Really, there is only one downside and honestly, it's not that big of a downside. The cost of Wallaby can be a little expensive, especially if you're a freelancer or solo developer. You have to pay for a year upfront, no monthly subscription options are available (although, the Wallaby team should consider it).
At $175 AUD per year, it might be a cost some cannot afford. Although, it only works out to be $14 AUD per month (around the cost of a Netflix subscription). If you work for a company, I highly recommend asking them to purchase you a company licence at a cost of $350 AUD.
You can also try it for free to see if it works for you as well, so you do not have to commit to an upfront purchase. When you realise how productive Wallaby makes you and how great the support is (should you need it), you realise that Wallaby isn't expensive at all.
Latest comments (3)
I really love the concept. I was tracking this when they first launched. I didn’t realize it became a paid product.
Honestly that is the thing that will prevent its adoption.
Don’t get me wrong, lots of developers have paid for IDE over the years. But I feel web development has been strongly rooted in open source and free tools. It’s typically hosting, or team management meeting, or some other add on that is paid for.
For me, this would be the only tool I would be paying for in my work flow. That makes me rethink if I should pay. And I would just fall back to what I was already doing, which is typically Jest.
Really great write up. I am glad you found it worth while to pay.
I am just like you. I prefer open-source tools and software over paid in most cases. And in the case of open-source where the creator has made it so you can support them, I do. Codesandbox is a great example, I have been a Patreon member since they launched basically, it's a great product.
For me, I have been paying for certain kinds of software for years. Sublime Text Editor was the first proper piece of software I bought related to development. I still have an ST 3 licence, but I find myself using VSCode these days which is a solid free IDE.
Before VSCode, I was paying for a Webstorm subscription, which probably worked out to be the same cost as my Wallaby subscription does now.
Not really a development tool, but I pay for Grammarly which has really helped with my writing. As I have gone up in salary, my attitude towards paying for things has changed. Sometimes, open-source is great but cannot compete with paid software (like Microsoft Office, which I also pay for).
Jest has a great watch feature out-of-the-box, it just doesn't offer inline test coverage or metrics. I like how Wallaby shows those coloured boxes on the left and intelligently knows when you open a file if you have covered it in tests or not. The ability to console.log inside of tests and see the output is super helpful. It's the one tool that doesn't have an open-source equivalent. If there was a solid Wallaby competitor that was open-source, I would definitely be using it.
But, understandably and respectfully, some people are more comfortable with open-source tools and software, and that's fine. Wallaby is probably a bit expensive for some, for something that just runs tests. I've found value in it, but I think many will find it hard to reconcile the cost (unless it's employer-funded).
Thanks for the comment, Zane.
I don’t disagree.
I have or still do pay for a lot of the same things you do. I have sublime 3, Grammarly, and have donated to many things.
Recently I purchased Sizzy and have fallen in love.