feat: wip vue plugin version

README.md

@@ -2,21 +2,21 @@
 
 > Easily mock routing interactions in your Vue 3 apps
 
-**⚠️ This library intends to be a collaboration of people writing tests to create a better experience writing tests that involve the use of routing with Vue.** Your feedback and experience is welcomed in issues and discussions to give the API shape and create a library that eases unit testing components that deal with the router.
-
 ## Installation
 
 ```sh
-yarn add vue-router-mock
+pnpm i -D vue-router-mock
+# or
+yarn add -D vue-router-mock
 # or
-npm install vue-router-mock
+npm install -D vue-router-mock
 ```
 
 ## Requirements
 
 This library
 
-- vue test utils next
+- `@vue/test-utils` >= 2.4.0
 - vue 3 and vue router 4
 
 ## Goal

src/injections.ts

@@ -6,14 +6,11 @@ import {
  RouterLink,
  RouterView,
  routerViewLocationKey,
- // @ts-ignore: for api-extractor
- RouteLocationMatched,
 } from 'vue-router'
 import { config } from '@vue/test-utils'
 import { createReactiveRouteLocation } from './routeLocation'
 import { createRouterMock, RouterMock } from './router'
-// @ts-ignore: for api-extractor
-import { computed, Ref, ComputedRef } from 'vue'
+import { computed, Plugin } from 'vue'
 
 /**
  * Inject global variables, overriding any previously inject router mock
@@ -37,19 +34,28 @@ export function injectRouterMock(router?: RouterMock) {
  config.global.components.RouterView = RouterView
  config.global.components.RouterLink = RouterLink
 
- // TODO: remove if https://github.com/vuejs/vue-test-utils-next/issues/1023
- // gets merged
- if (Array.isArray(config.global.stubs)) {
- config.global.stubs.push('RouterLink')
- config.global.stubs.push('RouterView')
- } else {
- config.global.stubs.RouterLink = true
- config.global.stubs.RouterView = true
- }
+ config.global.stubs.RouterLink = true
+ config.global.stubs.RouterView = true
 
  return { router, route }
 }
 
+// TODO: explore this idea rather than having the weird inject function
+export function createPlugin(router: RouterMock): Plugin {
+ return (app) => {
+ const provides = createProvide(router)
+ const route = provides[
+ routeLocationKey as any
+ ] as RouteLocationNormalizedLoaded
+
+ for (const key in provides) {
+ app.provide(key, provides[key])
+ }
+ app.config.globalProperties.$router = router
+ app.config.globalProperties.$route = route
+ }
+}
+
 /**
  * Creates an object of properties to be provided at your application level to
  * mock what is injected by vue-router