angular-testing-library VS test-utils

A few months ago some colleagues told me about their smooth experience with Jest and Testing Library in a Vue application. Last week I gave it a shot. It took me a couple of hours to remove all Karma and Jasmine dependencies, and to properly configure this new testing platform. After that, I tried to refactor a small component by test driven development, again. This time, it was easier to render each component and its dependencies. However, there weren't enough enough examples and real use cases for testing the actual behavior of the components with ease (even with resources like this or this).

Angular Testing Library Repository Buenas prácticas con Angular Testing Library

Unlike Vue Test Utils or Testing Library, the mount() in Playwright does not work the same way. It does not accept a second parameter as additional Vue component options. To pass a prop upon mounting, we will use JSX syntax, as follows:

When it comes to testing Vue components, Vue Test Utils is the official testing library that provides a rich set of utilities for interacting with and asserting on components in a Vue application. However, just like any library, there are always opportunities for enhancements and additions to further improve the testing experience.

I found this github issue from years ago that explains this is a known issue at the time and includes a workaround, but I'd prefer not to use a workaround. https://github.com/vuejs/test-utils/issues/194

Same question https://github.com/vuejs/test-utils/issues/1718

I was working on a Vue 3 project where I had to write an integration test with vue test utils for a component that relied on Pinia, while at the same time needing to set some initial state on a Pinia store before mounting that component. This caused a problem:

Issue: https://github.com/vuejs/test-utils/issues/1218 SSR package: https://github.com/vuejs/core/tree/main/packages/server-renderer

spyOn is blocked by https://github.com/vuejs/vue-next/pull/4216. We have a PR for that in Test Utils, once this is merged: https://github.com/vuejs/vue-test-utils-next/pull/811

This was a tricky one because at a first glance it may seem that I have a typescript problem in project which is technically correct, but actually this is a bug in @vue/test-utils-next library which was introduced in 2.0.0-rc.14 version. Installing 2.0.0-rc.13 or setting skipLibCheck: true in tsconfig.json solves this. For my case I've chosen the first approach.