feat: wip vue plugin version

Author: posva

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