Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 92c3140

Browse files
authored
fix(plugins): allow setting vuex/router and custom plugins (#200)
* Do not mount component again on rerender * fix(plugins): allow setting custom plugin and vuex/router * Simplify setting logic
1 parent ca5f32c commit 92c3140

File tree

3 files changed

+57
-12
lines changed

3 files changed

+57
-12
lines changed

‎package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -49,8 +49,7 @@
4949
"dependencies": {
5050
"@babel/runtime": "^7.12.1",
5151
"@testing-library/dom": "^7.28.1",
52-
"@vue/test-utils": "^2.0.0-beta.12",
53-
"lodash.merge": "^4.6.2"
52+
"@vue/test-utils": "^2.0.0-beta.12"
5453
},
5554
"devDependencies": {
5655
"@apollo/client": "3.3.6",
@@ -70,6 +69,7 @@
7069
"isomorphic-unfetch": "^3.1.0",
7170
"jest-serializer-vue": "^2.0.2",
7271
"kcd-scripts": "^7.5.1",
72+
"lodash.merge": "^4.6.2",
7373
"msw": "^0.21.3",
7474
"typescript": "^4.1.2",
7575
"vee-validate": "^4.0.2",

‎src/__tests__/plugins.js

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
import '@testing-library/jest-dom'
2+
import ElementPlus from 'element-plus'
3+
import userEvent from '@testing-library/user-event'
4+
import {defineComponent} from 'vue'
5+
import {render, screen, fireEvent, waitFor} from '..'
6+
import {store} from './components/Store/store'
7+
8+
test('can set global options and custom options such as a store', async () => {
9+
const ComponentWithStore = defineComponent({
10+
template: `
11+
<el-popover trigger="hover" content="this is content">
12+
<template #reference>
13+
<el-button @click="$store.dispatch('increment')">
14+
Hover to activate
15+
</el-button>
16+
</template>
17+
</el-popover>
18+
<span data-testid="count-value">{{ $store.state.count }}</span>
19+
<directive />
20+
`,
21+
})
22+
23+
const DirectiveStub = {
24+
template: '<p>Search now</p>',
25+
}
26+
27+
render(ComponentWithStore, {
28+
store,
29+
global: {
30+
plugins: [ElementPlus],
31+
stubs: {
32+
Directive: DirectiveStub,
33+
},
34+
},
35+
})
36+
37+
expect(screen.getByText('Search now')).toBeInTheDocument()
38+
39+
const button = screen.getByText('Hover to activate')
40+
userEvent.hover(button)
41+
42+
await waitFor(() => expect(screen.getByText('this is content')).toBeVisible())
43+
44+
expect(screen.getByTestId('count-value')).toHaveTextContent('0')
45+
46+
await fireEvent.click(button)
47+
48+
expect(screen.getByTestId('count-value')).toHaveTextContent('1')
49+
})

‎src/index.js

Lines changed: 6 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
/* eslint-disable testing-library/no-wait-for-empty-callback */
22
import {mount} from '@vue/test-utils'
3-
import merge from 'lodash.merge'
43

54
import {
65
getQueriesForElement,
@@ -25,7 +24,7 @@ function render(
2524
const baseElement = customBaseElement || customContainer || document.body
2625
const container = customContainer || baseElement.appendChild(div)
2726

28-
const plugins = []
27+
const plugins = mountOptions.global?.plugins||[]
2928

3029
if (store) {
3130
const {createStore} = require('vuex')
@@ -41,14 +40,11 @@ function render(
4140
plugins.push(routerPlugin)
4241
}
4342

44-
const wrapper = mount(
45-
Component,
46-
merge({
47-
attachTo: container,
48-
global: {plugins},
49-
...mountOptions,
50-
}),
51-
)
43+
const wrapper = mount(Component, {
44+
...mountOptions,
45+
attachTo: container,
46+
global: {...mountOptions.global, plugins},
47+
})
5248

5349
// this removes the additional "data-v-app" div node from VTU:
5450
// https://github.com/vuejs/vue-test-utils-next/blob/master/src/mount.ts#L196-L213

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /