Nuxt Spec
A "testing done right" Nuxt base layer.
How to use?
Aside from being forked and adjusted as you see fit, nuxt-spec is also available as an NPM package that can be referenced as a single-import with all the features incoming.
Proceed to the installation guide to see how to set it up in your project.
Why?
Nuxt Spec (aka nuxt-spec) is a base layer for Nuxt applications that brings together several frequently used testing libraries and provides extra utility functions to make Nuxt testing easier. I created this project in early 2025 because I was unable to find a convenient "single-dependency" way to start testing my Nuxt apps. I didn't want to repeat the same steps and maintain the same dependencies over and over.
While Nuxt itself does have a dedicated module for testing, to remain as versatile as possible, it has to be combined with other packages (which can be different based on your choice). I am trying to overcome this by defining "The Way". This is both the strength and the weakness of this project. You were warned.
The most important client of nuxt-spec is my Nuxt Ignis template starter that adds up even more ready-to-use cool stuff for your future awesome Nuxt websites.
Stack
Nuxt Spec currently contains:
- vitest v4 as the fundamental testing framework
- @vitest/browser as more advanced browser-native testing runner
- @vitest/ui as a graphical UI for the Vitest test runner
- happy-dom as the headless browser runtime
- playwright-core as the headless browser testing framework
- @vue/test-utils for testing Vue stuff
- @nuxt/test-utils for testing Nuxt stuff
Planned future development:
- reason about (not) using Vitest browser mode (or make it optional)
- a solution for visual regression testing (currently there is an experimental custom solution)
See CHANGELOG.md for the latest updates and features.
More info
- Continue to the configuration to see how you can adjust the default settings.
- See changelog to view the latest changes.
- Visit contributing guide if you want to help with development.