feat: expose config from @vue/test-utils (#12)

Author: sheremet-va

README.md

@@ -57,6 +57,18 @@ test('counter button increments the count', async () => {
 
 Unlike `@testing-library/vue`, `vitest-browser-vue` cleans up the component before the test starts instead of after, so you can see the rendered result in your UI. To avoid auto-cleanup, import the `render` function from `vitest-browser-vue/pure`.
 
+## Configuration
+
+You can change the global configuration by modifying the `config` export. You can import it from both `vitest-browser-vue` and `vitest-browser-vue/pure`. See [documentation](https://test-utils.vuejs.org/api/#config).
+
+```js
+import { config } from 'vitest-browser-vue'
+
+config.global.mocks = {
+  $t: text => text
+}
+```
+
 ## Special thanks
 
 - Powered by [`@vue/test-utils`](https://github.com/vuejs/test-utils/)

src/index.ts

@@ -2,7 +2,7 @@ import { page } from '@vitest/browser/context'
 import { beforeEach } from 'vitest'
 import { cleanup, render } from './pure'
 
-export { render, cleanup } from './pure'
+export { render, cleanup, config } from './pure'
 export type { ComponentRenderOptions, RenderResult } from './pure'
 
 page.extend({

src/pure.ts

@@ -3,6 +3,8 @@ import { type ComponentMountingOptions, type VueWrapper, mount } from '@vue/test
 import type { DefineComponent } from 'vue'
 import { type PrettyDOMOptions, debug, getElementLocatorSelectors } from '@vitest/browser/utils'
 
+export { config } from '@vue/test-utils'
+
 type ComponentProps<T> = T extends new (...angs: any) => {
   $props: infer P
 // eslint-disable-next-line ts/no-empty-object-type

test/render.test.ts

@@ -1,11 +1,17 @@
 import { expect, test } from 'vitest'
 import { page } from '@vitest/browser/context'
-import { render } from 'vitest-browser-vue'
+import { config, render } from 'vitest-browser-vue'
 import HelloWorld from './fixtures/HelloWorld.vue'
 import Slot from './fixtures/Slot.vue'
 import Counter from './fixtures/Counter.vue'
 import Async from './fixtures/Async.vue'
 
+config.global.components = {
+  InjectedGlobalComponent: {
+    template: '<div>Global Component</div>',
+  },
+}
+
 test('renders simple component', async () => {
   const screen = render(HelloWorld)
   await expect.element(page.getByText('Hello World')).toBeVisible()
@@ -43,6 +49,13 @@ test('renders complex slot', async () => {
   await expect.element(screen.getByRole('button', { name: 'Hello World' })).toBeVisible()
 })
 
+test('injected component works', async () => {
+  const screen = render({
+    template: '<InjectedGlobalComponent />',
+  })
+  await expect.element(screen.getByText('Global Component')).toBeVisible()
+})
+
 test('renders async component', async () => {
   const screen = render({
     components: { Async },