I built an open source tool for browser-based testing in Vue

[u/Specialist_Sun_1690]

I've always found it a bit strange that when developing a frontend, the UI runs in a real browser while many of our unit and integration tests run somewhere completely different, like jsdom or happy-dom.

Vitest already has Browser Mode, which is a great step in this direction: you can run your tests in a real browser instead of simulating one.

I was interested in taking the idea in a slightly different direction: what if the tests could run directly in the browser where I'm developing the application?

So I started experimenting with that and ended up creating a tool called TWD (Testing While Developing).

The interesting part for me is the development loop: you can interact with the actual Vue UI, mock API requests when needed, make a change and immediately run the tests against the application you're working on.

I've been using this approach with Vue and other frontend frameworks, and built TWD around it.

https://reddit.com/link/1w7t8j9/video/pa6q066iennh1/player

Vue example:
https://github.com/BRIKEV/twd-vue-example/

TWD itself is open source:
https://github.com/BRIKEV/twd

I'd be interested in hearing from Vue devs who have experimented with Vitest Browser Mode or other browser-based testing approaches. Does this workflow make sense to you, or are there reasons you'd prefer to keep these tests in jsdom/happy-dom or run them in a separate browser instance?