diff --git a/docs/ja/README.md b/docs/ja/README.md index 9b3d45ebf..d11415576 100644 --- a/docs/ja/README.md +++ b/docs/ja/README.md @@ -28,6 +28,7 @@ - [attachToDocument](api/options.md#attachtodocument) - [attrs](api/options.md#attrs) - [listeners](api/options.md#listeners) + - [parentComponent](api/options.md#parentComponent) - [provide](api/options.md#provide) - [sync](api/options.md#sync) - [その他のオプション](api/options.md#その他のオプション) @@ -77,5 +78,6 @@ * [TransitionGroupStub](api/components/TransitionGroupStub.md) * [RouterLinkStub](api/components/RouterLinkStub.md) * [セレクタ](api/selectors.md) + * [createWrapper](api/createWrapper.md) * [createLocalVue](api/createLocalVue.md) * [config](api/config.md) diff --git a/docs/ja/api/README.md b/docs/ja/api/README.md index 2b2d30a97..dcc55d434 100644 --- a/docs/ja/api/README.md +++ b/docs/ja/api/README.md @@ -6,4 +6,5 @@ !!!include(docs/ja/api/renderToString.md)!!! !!!include(docs/ja/api/selectors.md)!!! !!!include(docs/ja/api/createLocalVue.md)!!! -!!!include(docs/ja/api/config.md)!!! \ No newline at end of file +!!!include(docs/ja/api/createWrapper.md)!!! +!!!include(docs/ja/api/config.md)!!! diff --git a/docs/ja/api/createWrapper.md b/docs/ja/api/createWrapper.md new file mode 100644 index 000000000..3904875d3 --- /dev/null +++ b/docs/ja/api/createWrapper.md @@ -0,0 +1,25 @@ +## createWrapper(node [, options]) + +- **引数:** + + - `{vm|HTMLElement} node` + - `{Object} options` + - `{Boolean} sync` + - `{Boolean} attachedToDocument` + +- **戻り値:** + - `{Wrapper}` + +- **使い方:** + +`createWrapper` は Vue インスタンスまたは HTML 要素に対する `Wrapper` を生成します。 + +```js +import { createWrapper } from '@vue/test-utils' +import Foo from './Foo.vue' + +const Constructor = Vue.extend(Foo) +const vm = new Constructor().$mount() +const wrapper = createWrapper(vm) +expect(wrapper.vm.foo).toBe(true) +``` diff --git a/docs/ja/api/options.md b/docs/ja/api/options.md index bb1541f78..90e428f0e 100644 --- a/docs/ja/api/options.md +++ b/docs/ja/api/options.md @@ -11,6 +11,7 @@ - [`attachToDocument`](#attachtodocument) - [`attrs`](#attrs) - [`listeners`](#listeners) +- [`parentComponent`](#parentComponent) - [`provide`](#provide) - [`sync`](#sync) @@ -42,15 +43,23 @@ expect(wrapper.is(Component)).toBe(true) ```js import Foo from './Foo.vue' -import Bar from './Bar.vue' + +const bazComponent = { + name: 'baz-component', + template: '

baz

' +} const wrapper = shallowMount(Component, { slots: { - default: [Foo, Bar], - fooBar: Foo, // Will match , - foo: '
' + default: [Foo, '', 'text'], + fooBar: Foo, // `` にマッチします。 + foo: '
', + bar: 'bar', + baz: bazComponent, + qux: '' } }) + expect(wrapper.find('div')).toBe(true) ``` @@ -177,6 +186,23 @@ expect(wrapper.vm.$route).toBeInstanceOf(Object) コンポーネントインスタンスの `$listeners` オブジェクトを設定します。 +## parentComponent + +- 型: `Object` + +マウントされるコンポーネントの親コンポーネントとして使用されるコンポーネントです。 + +例: + +```js +import Foo from './Foo.vue' + +const wrapper = shallowMount(Component, { + parentComponent: Foo +}) +expect(wrapper.vm.$parent.name).toBe('foo') +``` + ## provide - 型: `Object` diff --git a/docs/ja/api/wrapper/setChecked.md b/docs/ja/api/wrapper/setChecked.md index f9e0b4e42..e1ffab67b 100644 --- a/docs/ja/api/wrapper/setChecked.md +++ b/docs/ja/api/wrapper/setChecked.md @@ -12,8 +12,8 @@ import { mount } from '@vue/test-utils' import Foo from './Foo.vue' const wrapper = mount(Foo) -const option = wrapper.find('input[type="radio"]') -option.setChecked() +const radioInput = wrapper.find('input[type="radio"]') +radioInput.setChecked() ``` - **注:** diff --git a/docs/ja/api/wrapper/setData.md b/docs/ja/api/wrapper/setData.md index a599b195e..0a78c7b17 100644 --- a/docs/ja/api/wrapper/setData.md +++ b/docs/ja/api/wrapper/setData.md @@ -2,6 +2,8 @@ `Wrapper` `vm` データを設定します。 +setData は再帰的に Vue.set を実行することで動作します。 + **Wrapper には Vue インスタンスを含む必要があることに注意してください** - **引数:** diff --git a/docs/ja/api/wrapper/setValue.md b/docs/ja/api/wrapper/setValue.md index bfc6f1f90..a56dbe784 100644 --- a/docs/ja/api/wrapper/setValue.md +++ b/docs/ja/api/wrapper/setValue.md @@ -12,15 +12,27 @@ import { mount } from '@vue/test-utils' import Foo from './Foo.vue' const wrapper = mount(Foo) -const input = wrapper.find('input[type="text"]') -input.setValue('some value') + +const textInput = wrapper.find('input[type="text"]') +textInput.setValue('some value') + +const select = wrapper.find('select') +select.setValue('option value') ``` + - **注:** -`textInput.setValue(value)` は以下のコードのエイリアスです。 + - `textInput.setValue(value)` は以下のコードのエイリアスです。 -```js -textInput.element.value = value -textInput.trigger('input') -``` + ```js + textInput.element.value = value + textInput.trigger('input') + ``` + + - `select.setValue(value)` は以下のコードのエイリアスです。 + + ```js + select.element.value = value + select.trigger('change') + ```