From c5eb8f94c922e1e9bef7b4e7f059361a23a3a3ba Mon Sep 17 00:00:00 2001 From: Jinjiang Date: Wed, 15 Nov 2017 16:12:27 +0800 Subject: [PATCH 1/3] [zh-cn] synced recent updates from #0a46a2f to #b756723 --- docs/zh-cn/README.md | 6 +++ docs/zh-cn/SUMMARY.md | 6 +++ docs/zh-cn/api/components/README.md | 7 +++ .../api/components/TransitionGroupStub.md | 32 +++++++++++++ docs/zh-cn/api/components/TransitionStub.md | 32 +++++++++++++ docs/zh-cn/api/config.md | 27 +++++++++++ docs/zh-cn/api/selectors.md | 13 +++++- docs/zh-cn/api/wrapper-array/setComputed.md | 27 +++++++++++ docs/zh-cn/api/wrapper/setComputed.md | 45 +++++++++++++++++++ 9 files changed, 194 insertions(+), 1 deletion(-) create mode 100644 docs/zh-cn/api/components/README.md create mode 100644 docs/zh-cn/api/components/TransitionGroupStub.md create mode 100644 docs/zh-cn/api/components/TransitionStub.md create mode 100644 docs/zh-cn/api/config.md create mode 100644 docs/zh-cn/api/wrapper-array/setComputed.md create mode 100644 docs/zh-cn/api/wrapper/setComputed.md diff --git a/docs/zh-cn/README.md b/docs/zh-cn/README.md index dc1697285..0a21da94b 100644 --- a/docs/zh-cn/README.md +++ b/docs/zh-cn/README.md @@ -39,6 +39,7 @@ * [isEmpty](api/wrapper/isEmpty.md) * [isVueInstance](api/wrapper/isVueInstance.md) * [name](api/wrapper/name.md) + * [setComputed](api/wrapper/setComputed.md) * [setData](api/wrapper/setData.md) * [setMethods](api/wrapper/setMethods.md) * [setProps](api/wrapper/setProps.md) @@ -56,11 +57,16 @@ * [is](api/wrapper-array/is.md) * [isEmpty](api/wrapper-array/isEmpty.md) * [isVueInstance](api/wrapper-array/isVueInstance.md) + * [setComputed](api/wrapper-array/setComputed.md) * [setData](api/wrapper-array/setData.md) * [setMethods](api/wrapper-array/setMethods.md) * [setProps](api/wrapper-array/setProps.md) * [trigger](api/wrapper-array/trigger.md) * [update](api/wrapper-array/update.md) * [destroy](api/wrapper-array/destroy.md) + * [components](api/components/README.md) + * [TransitionStub](api/components/TransitionStub.md) + * [TransitionGroupStub](api/components/TransitionGroupStub.md) * [选择器](api/selectors.md) * [createLocalVue](api/createLocalVue.md) + * [config](api/config.md) diff --git a/docs/zh-cn/SUMMARY.md b/docs/zh-cn/SUMMARY.md index 486368538..155333a77 100644 --- a/docs/zh-cn/SUMMARY.md +++ b/docs/zh-cn/SUMMARY.md @@ -37,6 +37,7 @@ * [isEmpty](api/wrapper/isEmpty.md) * [isVueInstance](api/wrapper/isVueInstance.md) * [name](api/wrapper/name.md) + * [setComputed](api/wrapper/setComputed.md) * [setData](api/wrapper/setData.md) * [setMethods](api/wrapper/setMethods.md) * [setProps](api/wrapper/setProps.md) @@ -54,11 +55,16 @@ * [is](api/wrapper-array/is.md) * [isEmpty](api/wrapper-array/isEmpty.md) * [isVueInstance](api/wrapper-array/isVueInstance.md) + * [setComputed](api/wrapper-array/setComputed.md) * [setData](api/wrapper-array/setData.md) * [setMethods](api/wrapper-array/setMethods.md) * [setProps](api/wrapper-array/setProps.md) * [trigger](api/wrapper-array/trigger.md) * [update](api/wrapper-array/update.md) * [destroy](api/wrapper-array/destroy.md) + * [components](api/components/README.md) + * [TransitionStub](api/components/TransitionStub.md) + * [TransitionGroupStub](api/components/TransitionGroupStub.md) * [选择器](api/selectors.md) * [createLocalVue](api/createLocalVue.md) + * [config](api/config.md) diff --git a/docs/zh-cn/api/components/README.md b/docs/zh-cn/api/components/README.md new file mode 100644 index 000000000..2785fcf23 --- /dev/null +++ b/docs/zh-cn/api/components/README.md @@ -0,0 +1,7 @@ +# Components + + + +`vue-test-utils` includes utility components you can use to stub components. + +[TransitionStub](./TransitionStub.md) and [TransitionGroupStub](./TransitionGroupStub.md) are used to stub `transition` and `transition-group` components by default. You can edit the stubs by editing the config. diff --git a/docs/zh-cn/api/components/TransitionGroupStub.md b/docs/zh-cn/api/components/TransitionGroupStub.md new file mode 100644 index 000000000..6bf5cf7b5 --- /dev/null +++ b/docs/zh-cn/api/components/TransitionGroupStub.md @@ -0,0 +1,32 @@ +# TransitionGroupStub + + + +A component to stub the `transition-group` wrapper component. Instead of performing transitions asynchronously, it returns the child components synchronously. + +This is set to stub all `transition-group` components by default in the vue-test-utils config. To use the built-in `transition-group` wrapper component set `config.stubs[transition-group]` to false: + +```js +import VueTestUtils from 'vue-test-utils' + +VueTestUtils.config.stubs.transition = false +``` + +To reset it to stub transition components: +```js +import VueTestUtils, { TransitionGroupStub } from 'vue-test-utils' + +VueTestUtils.config.stubs['transition-group'] = TransitionGroupStub +``` + +To set it as a stub in mounting options: + +```js +import { mount, TransitionGroupStub } from 'vue-test-utils' + +mount(Component, { + stubs: { + 'transition-group': TransitionGroupStub + } +}) +``` diff --git a/docs/zh-cn/api/components/TransitionStub.md b/docs/zh-cn/api/components/TransitionStub.md new file mode 100644 index 000000000..1bafde1cc --- /dev/null +++ b/docs/zh-cn/api/components/TransitionStub.md @@ -0,0 +1,32 @@ +# TransitionStub + + + +A component to stub the `transition` wrapper component. Instead of performing transitions asynchronously, it returns the child component synchronously. + +This is set to stub all `transition` components by default in the vue-test-utils config. To use the built-in `transition` wrapper component set `config.stubs.transition` to false: + +```js +import VueTestUtils from 'vue-test-utils' + +VueTestUtils.config.stubs.transition = false +``` + +To reset it to stub transition components: +```js +import VueTestUtils, { TransitionStub } from 'vue-test-utils' + +VueTestUtils.config.stubs.transition = TransitionStub +``` + +To set it as a stub in mounting options: + +```js +import { mount, TransitionStub } from 'vue-test-utils' + +mount(Component, { + stubs: { + transition: TransitionStub + } +}) +``` diff --git a/docs/zh-cn/api/config.md b/docs/zh-cn/api/config.md new file mode 100644 index 000000000..c1bfa34e9 --- /dev/null +++ b/docs/zh-cn/api/config.md @@ -0,0 +1,27 @@ +# Config + + + +vue-test-utils includes a config object to defined options used by vue-test-utils. + +## `vue-test-utils` Config Options + +### `stubs` + +- type: `Object` +- default: `{ + transition: TransitionStub, + 'transition-group': TransitionGroupStub +}` + +Stubs to use in components. These are overwritten by `stubs` passed in the mounting options. + +When passing `stubs` as an array in the mounting options, `config.stubs` are converted to an array, and will stub components with a basic component that returns a div. + +Example: + +```js +import VueTestUtils from 'vue-test-utils' + +VueTestUtils.config.stubs['my-compomnent'] = '
' +``` diff --git a/docs/zh-cn/api/selectors.md b/docs/zh-cn/api/selectors.md index 9df74b60b..ac5bafcc7 100644 --- a/docs/zh-cn/api/selectors.md +++ b/docs/zh-cn/api/selectors.md @@ -1,6 +1,6 @@ # 选择器 -很多方法的参数中都包含选择器。一个选择器可以是一个 CSS 选择器或是一个 Vue 组件。 +很多方法的参数中都包含选择器。一个选择器可以是一个 CSS 选择器、一个 Vue 组件或是一个查找选项对象。 ## CSS 选择器 @@ -41,3 +41,14 @@ import Foo from './Foo.vue' const wrapper = shallow(Foo) expect(wrapper.is(Foo)).toBe(true) ``` + +## 查找选项对象 + +### Ref + +`vue-test-utils` 允许通过一个查找选项对象在组件包裹器上根据 `$ref` 选择元素。 + +```js +const buttonWrapper = wrapper.find({ ref: 'myButton' }); +buttonWrapper.trigger('click'); +``` diff --git a/docs/zh-cn/api/wrapper-array/setComputed.md b/docs/zh-cn/api/wrapper-array/setComputed.md new file mode 100644 index 000000000..bbb0af308 --- /dev/null +++ b/docs/zh-cn/api/wrapper-array/setComputed.md @@ -0,0 +1,27 @@ +# setComputed(computedObjects) + + + +Sets `Wrapper` `vm` computed and forces update on each `Wrapper` in `WrapperArray`. + +**Note every `Wrapper` must contain a Vue instance.** +**Note every Vue instance must already have the computed properties passed to setComputed.** + +- **Arguments:** + - `{Object} computed properties` + +- **Example:** + +```js +import { mount } from 'vue-test-utils' +import Foo from './Foo.vue' +import Bar from './Bar.vue' + +const wrapper = mount(Foo) +const barArray = wrapper.findAll(Bar) + +barArray.setComputed({ + computed1: 'new-computed1', + computed2: 'new-computed2' +}) +``` diff --git a/docs/zh-cn/api/wrapper/setComputed.md b/docs/zh-cn/api/wrapper/setComputed.md new file mode 100644 index 000000000..85846fabd --- /dev/null +++ b/docs/zh-cn/api/wrapper/setComputed.md @@ -0,0 +1,45 @@ +# setComputed(computedObjects) + + + +Sets `Wrapper` `vm` computed property and forces update. + +**Note the Wrapper must contain a Vue instance.** +**Note every Vue instance must already have the computed properties passed to setComputed.** + + +- **Arguments:** + - `{Object} computed properties` + +- **Example:** + +```js +import { mount } from 'vue-test-utils' +import { expect } from 'chai' + +const wrapper = mount({ + template: '
{{ computed1 }} {{ computed2 }}
', + data () { + return { + initial: 'initial' + } + }, + computed: { + computed1 () { + return this.initial + }, + computed2 () { + return this.initial + } + } +}) + +expect(wrapper.html()).toBe('
initial initial
') + +wrapper.setComputed({ + computed1: 'new-computed1', + computed2: 'new-computed2' +}) + +expect(wrapper.html()).toBe('
new-computed1 new-computed2
') +``` From ab829dae942d60a2f161a3188def90185de37885 Mon Sep 17 00:00:00 2001 From: Jinjiang Date: Mon, 20 Nov 2017 11:40:07 +0800 Subject: [PATCH 2/3] [zh-cn] synced recent updates from #b756723 to #6f5f1b0 --- docs/zh-cn/README.md | 4 ++-- docs/zh-cn/SUMMARY.md | 4 ++-- docs/zh-cn/api/README.md | 4 ++++ docs/zh-cn/api/components/README.md | 8 +++----- .../api/components/TransitionGroupStub.md | 15 +++++++-------- docs/zh-cn/api/components/TransitionStub.md | 12 ++++++------ docs/zh-cn/api/config.md | 18 ++++++++---------- docs/zh-cn/api/wrapper-array/setComputed.md | 14 ++++++-------- docs/zh-cn/api/wrapper/emitted.md | 13 +++++++++++++ docs/zh-cn/api/wrapper/setComputed.md | 15 ++++++--------- docs/zh-cn/guides/dom-events.md | 2 +- 11 files changed, 58 insertions(+), 51 deletions(-) diff --git a/docs/zh-cn/README.md b/docs/zh-cn/README.md index 0a21da94b..e654160a2 100644 --- a/docs/zh-cn/README.md +++ b/docs/zh-cn/README.md @@ -64,9 +64,9 @@ * [trigger](api/wrapper-array/trigger.md) * [update](api/wrapper-array/update.md) * [destroy](api/wrapper-array/destroy.md) - * [components](api/components/README.md) + * [组件](api/components/README.md) * [TransitionStub](api/components/TransitionStub.md) * [TransitionGroupStub](api/components/TransitionGroupStub.md) * [选择器](api/selectors.md) * [createLocalVue](api/createLocalVue.md) - * [config](api/config.md) + * [配置](api/config.md) diff --git a/docs/zh-cn/SUMMARY.md b/docs/zh-cn/SUMMARY.md index 155333a77..1b7842103 100644 --- a/docs/zh-cn/SUMMARY.md +++ b/docs/zh-cn/SUMMARY.md @@ -62,9 +62,9 @@ * [trigger](api/wrapper-array/trigger.md) * [update](api/wrapper-array/update.md) * [destroy](api/wrapper-array/destroy.md) - * [components](api/components/README.md) + * [组件](api/components/README.md) * [TransitionStub](api/components/TransitionStub.md) * [TransitionGroupStub](api/components/TransitionGroupStub.md) * [选择器](api/selectors.md) * [createLocalVue](api/createLocalVue.md) - * [config](api/config.md) + * [配置](api/config.md) diff --git a/docs/zh-cn/api/README.md b/docs/zh-cn/api/README.md index ac7e14b5f..16c40075a 100644 --- a/docs/zh-cn/api/README.md +++ b/docs/zh-cn/api/README.md @@ -50,5 +50,9 @@ * [trigger](./wrapper-array/trigger.md) * [update](./wrapper-array/update.md) * [destroy](./wrapper-array/destroy.md) +* [组件](./components/README.md) + * [TransitionStub](./components/TransitionStub.md) + * [TransitionGroupStub](./components/TransitionGroupStub.md) * [选择器](./selectors.md) * [createLocalVue](./createLocalVue.md) +* [配置](./config.md) diff --git a/docs/zh-cn/api/components/README.md b/docs/zh-cn/api/components/README.md index 2785fcf23..c387d58d7 100644 --- a/docs/zh-cn/api/components/README.md +++ b/docs/zh-cn/api/components/README.md @@ -1,7 +1,5 @@ -# Components +# 组件 - +`vue-test-utils` 包含了用做存根的实用组件。 -`vue-test-utils` includes utility components you can use to stub components. - -[TransitionStub](./TransitionStub.md) and [TransitionGroupStub](./TransitionGroupStub.md) are used to stub `transition` and `transition-group` components by default. You can edit the stubs by editing the config. +默认情况下 [TransitionStub](./TransitionStub.md) 和 [TransitionGroupStub](./TransitionGroupStub.md) 用来存根 `transition` 和 `transition-group` 组件。你也可以通过配置信息来编辑存根。 diff --git a/docs/zh-cn/api/components/TransitionGroupStub.md b/docs/zh-cn/api/components/TransitionGroupStub.md index 6bf5cf7b5..be0739684 100644 --- a/docs/zh-cn/api/components/TransitionGroupStub.md +++ b/docs/zh-cn/api/components/TransitionGroupStub.md @@ -1,25 +1,24 @@ -# TransitionGroupStub +# `TransitionGroupStub` - +一个用来存根 `transition-group` 包裹器组件的组件。与其异步完成过渡动画不同的是，它会同步返回子组件。 -A component to stub the `transition-group` wrapper component. Instead of performing transitions asynchronously, it returns the child components synchronously. - -This is set to stub all `transition-group` components by default in the vue-test-utils config. To use the built-in `transition-group` wrapper component set `config.stubs[transition-group]` to false: +它在 `vue-test-utils` 默认配置中用来存根所有的 `transition-group` 组件。将 `config.stubs['transition-group']` 设为 `false` 可以使用内建的 `transition-group` 包裹器组件： ```js import VueTestUtils from 'vue-test-utils' -VueTestUtils.config.stubs.transition = false +VueTestUtils.config.stubs['transition-group'] = false ``` -To reset it to stub transition components: +将其重置可以存根过渡组件： + ```js import VueTestUtils, { TransitionGroupStub } from 'vue-test-utils' VueTestUtils.config.stubs['transition-group'] = TransitionGroupStub ``` -To set it as a stub in mounting options: +还可以在挂载选项中将其设置为一个存根： ```js import { mount, TransitionGroupStub } from 'vue-test-utils' diff --git a/docs/zh-cn/api/components/TransitionStub.md b/docs/zh-cn/api/components/TransitionStub.md index 1bafde1cc..c3235d322 100644 --- a/docs/zh-cn/api/components/TransitionStub.md +++ b/docs/zh-cn/api/components/TransitionStub.md @@ -1,10 +1,9 @@ -# TransitionStub +# `TransitionStub` - +一个用来存根 `transition` 包裹器组件的组件。与其异步完成过渡动画不同的是，它会同步返回子组件。 -A component to stub the `transition` wrapper component. Instead of performing transitions asynchronously, it returns the child component synchronously. +它在 `vue-test-utils` 默认配置中用来存根所有的 `transition` 组件。将 `config.stubs.transition` 设为 `false` 可以使用内建的 `transition` 包裹器组件： -This is set to stub all `transition` components by default in the vue-test-utils config. To use the built-in `transition` wrapper component set `config.stubs.transition` to false: ```js import VueTestUtils from 'vue-test-utils' @@ -12,14 +11,15 @@ import VueTestUtils from 'vue-test-utils' VueTestUtils.config.stubs.transition = false ``` -To reset it to stub transition components: +将其重置可以存根过渡组件： + ```js import VueTestUtils, { TransitionStub } from 'vue-test-utils' VueTestUtils.config.stubs.transition = TransitionStub ``` -To set it as a stub in mounting options: +还可以在挂载选项中将其设置为一个存根： ```js import { mount, TransitionStub } from 'vue-test-utils' diff --git a/docs/zh-cn/api/config.md b/docs/zh-cn/api/config.md index c1bfa34e9..f5f4cbeae 100644 --- a/docs/zh-cn/api/config.md +++ b/docs/zh-cn/api/config.md @@ -1,24 +1,22 @@ -# Config +# 配置 - +`vue-test-utils` 包含了一个定义其选项的配置对象。 -vue-test-utils includes a config object to defined options used by vue-test-utils. - -## `vue-test-utils` Config Options +## `vue-test-utils` 配置选项 ### `stubs` -- type: `Object` -- default: `{ +- 类型：`Object` +- 默认值：`{ transition: TransitionStub, 'transition-group': TransitionGroupStub }` -Stubs to use in components. These are overwritten by `stubs` passed in the mounting options. +用到的组件存根。它们会被传入挂载选项的 `stubs` 复写。 -When passing `stubs` as an array in the mounting options, `config.stubs` are converted to an array, and will stub components with a basic component that returns a div. +当把 `stubs` 作为一个数组传入挂载选项时，`config.stubs` 会被转换为一个数组，然后用只返回一个 div 的基础组件进行存根。 -Example: +示例： ```js import VueTestUtils from 'vue-test-utils' diff --git a/docs/zh-cn/api/wrapper-array/setComputed.md b/docs/zh-cn/api/wrapper-array/setComputed.md index bbb0af308..d322c45fa 100644 --- a/docs/zh-cn/api/wrapper-array/setComputed.md +++ b/docs/zh-cn/api/wrapper-array/setComputed.md @@ -1,16 +1,14 @@ -# setComputed(computedObjects) +# `setComputed(computedObjects)` - +为 `WrapperArray` 的每个 `Wrapper` `vm` 都设置计算属性并强行更新。 -Sets `Wrapper` `vm` computed and forces update on each `Wrapper` in `WrapperArray`. +**注意：该包裹器必须包含一个 Vue 示例。** +**注意：每个 Vue 示例必须已经有被传入 `setComputed` 的计算属性。** -**Note every `Wrapper` must contain a Vue instance.** -**Note every Vue instance must already have the computed properties passed to setComputed.** - -- **Arguments:** +- **参数：** - `{Object} computed properties` -- **Example:** +- **示例：** ```js import { mount } from 'vue-test-utils' diff --git a/docs/zh-cn/api/wrapper/emitted.md b/docs/zh-cn/api/wrapper/emitted.md index 36302f4b2..a8059bb54 100644 --- a/docs/zh-cn/api/wrapper/emitted.md +++ b/docs/zh-cn/api/wrapper/emitted.md @@ -31,3 +31,16 @@ expect(wrapper.emitted().foo.length).toBe(2) // 断言事件的有效数据 expect(wrapper.emitted().foo[1]).toEqual([123]) ``` + +你也可以把上面的代码写成这样： + +```js +// 断言事件已经被触发 +expect(wrapper.emitted('foo')).toBeTruthy() + +// 断言事件的数量 +expect(wrapper.emitted('foo').length).toBe(2) + +// 断言事件的有效数据 +expect(wrapper.emitted('foo')[1]).toEqual([123]) +``` diff --git a/docs/zh-cn/api/wrapper/setComputed.md b/docs/zh-cn/api/wrapper/setComputed.md index 85846fabd..fab55ae93 100644 --- a/docs/zh-cn/api/wrapper/setComputed.md +++ b/docs/zh-cn/api/wrapper/setComputed.md @@ -1,17 +1,14 @@ -# setComputed(computedObjects) +# `setComputed(computedObjects)` - +设置 `Wrapper` `vm` 的计算属性并强制更新。 -Sets `Wrapper` `vm` computed property and forces update. +**注意：该包裹器必须包含一个 Vue 示例。** +**注意：该 Vue 示例必须已经有被传入 `setComputed` 的计算属性。** -**Note the Wrapper must contain a Vue instance.** -**Note every Vue instance must already have the computed properties passed to setComputed.** - - -- **Arguments:** +- **参数：** - `{Object} computed properties` -- **Example:** +- **示例：** ```js import { mount } from 'vue-test-utils' diff --git a/docs/zh-cn/guides/dom-events.md b/docs/zh-cn/guides/dom-events.md index b7fe7ffc5..250d84684 100644 --- a/docs/zh-cn/guides/dom-events.md +++ b/docs/zh-cn/guides/dom-events.md @@ -193,4 +193,4 @@ describe('键盘事件测试', () => { ## 重要事项 -`vue-test-utils` 是同步触发事件。因此 `vue.nextTick` 不是必须的。 +`vue-test-utils` 是同步触发事件。因此 `Vue.nextTick` 不是必须的。 From 71b38870c1dc57d652076f75efa48ec1eb8f8354 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=8B=BE=E4=B8=89=E8=82=A1=E5=9B=9B?= Date: Mon, 20 Nov 2017 11:49:28 +0800 Subject: [PATCH 3/3] Update README.md --- docs/zh-cn/api/README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/docs/zh-cn/api/README.md b/docs/zh-cn/api/README.md index 16c40075a..6686fb767 100644 --- a/docs/zh-cn/api/README.md +++ b/docs/zh-cn/api/README.md @@ -27,6 +27,7 @@ * [isEmpty](./wrapper/isEmpty.md) * [isVueInstance](./wrapper/isVueInstance.md) * [name](./wrapper/name.md) + * [setComputed](./wrapper/setComputed.md) * [setData](./wrapper/setData.md) * [setMethods](./wrapper/setMethods.md) * [setProps](./wrapper/setProps.md) @@ -44,6 +45,7 @@ * [is](./wrapper-array/is.md) * [isEmpty](./wrapper-array/isEmpty.md) * [isVueInstance](./wrapper-array/isVueInstance.md) + * [setComputed](./wrapper-array/setComputed.md) * [setData](./wrapper-array/setData.md) * [setMethods](./wrapper-array/setMethods.md) * [setProps](./wrapper-array/setProps.md)