Select the types of activity you want to include in your feed.
[READ-ONLY] Mirror of https://github.com/danielroe/nuxt-vitest. An vitest environment with support for testing code that needs a Nuxt runtime environment
···11-# vitest-environment-nuxt
11+# nuxt-vitest
2233[![npm version][npm-version-src]][npm-version-href]
44[![npm downloads][npm-downloads-src]][npm-downloads-href]
···7788> A vitest environment for testing code that needs a [Nuxt](https://nuxt.com) runtime environment
991010-- [✨ Changelog](https://github.com/danielroe/vitest-environment-nuxt/blob/main/CHANGELOG.md)
1010+- [✨ Changelog](https://github.com/danielroe/nuxt-vitest/blob/main/CHANGELOG.md)
11111212> **Warning**
1313> This library is in active development and you should pin the patch version before using.
14141515## Installation
16161717-1. First install `vitest-environment-nuxt`:
1717+1. First install `nuxt-vitest`:
18181919```bash
2020-pnpm add -D vitest-environment-nuxt
2020+pnpm add -D nuxt-vitest
21212222# or
2323-yarn add --dev vitest-environment-nuxt
2424-npm i -D vitest-environment-nuxt
2323+yarn add --dev nuxt-vitest
2424+npm i -D nuxt-vitest
2525```
26262727-2. Then create a `vitest.config.mjs` with the following content:
2727+2. Add `nuxt-vitest` to your `nuxt.config.js`:
28282929```js
3030-import { defineConfigWithNuxtEnv } from 'vitest-environment-nuxt/config'
3030+export default defineNuxtConfig({
3131+ // ...
3232+ modules: [
3333+ 'nuxt-vitest'
3434+ ]
3535+})
3636+```
31373232-export default defineConfigWithNuxtEnv({
3838+3. Then create a `vitest.config.mjs` with the following content:
3939+4040+```js
4141+import { defineConfigWithNuxt } from 'nuxt-vitest'
4242+4343+export default defineConfigWithNuxt({
3344 // any custom vitest config you require
3445})
3546```
4747+36483749That's it. Now when you run `vitest` your Nuxt environment will be available throughout your tests.
38503951## 👉 Important notes
40524141-When you run your tests within `vitest-environment-nuxt`, they will be running in a [`happy-dom`](https://github.com/capricorn86/happy-dom) environment. Before your tests run, a global Nuxt app will be initialised (including, for example, running any plugins or code you've defined in your `app.vue`).
5353+When you run your tests within `nuxt-vitest`, they will be running in a [`happy-dom`](https://github.com/capricorn86/happy-dom) environment. Before your tests run, a global Nuxt app will be initialised (including, for example, running any plugins or code you've defined in your `app.vue`).
42544355This means you should be take particular care not to mutate the global state in your tests (or, if you have, to reset it afterwards).
44564557## 🛠️ Helpers
46584747-`vitest-environment-nuxt` provides a number of helpers to make testing Nuxt apps easier.
5959+`nuxt-vitest` provides a number of helpers to make testing Nuxt apps easier.
48604961### `mountSuspended`
5062···5567`mockNuxtImport` allows you to mock Nuxt's auto import functionality. For example, to mock `useStorage`, you can do so like this:
56685769```ts
5858-import { mockNuxtImport } from 'vitest-environment-nuxt/utils'
7070+import { mockNuxtImport } from 'nuxt-vitest/utils'
59716072mockNuxtImport('useStorage', () => {
6173 return () => {
···82948395<!-- Badges -->
84968585-[npm-version-src]: https://img.shields.io/npm/v/vitest-environment-nuxt?style=flat-square
8686-[npm-version-href]: https://npmjs.com/package/vitest-environment-nuxt
8787-[npm-downloads-src]: https://img.shields.io/npm/dm/vitest-environment-nuxt?style=flat-square
8888-[npm-downloads-href]: https://npmjs.com/package/vitest-environment-nuxt
8989-[github-actions-src]: https://img.shields.io/github/actions/workflow/status/danielroe/vitest-environment-nuxt/ci.yml?branch=main&style=flat-square
9090-[github-actions-href]: https://github.com/danielroe/vitest-environment-nuxt/actions?query=workflow%3Aci
9191-[codecov-src]: https://img.shields.io/codecov/c/gh/danielroe/vitest-environment-nuxt/main?style=flat-square
9292-[codecov-href]: https://codecov.io/gh/danielroe/vitest-environment-nuxt
9797+[npm-version-src]: https://img.shields.io/npm/v/nuxt-vitest?style=flat-square
9898+[npm-version-href]: https://npmjs.com/package/nuxt-vitest
9999+[npm-downloads-src]: https://img.shields.io/npm/dm/nuxt-vitest?style=flat-square
100100+[npm-downloads-href]: https://npmjs.com/package/nuxt-vitest
101101+[github-actions-src]: https://img.shields.io/github/actions/workflow/status/danielroe/nuxt-vitest/ci.yml?branch=main&style=flat-square
102102+[github-actions-href]: https://github.com/danielroe/nuxt-vitest/actions?query=workflow%3Aci
103103+[codecov-src]: https://img.shields.io/codecov/c/gh/danielroe/nuxt-vitest/main?style=flat-square
104104+[codecov-href]: https://codecov.io/gh/danielroe/nuxt-vitest