vscode-pets VS nyc

For those who don’t know, Marc is responsible for many of the cute critters in the incomparable vscode-pets extension. This extension brings our DevRel team at SeMI tiny morsels of joy and respite on a regular basis, and I couldn’t have been more excited to find out one of the wizards behind the curtain. In his talk, Marc shared his own experiences of how he turned his interests and skill sets to create fun, meaningful connections with his tech communities. For example, he built a game, and created 8-bit art and avatars for himself, others, and his clients. He also shared examples of how others combine their own unique hobbies and skills like music, comedy, art, cross-stitching, and sewing to do the same.

Today, I wanted to share what I have learned working on the issue of creating a new pet animations for the VSCode extension VS Code Pets.

During hacktoberfest month, I contributed to the vscode-pets which was a VSCode extension with cute pets to play with while coding. I really liked the general idea, plus, the founder and maintainer of the project was always helpful and quick to respond. It was such a nice contributing experience that I continued making contributions even after the fest was done.

not laser cat, but maybe you can hack this one to add your own

One my Hacktoberfest contributions was made to the cool VSCode extension project called VS Code Pets. It allows you to add and play with different cute pets in your VS Code window to boost productivity and help you stay focused.

My first 2 PRs(1st & 2nd) were likely newbie level and I wanted to contribute to something more meaningful, something that would challenge me intellectually. I spent a good week or so stressing over what to contribute to next on the issues page, only to stress even more. What became clear to me was that if you are scrolling and scrolling through the issues page just to find the perfect issue for your use case, you're doomed... there are another 20K people doing the same just to get swags. That way, you are probably spending more energy searching than you would have spent on writing a new feature from scratch or a tough bug fix.

Native code coverage via v8 or istanbul.

Writing tests is essential, and knowing whether you test all the required cases for your logic is even more critical. The most common testing coverage tool is Istanbul, where you can see how well your tests exercise your code by lines, functions, and branches. Below is an example of how the test coverage report looks in your terminal:

Here is a quote from istanbul, one of the most used code coverage tool:

Unit testing framework was already implemented, using Vitest so I started hacking by setting up a coverage provider to explicitly identify the covered/uncovered lines and mentioned this to the maintainer in the comments. I used Istanbul 🇹🇷 for this purpose.

Your project probably has a coverage report. If you’re using Jest as your unit test runner, generating a coverage report is embedded in it. It is done with Istanbul under the hood, which generates a nice HTML page presenting the entire project unit test coverage.

> This is a rant written by someone with just enough understanding to be dangerous, but not quite enough wisdom to know why things are still the way they are. Most of the complaints raised are subtly inaccurate.

Author seems aware of CAP_NET_BIND_SERVICE: https://source.small-tech.org/site.js/app/-/issues/169 and https://github.com/istanbuljs/nyc/issues/1281 – the "side effects" are NodeJS explicitly checking for it, so that's a NodeJS thing and not a Linux thing.

Yet curiously it's completely unmentioned in this article, in spite that this is probably what started the author's dislike of privileged ports. I guess it was inconvenient as it got in the way of angrily ranting.

This approach will create two json coverage files, which will be merged together by NYC. Therefore the results will be purely local. If You don't mind using online tools like Codecov or Coveralls for merging data from different tests, then go ahead and use them. They will probably also be more accurate. But if You still want to learn how to get coverage from E2E, then please read through

https://istanbul.js.org/ measures how much of your code is covered by tests

Jest uses a package called Istanbul to provide test coverage metrics such as statement, branch, function, and line coverage so that you can understand and enforce the quality of your test suite, providing more confidence in releases.

So let’s see if nyc (the code coverage generator) can help with that. Hmm… this documentation seems interesting! So basically what I understand from it is that I need to collect all the reports from the different packages and then run the nyc report over it. The flow should be like this: