test: migrate to vitest

Author: posva

packages/router/__tests__/RouterLink.spec.ts

@@ -1,5 +1,5 @@
 /**
- * @jest-environment jsdom
+ * @vitest-environment jsdom
  */
 import { RouterLink } from '../src/RouterLink'
 import { RouteQueryAndHash, MatcherLocationRaw } from '../src/types'
@@ -16,6 +16,7 @@ import { RouteRecordNormalized } from '../src/matcher/types'
 import { routerKey } from '../src/injectionSymbols'
 import { tick } from './utils'
 import { mount } from '@vue/test-utils'
+import { vi, describe, expect, it } from 'vitest'
 
 const records = {
   home: {} as RouteRecordNormalized,
@@ -366,9 +367,9 @@ async function factory(
       return this.history.base + to.fullPath
     },
     options: {} as Partial<RouterOptions>,
-    resolve: jest.fn(),
-    push: jest.fn().mockResolvedValue(resolvedLocation),
-    replace: jest.fn().mockResolvedValue(resolvedLocation),
+    resolve: vi.fn(),
+    push: vi.fn().mockResolvedValue(resolvedLocation),
+    replace: vi.fn().mockResolvedValue(resolvedLocation),
   }
   router.resolve.mockReturnValueOnce(resolvedLocation)
 
@@ -800,7 +801,7 @@ describe('RouterLink', () => {
   })
 
   it('allows adding more click listeners', async () => {
-    const onClick = jest.fn()
+    const onClick = vi.fn()
     const { router, wrapper } = await factory(
       START_LOCATION_NORMALIZED,
       { to: locations.basic.string, onClick },
@@ -944,8 +945,8 @@ describe('RouterLink', () => {
             return this.history.base + to.fullPath
           },
           options: {} as Partial<RouterOptions>,
-          resolve: jest.fn(),
-          push: jest.fn().mockResolvedValue(resolvedLocation),
+          resolve: vi.fn(),
+          push: vi.fn().mockResolvedValue(resolvedLocation),
         }
         router.resolve.mockReturnValueOnce(resolvedLocation)
 

packages/router/__tests__/RouterView.spec.ts

@@ -1,14 +1,15 @@
 /**
- * @jest-environment jsdom
+ * @vitest-environment jsdom
  */
 import { RouterView } from '../src/RouterView'
 import { components, RouteLocationNormalizedLoose } from './utils'
 import { START_LOCATION_NORMALIZED } from '../src/location'
 import { markRaw } from 'vue'
 import { createMockedRoute } from './mount'
-import { mockWarn } from 'jest-mock-warn'
 import { mount } from '@vue/test-utils'
 import { RouteLocationNormalized } from '../src'
+import { describe, expect, it } from 'vitest'
+import { mockWarn } from './vitest-mock-warn'
 
 // to have autocompletion
 function createRoutes<T extends Record<string, RouteLocationNormalizedLoose>>(

packages/router/__tests__/__snapshots__/RouterLink.spec.ts.snap

@@ -1,3 +1,3 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`RouterLink v-slot provides information on v-slot 1`] = `"<a aria-current="page" href="/home" class="router-link-active router-link-exact-active"><span> route: {"href":"/home","fullPath":"/home","path":"/home","params":{},"meta":{},"query":{},"hash":"","matched":[{}],"name":"home"} href: "/home" isActive: "true" isExactActive: "true" </span></a>"`;
+exports[`RouterLink > v-slot > provides information on v-slot 1`] = `"<a aria-current="page" href="/home" class="router-link-active router-link-exact-active"><span> route: {"href":"/home","fullPath":"/home","path":"/home","params":{},"meta":{},"query":{},"hash":"","matched":[{}],"name":"home"} href: "/home" isActive: "true" isExactActive: "true" </span></a>"`;

packages/router/__tests__/__snapshots__/RouterView.spec.ts.snap

@@ -1,6 +1,6 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`RouterView displays deeply nested views 1`] = `
+exports[`RouterView > displays deeply nested views 1`] = `
 "<div>
   <h2>Nested</h2>
   <div>
@@ -10,19 +10,19 @@ exports[`RouterView displays deeply nested views 1`] = `
 </div>"
 `;
 
-exports[`RouterView displays nested views 1`] = `
+exports[`RouterView > displays nested views 1`] = `
 "<div>
   <h2>Nested</h2>
   <div>Foo</div>
 </div>"
 `;
 
-exports[`RouterView v-slot passes a Component and route 1`] = `
+exports[`RouterView > v-slot > passes a Component and route 1`] = `
 "<span>home</span>
 <div>Home</div>"
 `;
 
-exports[`RouterView warnings does not warn RouterView is wrapped 1`] = `
+exports[`RouterView > warnings > does not warn RouterView is wrapped 1`] = `
 "<div>
   <div>Home</div>
 </div>"

packages/router/__tests__/encoding.spec.ts

@@ -5,6 +5,7 @@ import {
   encodeQueryValue,
   // decode,
 } from '../src/encoding'
+import { describe, expect, it } from 'vitest'
 
 describe('Encoding', () => {
   // all ascii chars with a non ascii char at the beginning

packages/router/__tests__/errors.spec.ts

@@ -13,8 +13,9 @@ import type {
   RouteLocationRaw,
   RouteLocationNormalized,
 } from '../src/typed-routes'
-import { mockWarn } from 'jest-mock-warn'
 import { START_LOCATION_NORMALIZED } from '../src/location'
+import { vi, describe, expect, it, beforeEach } from 'vitest'
+import { mockWarn } from './vitest-mock-warn'
 
 const routes: Readonly<RouteRecordRaw>[] = [
   { path: '/', component: components.Home },
@@ -25,8 +26,8 @@ const routes: Readonly<RouteRecordRaw>[] = [
   { path: '/async', component: () => Promise.reject('failed') },
 ]
 
-const onError = jest.fn()
-const afterEach = jest.fn()
+const onError = vi.fn()
+const afterEach = vi.fn()
 function createRouter() {
   const history = createMemoryHistory()
   const router = newRouter({

packages/router/__tests__/guards/afterEach.spec.ts

@@ -1,5 +1,6 @@
 import { createDom, newRouter as createRouter } from '../utils'
-import { RouteRecordRaw } from 'src/types'
+import { RouteRecordRaw } from '../../src/types'
+import { vi, describe, expect, it, beforeAll } from 'vitest'
 
 const Home = { template: `<div>Home</div>` }
 const Foo = { template: `<div>Foo</div>` }
@@ -24,7 +25,7 @@ describe('router.afterEach', () => {
   })
 
   it('calls afterEach guards on push', async () => {
-    const spy = jest.fn()
+    const spy = vi.fn()
     const router = createRouter({ routes })
     router.afterEach(spy)
     await router.push('/foo')
@@ -37,7 +38,7 @@ describe('router.afterEach', () => {
   })
 
   it('can be removed', async () => {
-    const spy = jest.fn()
+    const spy = vi.fn()
     const router = createRouter({ routes })
     const remove = router.afterEach(spy)
     remove()
@@ -46,7 +47,7 @@ describe('router.afterEach', () => {
   })
 
   it('calls afterEach guards on multiple push', async () => {
-    const spy = jest.fn()
+    const spy = vi.fn()
     const router = createRouter({ routes })
     await router.push('/nested')
     router.afterEach(spy)
@@ -67,8 +68,8 @@ describe('router.afterEach', () => {
   })
 
   it('removing an afterEach guard within one does not affect others', async () => {
-    const spy1 = jest.fn()
-    const spy2 = jest.fn()
+    const spy1 = vi.fn()
+    const spy2 = vi.fn()
     const router = createRouter({ routes })
     router.afterEach(spy1)
     const remove = router.afterEach(spy2)

packages/router/__tests__/guards/beforeEach.spec.ts

@@ -2,6 +2,7 @@ import fakePromise from 'faked-promise'
 import { createDom, tick, noGuard, newRouter as createRouter } from '../utils'
 import { RouteRecordRaw } from '../../src/types'
 import { RouteLocationRaw } from '../../src'
+import { vi, describe, expect, it, beforeAll } from 'vitest'
 
 const Home = { template: `<div>Home</div>` }
 const Foo = { template: `<div>Foo</div>` }
@@ -32,7 +33,7 @@ describe('router.beforeEach', () => {
   })
 
   it('calls beforeEach guards on navigation', async () => {
-    const spy = jest.fn()
+    const spy = vi.fn()
     const router = createRouter({ routes })
     router.beforeEach(spy)
     spy.mockImplementationOnce(noGuard)
@@ -41,7 +42,7 @@ describe('router.beforeEach', () => {
   })
 
   it('can be removed', async () => {
-    const spy = jest.fn()
+    const spy = vi.fn()
     const router = createRouter({ routes })
     const remove = router.beforeEach(spy)
     remove()
@@ -51,7 +52,7 @@ describe('router.beforeEach', () => {
   })
 
   it('does not call beforeEach guard if we were already on the page', async () => {
-    const spy = jest.fn()
+    const spy = vi.fn()
     const router = createRouter({ routes })
     await router.push('/foo')
     router.beforeEach(spy)
@@ -61,7 +62,7 @@ describe('router.beforeEach', () => {
   })
 
   it('calls beforeEach guards on navigation between children routes', async () => {
-    const spy = jest.fn()
+    const spy = vi.fn()
     const router = createRouter({ routes })
     await router.push('/nested')
     router.beforeEach(spy)
@@ -83,7 +84,7 @@ describe('router.beforeEach', () => {
   })
 
   it('can redirect to a different location', async () => {
-    const spy = jest.fn()
+    const spy = vi.fn()
     const router = createRouter({ routes })
     await router.push('/foo')
     spy.mockImplementation((to, from, next) => {
@@ -125,7 +126,7 @@ describe('router.beforeEach', () => {
       return
     })
 
-    const spy = jest.spyOn(history, 'pushState')
+    const spy = vi.spyOn(history, 'pushState')
     await router.push({ path: '/', state: { a: 'a' } })
     expect(spy).toHaveBeenCalledTimes(1)
     // called before redirect
@@ -142,7 +143,7 @@ describe('router.beforeEach', () => {
     const router = createRouter({ routes })
     await router.push('/foo')
 
-    const spy = jest.spyOn(history, 'pushState')
+    const spy = vi.spyOn(history, 'pushState')
     await router.push({ path: '/redirect', state: { a: 'a' } })
     expect(spy).toHaveBeenCalledTimes(1)
     // called before redirect
@@ -156,7 +157,7 @@ describe('router.beforeEach', () => {
   })
 
   async function assertRedirect(redirectFn: (i: string) => RouteLocationRaw) {
-    const spy = jest.fn()
+    const spy = vi.fn()
     const router = createRouter({ routes })
     await router.push('/')
     spy.mockImplementation((to, from, next) => {
@@ -185,7 +186,7 @@ describe('router.beforeEach', () => {
   })
 
   it('is called when changing params', async () => {
-    const spy = jest.fn()
+    const spy = vi.fn()
     const router = createRouter({ routes: [...routes] })
     await router.push('/n/2')
     spy.mockImplementation(noGuard)
@@ -196,7 +197,7 @@ describe('router.beforeEach', () => {
   })
 
   it('is not called with same params', async () => {
-    const spy = jest.fn()
+    const spy = vi.fn()
     const router = createRouter({ routes: [...routes] })
     await router.push('/n/2')
     spy.mockImplementation(noGuard)
@@ -224,15 +225,15 @@ describe('router.beforeEach', () => {
     const [p1, r1] = fakePromise()
     const [p2, r2] = fakePromise()
     const router = createRouter({ routes })
-    const guard1 = jest.fn()
+    const guard1 = vi.fn()
     let order = 0
     guard1.mockImplementationOnce(async (to, from, next) => {
       expect(order++).toBe(0)
       await p1
       next()
     })
     router.beforeEach(guard1)
-    const guard2 = jest.fn()
+    const guard2 = vi.fn()
     guard2.mockImplementationOnce(async (to, from, next) => {
       expect(order++).toBe(1)
       await p2
@@ -256,7 +257,7 @@ describe('router.beforeEach', () => {
   })
 
   it('adds meta information', async () => {
-    const spy = jest.fn()
+    const spy = vi.fn()
     const router = createRouter({ routes })
     router.beforeEach(spy)
     spy.mockImplementationOnce(noGuard)

packages/router/__tests__/guards/beforeEnter.spec.ts

@@ -1,20 +1,21 @@
 import fakePromise from 'faked-promise'
 import { createDom, noGuard, tick, newRouter as createRouter } from '../utils'
 import { RouteRecordRaw } from '../../src/types'
+import { vi, describe, expect, it, beforeAll, beforeEach } from 'vitest'
 
 const Home = { template: `<div>Home</div>` }
 const Foo = { template: `<div>Foo</div>` }
 
-const beforeEnter = jest.fn()
-const beforeEnters = [jest.fn(), jest.fn()]
+const beforeEnter = vi.fn()
+const beforeEnters = [vi.fn(), vi.fn()]
 const nested = {
-  parent: jest.fn(),
-  nestedEmpty: jest.fn(),
-  nestedA: jest.fn(),
-  nestedAbs: jest.fn(),
-  nestedNested: jest.fn(),
-  nestedNestedFoo: jest.fn(),
-  nestedNestedParam: jest.fn(),
+  parent: vi.fn(),
+  nestedEmpty: vi.fn(),
+  nestedA: vi.fn(),
+  nestedAbs: vi.fn(),
+  nestedNested: vi.fn(),
+  nestedNestedFoo: vi.fn(),
+  nestedNestedParam: vi.fn(),
 }
 
 const routes: RouteRecordRaw[] = [

packages/router/__tests__/guards/beforeResolve.spec.ts

@@ -1,5 +1,6 @@
 import { createDom, noGuard, newRouter as createRouter } from '../utils'
 import { RouteRecordRaw } from '../../src/types'
+import { vi, describe, expect, it, beforeAll } from 'vitest'
 
 const Home = { template: `<div>Home</div>` }
 const Foo = { template: `<div>Foo</div>` }
@@ -15,7 +16,7 @@ describe('router.beforeEach', () => {
   })
 
   it('calls beforeEach guards on navigation', async () => {
-    const spy = jest.fn()
+    const spy = vi.fn()
     const router = createRouter({ routes })
     router.beforeResolve(spy)
     spy.mockImplementationOnce(noGuard)