web VS uvu

i have around 5+ years of experience in web development. starting from angular js 1 to react-native, react & along with typescript. Well aware of most of the modern web tools, esbuild, react-query, swc, rollup, vite, https://modern-web.dev/, testing-library , etc..

In a future release, Angular will replace Karma with the web-test-runner from ModernWeb. That future release might already be Angular 17. ModernWeb is a modern community project that embeds tests into a browser.

So, you write web components and you're interested in expanding the work you put into unit testing them? Well, you've come to the right place. This is just the beginning, but Testing Web Components: the Series is going to lay out for you how Open Web Components and Modern Web help you to do just that. We'll start with how the Open Web Components generator can get you up and running in no time with @web/test/runner right out of the box.

Rocket is an SSG that allows seamless integration of Markdown and WebComponents. There is a project to support the development of web standard technologies called Modern Web, and rocket is a subproject of that project. Other sub-projects are test runner and development server, modern-web for development server, and open-wc for WebComponents development, testing, and linter.

Just setting up a front end dev environment is a lesson in complexity theory

FWIW, because I've been out of web dev for a while and may need to get back into it, I came across this site today:

https://modern-web.dev/

I followed their example ts+preact+esbuild setup and was very pleasantly surprised by the ergonomics.

I was expecting way worse.

astro modern-web

web-test-runner

Last but not least important are ava, uvu and tape; they are a really light and fast test runners.

Vitest: A Vite-native unit test framework. (alternative: Jest, uvu)

Most important here is not to forget to include test.run() at the end… I’ve done that a few times 😅. Notice how we are able to use aliases in lines 1–3. You can see the full range of assert methods available in the uvu docs.

For the past few weeks I’ve taken the (arguably pointless) work of migrating Felte from using Jest to uvu. This is a really tedious work by itself, but one of details that would have made this work even more tedious is that Jest prefers assertions to the style of expect(…).toBe* while uvu gives you freedom to choose any assertion library, although there’s an official uvu/assert module that comes with assertions to the style of assert.is(value, expected).

Hello everyone, I'm using uvu for testing. And installed c8 for coverage. Yet it doesn't seem to be able to pick up test .svelte files. Does anyone knows how to achieve this or any other way of getting .svelte files coverage? Thanks

Yes! There’s even an example test written for the svelte counter demo in the repo’s examples!

uvu is what I’d recommend.

I really enjoy Ava [1] or anything assert-tape-like [2]. "uvu" [3] is getting a lot of love lately, but it's very feature limited and much of it's touted advantages are at the detriment to feature set.

[1] https://github.com/avajs/ava

[2] https://github.com/substack/tape

[3] https://github.com/lukeed/uvu

Jest is great for front-end (or full stack integration) testing, but I feel it's specialized for that use-case and doesn't always play nice with backend/middle-tier testing needs.

For Node, I lean towards UVU by @lukeed due to its simplicity. Its lightweight, fast, supports ESM out of the box. It feels like an easier to setup modern Mocha (without the wide array of plugins).