File tree Expand file tree Collapse file tree 9 files changed +75
-10
lines changed Expand file tree Collapse file tree 9 files changed +75
-10
lines changed Original file line number Diff line number Diff line change 25
25
- [ listeners] ( api/options.md#listeners )
26
26
- [ clone] ( api/options.md#clone )
27
27
- [ provide] ( api/options.md#provide )
28
+ - [ その他のオプション] ( api/options.md#その他のオプション )
28
29
* [ Wrapper] ( api/wrapper/README.md )
29
30
* [ attributes] ( api/wrapper/attributes.md )
30
31
* [ classes] ( api/wrapper/classes.md )
Original file line number Diff line number Diff line change 23
23
- [ listeners] ( api/options.md#listeners )
24
24
- [ clone] ( api/options.md#clone )
25
25
- [ provide] ( api/options.md#provide )
26
+ - [ その他のオプション] ( api/options.md#その他のオプション )
26
27
* [ Wrapper] ( api/wrapper/README.md )
27
28
* [ attributes] ( api/wrapper/attributes.md )
28
29
* [ classes] ( api/wrapper/classes.md )
Original file line number Diff line number Diff line change 13
13
- [ listeners] ( ./options.md#listeners )
14
14
- [ clone] ( ./options.md#clone )
15
15
- [ provide] ( ./options.md#provide )
16
+ - [ その他のオプション] ( ./options.md#その他のオプション )
16
17
* [ Wrapper] ( ./wrapper/README.md )
17
18
* [ attributes] ( ./wrapper/attributes.md )
18
19
* [ classes] ( ./wrapper/classes.md )
Original file line number Diff line number Diff line change 1
1
# マウンティングオプション
2
2
3
- ` mount ` と ` shallow ` に対するオプション。オプションオブジェクトには、` vue-test-utils ` のマウントオプションと生の Vue オプションの両方を含めることができます。
4
-
5
- 新しくインスタンスが作成されると、Vue オプションがコンポーネントに渡されます。例: ` store ` 、 ` propsData ` など。完全なリストについては [ Vue API ドキュメント] ( https://jp.vuejs.org/v2/api/ ) を参照してください。
3
+ ` mount ` と ` shallow ` に対するオプション。オプションオブジェクトには、` vue-test-utils ` のマウントオプションとその他のオプションを含めることができます。
6
4
7
5
## ` vue-test-utils ` の詳細なマウンティングオプション
8
6
@@ -58,6 +56,12 @@ const wrapper = shallow(Component, {
58
56
expect (wrapper .find (' div' )).toBe (true )
59
57
```
60
58
59
+ #### テキストを渡す
60
+
61
+ テキストを値として ` slots ` に渡すことはできますが、1つ制限事項があります。
62
+ PhantomJS をサポートしません。
63
+ [ Puppeteer] ( https://github.com/karma-runner/karma-chrome-launcher#headless-chromium-with-puppeteer ) を使用してください。
64
+
61
65
### ` stubs `
62
66
63
67
- type: ` { [name: string]: Component | boolean } | Array<string> `
@@ -171,3 +175,33 @@ expect(wrapper.vm.$route).toBeInstanceOf(Object)
171
175
- 型: ` Object `
172
176
173
177
コンポーネントに指定したプロパティを注入します。[ provide/inject] ( https://vuejs.org/v2/api/#provide-inject ) を参照してください。
178
+
179
+ ## その他のオプション
180
+
181
+ ` mount ` と ` shallow ` にマウンティングオプション以外のオプションが渡されると、コンポーネントのオプションは [ extends] ( https://vuejs.org/v2/api/#extends ) を使ってマウンティングオプション以外のオプションに上書きされます。
182
+
183
+ ``` js
184
+ const Component = {
185
+ template: ' <div>{{ foo() }}{{ bar() }}{{ baz() }}</div>' ,
186
+ methods: {
187
+ foo () {
188
+ return ' a'
189
+ },
190
+ bar () {
191
+ return ' b'
192
+ }
193
+ }
194
+ }
195
+ const options = {
196
+ methods: {
197
+ bar () {
198
+ return ' B'
199
+ },
200
+ baz () {
201
+ return ' C'
202
+ }
203
+ }
204
+ }
205
+ const wrapper = mount (Component, options)
206
+ expect (wrapper .text ()).to .equal (' aBC' )
207
+ ```
Original file line number Diff line number Diff line change 6
6
- ` {Object} options `
7
7
- ` {boolean} attachToDocument `
8
8
- ` {Object} context `
9
+ - ` {Array<Component|Object>|Component} children `
9
10
- ` {Object} slots `
10
11
- ` {Array<Componet|Object>|Component|String} default `
11
12
- ` {Array<Componet|Object>|Component|String} named `
12
- - ` {Object} intercept `
13
+ - ` {Object} mocks `
13
14
- ` {Object|Array<string>} stubs `
14
15
- ` {boolean} clone `
15
- - ` {Object} children `
16
16
- ` {Vue} localVue `
17
17
18
18
- ** 戻り値:** ` {Wrapper} `
Original file line number Diff line number Diff line change 4
4
5
5
- ** プロパティ:**
6
6
7
+ ` wrappers ` ` array ` : ` WrapperArray ` に含まれる ` Wrappers `
7
8
` length ` ` number ` : ` WrapperArray ` に含まれる ` Wrappers ` の数
8
9
9
10
- ** メソッド:**
Original file line number Diff line number Diff line change @@ -44,3 +44,15 @@ expect(wrapper.emitted('foo').length).toBe(2)
44
44
// イベントのペイロードを検証します
45
45
expect (wrapper .emitted (' foo' )[1 ]).toEqual ([123 ])
46
46
```
47
+
48
+ ` .emitted() ` メソッドは呼ばれる度、新しいオブジェクトではなく同じオブジェクトを返します。イベントが発生すると、そのオブジェクトは更新します。
49
+
50
+ ``` js
51
+ const emitted = wrapper .emitted ()
52
+
53
+ expect (emitted .foo .length ).toBe (1 )
54
+
55
+ // `wrapper` が foo イベントを emit する何らかの処理したとします。
56
+
57
+ expect (emitted .foo .length ).toBe (2 )
58
+ ```
Original file line number Diff line number Diff line change 9
9
- ** 例:**
10
10
11
11
``` js
12
- import { mount } from ' vue-test-utils'
13
- import { expect } from ' chai'
14
12
import Foo from ' ./Foo.vue'
13
+ import Bar from ' ./Bar.vue'
15
14
16
- const wrapper = mount (Foo, {
17
- propsData: ' baz'
15
+ const wrapper = mount (Component, {
16
+ context: {
17
+ props: { show: true },
18
+ children: [Foo, Bar]
19
+ }
18
20
})
19
- expect (wrapper .props ().bar ).toBe (' baz' )
21
+
22
+ expect (wrapper .is (Component)).toBe (true )
20
23
```
Original file line number Diff line number Diff line change @@ -36,3 +36,15 @@ wrapper.trigger('click', {
36
36
37
37
expect (clickHandler .called ).toBe (true )
38
38
```
39
+
40
+ - ** イベントターゲットの設定:**
41
+
42
+ ` trigger ` は ` Event ` オブジェクトを生成して、Wrapper.element にイベントを送ります。
43
+ ` Event ` オブジェクトの ` target ` 値を編集できません。つまり、 ` target ` を オプションオブジェクトにセットすることはできません。
44
+ ` target ` の属性を追加するには、 ` trigger ` を実行する前に Wrapper.element の属性にその値をセットする必要があります。
45
+
46
+ ``` js
47
+ const input = wrapper .find (' input' )
48
+ input .element .value = 100
49
+ input .trigger (' click' )
50
+ ```
You can’t perform that action at this time.
0 commit comments