From ad4bbf76d92e99a4b6773a4f48c457699ed2e240 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adri=C3=A0=20Fontcuberta?= <afontcu@gmail.com>
Date: Sun, 22 Nov 2020 23:23:36 +0100
Subject: [PATCH 1/3] Add missing await clauses

---
 docs/guides/dom-events.md | 44 +++++++++++++++++++--------------------
 1 file changed, 21 insertions(+), 23 deletions(-)

diff --git a/docs/guides/dom-events.md b/docs/guides/dom-events.md
index 06e0af36a..a9f0b6d2b 100644
--- a/docs/guides/dom-events.md
+++ b/docs/guides/dom-events.md
@@ -4,12 +4,12 @@
 
 ### Trigger events
 
-The `Wrapper` exposes a `trigger` method. It can be used to trigger DOM events.
+The `Wrapper` exposes an async `trigger` method. It can be used to trigger DOM events.
 
 ```js
 const wrapper = mount(MyButton)
 
-wrapper.trigger('click')
+await wrapper.trigger('click')
 ```
 
 You should be aware that the `find` method returns a `Wrapper` as well. Assuming `MyComponent` contains a button, the following code clicks the button.
@@ -17,7 +17,7 @@ You should be aware that the `find` method returns a `Wrapper` as well. Assuming
 ```js
 const wrapper = mount(MyComponent)
 
-wrapper.find('button').trigger('click')
+await wrapper.find('button').trigger('click')
 ```
 
 ### Options
@@ -29,7 +29,7 @@ Note that target cannot be added in the `options` object.
 ```js
 const wrapper = mount(MyButton)
 
-wrapper.trigger('click', { button: 0 })
+await wrapper.trigger('click', { button: 0 })
 ```
 
 ### Mouse Click Example
@@ -73,18 +73,16 @@ import YesNoComponent from '@/components/YesNoComponent'
 import { mount } from '@vue/test-utils'
 import sinon from 'sinon'
 
-describe('Click event', () => {
-  it('Click on yes button calls our method with argument "yes"', () => {
-    const spy = sinon.spy()
-    const wrapper = mount(YesNoComponent, {
-      propsData: {
-        callMe: spy
-      }
-    })
-    wrapper.find('button.yes').trigger('click')
-
-    spy.should.have.been.calledWith('yes')
+it('Click on yes button calls our method with argument "yes"', () => {
+  const spy = sinon.spy()
+  const wrapper = mount(YesNoComponent, {
+    propsData: {
+      callMe: spy
+    }
   })
+  await wrapper.find('button.yes').trigger('click')
+
+  spy.should.have.been.calledWith('yes')
 })
 ```
 
@@ -158,29 +156,29 @@ describe('Key event tests', () => {
     expect(wrapper.vm.quantity).toBe(0)
   })
 
-  it('Up arrow key increments quantity by 1', () => {
+  it('Up arrow key increments quantity by 1', async () => {
     const wrapper = mount(QuantityComponent)
-    wrapper.trigger('keydown.up')
+    await wrapper.trigger('keydown.up')
     expect(wrapper.vm.quantity).toBe(1)
   })
 
-  it('Down arrow key decrements quantity by 1', () => {
+  it('Down arrow key decrements quantity by 1', async () => {
     const wrapper = mount(QuantityComponent)
     wrapper.vm.quantity = 5
-    wrapper.trigger('keydown.down')
+    await wrapper.trigger('keydown.down')
     expect(wrapper.vm.quantity).toBe(4)
   })
 
-  it('Escape sets quantity to 0', () => {
+  it('Escape sets quantity to 0', async () => {
     const wrapper = mount(QuantityComponent)
     wrapper.vm.quantity = 5
-    wrapper.trigger('keydown.esc')
+    await wrapper.trigger('keydown.esc')
     expect(wrapper.vm.quantity).toBe(0)
   })
 
-  it('Magic character "a" sets quantity to 13', () => {
+  it('Magic character "a" sets quantity to 13', async () => {
     const wrapper = mount(QuantityComponent)
-    wrapper.trigger('keydown', {
+    await wrapper.trigger('keydown', {
       key: 'a'
     })
     expect(wrapper.vm.quantity).toBe(13)

From 42f35c32fd8884928f0940cddfd94577c2252836 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adri=C3=A0=20Fontcuberta?= <afontcu@gmail.com>
Date: Sun, 22 Nov 2020 23:27:39 +0100
Subject: [PATCH 2/3] Add ja and zh

---
 docs/guides/dom-events.md    |  2 +-
 docs/ja/guides/dom-events.md | 42 +++++++++++++++++-------------------
 docs/zh/guides/dom-events.md | 42 +++++++++++++++++-------------------
 3 files changed, 41 insertions(+), 45 deletions(-)

diff --git a/docs/guides/dom-events.md b/docs/guides/dom-events.md
index a9f0b6d2b..9d11802dc 100644
--- a/docs/guides/dom-events.md
+++ b/docs/guides/dom-events.md
@@ -73,7 +73,7 @@ import YesNoComponent from '@/components/YesNoComponent'
 import { mount } from '@vue/test-utils'
 import sinon from 'sinon'
 
-it('Click on yes button calls our method with argument "yes"', () => {
+it('Click on yes button calls our method with argument "yes"', async () => {
   const spy = sinon.spy()
   const wrapper = mount(YesNoComponent, {
     propsData: {
diff --git a/docs/ja/guides/dom-events.md b/docs/ja/guides/dom-events.md
index e6372a37f..07fd19b61 100644
--- a/docs/ja/guides/dom-events.md
+++ b/docs/ja/guides/dom-events.md
@@ -7,7 +7,7 @@
 ```js
 const wrapper = mount(MyButton)
 
-wrapper.trigger('click')
+await wrapper.trigger('click')
 ```
 
 `find` メソッドは `mount` メソッドと同じように `Wrapper` を返します。 `MyComponent` 内に `button` があると仮定すると、以下のコードは、 `button` をクリックします。
@@ -15,7 +15,7 @@ wrapper.trigger('click')
 ```js
 const wrapper = mount(MyComponent)
 
-wrapper.find('button').trigger('click')
+await wrapper.find('button').trigger('click')
 ```
 
 ### オプション
@@ -27,7 +27,7 @@ target を `options` オブジェクトに追加することができないこ
 ```js
 const wrapper = mount(MyButton)
 
-wrapper.trigger('click', { button: 0 })
+await wrapper.trigger('click', { button: 0 })
 ```
 
 ### マウスクリックの例
@@ -68,18 +68,16 @@ import YesNoComponent from '@/components/YesNoComponent'
 import { mount } from '@vue/test-utils'
 import sinon from 'sinon'
 
-describe('Click event', () => {
-  it('Click on yes button calls our method with argument "yes"', () => {
-    const spy = sinon.spy()
-    const wrapper = mount(YesNoComponent, {
-      propsData: {
-        callMe: spy
-      }
-    })
-    wrapper.find('button.yes').trigger('click')
-
-    spy.should.have.been.calledWith('yes')
+it('Click on yes button calls our method with argument "yes"', async () => {
+  const spy = sinon.spy()
+  const wrapper = mount(YesNoComponent, {
+    propsData: {
+      callMe: spy
+    }
   })
+  await wrapper.find('button.yes').trigger('click')
+
+  spy.should.have.been.calledWith('yes')
 })
 ```
 
@@ -150,29 +148,29 @@ describe('Key event tests', () => {
     expect(wrapper.vm.quantity).toBe(0)
   })
 
-  it('Cursor up sets quantity to 1', () => {
+  it('Cursor up sets quantity to 1', async () => {
     const wrapper = mount(QuantityComponent)
-    wrapper.trigger('keydown.up')
+    await wrapper.trigger('keydown.up')
     expect(wrapper.vm.quantity).toBe(1)
   })
 
-  it('Cursor down reduce quantity by 1', () => {
+  it('Cursor down reduce quantity by 1', async () => {
     const wrapper = mount(QuantityComponent)
     wrapper.vm.quantity = 5
-    wrapper.trigger('keydown.down')
+    await wrapper.trigger('keydown.down')
     expect(wrapper.vm.quantity).toBe(4)
   })
 
-  it('Escape sets quantity to 0', () => {
+  it('Escape sets quantity to 0', async () => {
     const wrapper = mount(QuantityComponent)
     wrapper.vm.quantity = 5
-    wrapper.trigger('keydown.esc')
+    await wrapper.trigger('keydown.esc')
     expect(wrapper.vm.quantity).toBe(0)
   })
 
-  it('Magic character "a" sets quantity to 13', () => {
+  it('Magic character "a" sets quantity to 13', async () => {
     const wrapper = mount(QuantityComponent)
-    wrapper.trigger('keydown', {
+    await wrapper.trigger('keydown', {
       key: 'a'
     })
     expect(wrapper.vm.quantity).toBe(13)
diff --git a/docs/zh/guides/dom-events.md b/docs/zh/guides/dom-events.md
index 3102d9d5e..d051e0601 100644
--- a/docs/zh/guides/dom-events.md
+++ b/docs/zh/guides/dom-events.md
@@ -9,7 +9,7 @@
 ```js
 const wrapper = mount(MyButton)
 
-wrapper.trigger('click')
+await wrapper.trigger('click')
 ```
 
 你应该注意到了，`find` 方法也会返回一个 `Wrapper`。假设 `MyComponent` 包含一个按钮，下面的代码会点击这个按钮。
@@ -17,7 +17,7 @@ wrapper.trigger('click')
 ```js
 const wrapper = mount(MyComponent)
 
-wrapper.find('button').trigger('click')
+await wrapper.find('button').trigger('click')
 ```
 
 ### 选项
@@ -29,7 +29,7 @@ wrapper.find('button').trigger('click')
 ```js
 const wrapper = mount(MyButton)
 
-wrapper.trigger('click', { button: 0 })
+await wrapper.trigger('click', { button: 0 })
 ```
 
 ### 鼠标点击示例
@@ -73,18 +73,16 @@ import YesNoComponent from '@/components/YesNoComponent'
 import { mount } from '@vue/test-utils'
 import sinon from 'sinon'
 
-describe('Click event', () => {
-  it('Click on yes button calls our method with argument "yes"', () => {
-    const spy = sinon.spy()
-    const wrapper = mount(YesNoComponent, {
-      propsData: {
-        callMe: spy
-      }
-    })
-    wrapper.find('button.yes').trigger('click')
-
-    spy.should.have.been.calledWith('yes')
+it('Click on yes button calls our method with argument "yes"', async () => {
+  const spy = sinon.spy()
+  const wrapper = mount(YesNoComponent, {
+    propsData: {
+      callMe: spy
+    }
   })
+  await wrapper.find('button.yes').trigger('click')
+
+  spy.should.have.been.calledWith('yes')
 })
 ```
 
@@ -158,29 +156,29 @@ describe('Key event tests', () => {
     expect(wrapper.vm.quantity).toBe(0)
   })
 
-  it('Up arrow key increments quantity by 1', () => {
+  it('Up arrow key increments quantity by 1', async () => {
     const wrapper = mount(QuantityComponent)
-    wrapper.trigger('keydown.up')
+    await wrapper.trigger('keydown.up')
     expect(wrapper.vm.quantity).toBe(1)
   })
 
-  it('Down arrow key decrements quantity by 1', () => {
+  it('Down arrow key decrements quantity by 1', async () => {
     const wrapper = mount(QuantityComponent)
     wrapper.vm.quantity = 5
-    wrapper.trigger('keydown.down')
+    await wrapper.trigger('keydown.down')
     expect(wrapper.vm.quantity).toBe(4)
   })
 
-  it('Escape sets quantity to 0', () => {
+  it('Escape sets quantity to 0', async () => {
     const wrapper = mount(QuantityComponent)
     wrapper.vm.quantity = 5
-    wrapper.trigger('keydown.esc')
+    await wrapper.trigger('keydown.esc')
     expect(wrapper.vm.quantity).toBe(0)
   })
 
-  it('Magic character "a" sets quantity to 13', () => {
+  it('Magic character "a" sets quantity to 13', async () => {
     const wrapper = mount(QuantityComponent)
-    wrapper.trigger('keydown', {
+    await wrapper.trigger('keydown', {
       key: 'a'
     })
     expect(wrapper.vm.quantity).toBe(13)

From d568753c45232052adb12ddd67ed5500aaa56da7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adri=C3=A0=20Fontcuberta?= <afontcu@gmail.com>
Date: Sun, 22 Nov 2020 23:42:14 +0100
Subject: [PATCH 3/3] Wrap await statements (CI was failing)

---
 docs/guides/dom-events.md    | 18 ++++++++++++------
 docs/ja/guides/dom-events.md | 18 ++++++++++++------
 docs/zh/guides/dom-events.md | 18 ++++++++++++------
 3 files changed, 36 insertions(+), 18 deletions(-)

diff --git a/docs/guides/dom-events.md b/docs/guides/dom-events.md
index 9d11802dc..df0988d45 100644
--- a/docs/guides/dom-events.md
+++ b/docs/guides/dom-events.md
@@ -7,17 +7,21 @@
 The `Wrapper` exposes an async `trigger` method. It can be used to trigger DOM events.
 
 ```js
-const wrapper = mount(MyButton)
+test('triggers a click', async () => {
+  const wrapper = mount(MyComponent)
 
-await wrapper.trigger('click')
+  await wrapper.trigger('click')
+})
 ```
 
 You should be aware that the `find` method returns a `Wrapper` as well. Assuming `MyComponent` contains a button, the following code clicks the button.
 
 ```js
-const wrapper = mount(MyComponent)
+test('triggers a click', async () => {
+  const wrapper = mount(MyComponent)
 
-await wrapper.find('button').trigger('click')
+  await wrapper.find('button').trigger('click')
+})
 ```
 
 ### Options
@@ -27,9 +31,11 @@ The `trigger` method takes an optional `options` object. The properties in the `
 Note that target cannot be added in the `options` object.
 
 ```js
-const wrapper = mount(MyButton)
+test('triggers a click', async () => {
+  const wrapper = mount(MyComponent)
 
-await wrapper.trigger('click', { button: 0 })
+  await wrapper.trigger('click', { button: 0 })
+})
 ```
 
 ### Mouse Click Example
diff --git a/docs/ja/guides/dom-events.md b/docs/ja/guides/dom-events.md
index 07fd19b61..3a3f35aaa 100644
--- a/docs/ja/guides/dom-events.md
+++ b/docs/ja/guides/dom-events.md
@@ -5,17 +5,21 @@
 `Wrapper` の `trigger` メソッドで DOM イベントをトリガすることができます。
 
 ```js
-const wrapper = mount(MyButton)
+test('triggers a click', async () => {
+  const wrapper = mount(MyComponent)
 
-await wrapper.trigger('click')
+  await wrapper.trigger('click')
+})
 ```
 
 `find` メソッドは `mount` メソッドと同じように `Wrapper` を返します。 `MyComponent` 内に `button` があると仮定すると、以下のコードは、 `button` をクリックします。
 
 ```js
-const wrapper = mount(MyComponent)
+test('triggers a click', async () => {
+  const wrapper = mount(MyComponent)
 
-await wrapper.find('button').trigger('click')
+  await wrapper.find('button').trigger('click')
+})
 ```
 
 ### オプション
@@ -25,9 +29,11 @@ await wrapper.find('button').trigger('click')
 target を `options` オブジェクトに追加することができないことに注意してください。
 
 ```js
-const wrapper = mount(MyButton)
+test('triggers a click', async () => {
+  const wrapper = mount(MyComponent)
 
-await wrapper.trigger('click', { button: 0 })
+  await wrapper.trigger('click', { button: 0 })
+})
 ```
 
 ### マウスクリックの例
diff --git a/docs/zh/guides/dom-events.md b/docs/zh/guides/dom-events.md
index d051e0601..a3c858807 100644
--- a/docs/zh/guides/dom-events.md
+++ b/docs/zh/guides/dom-events.md
@@ -7,17 +7,21 @@
 `Wrapper` 暴露了一个 `trigger` 方法。它可以用来触发 DOM 事件。
 
 ```js
-const wrapper = mount(MyButton)
+test('triggers a click', async () => {
+  const wrapper = mount(MyButton)
 
-await wrapper.trigger('click')
+  await wrapper.trigger('click')
+})
 ```
 
 你应该注意到了，`find` 方法也会返回一个 `Wrapper`。假设 `MyComponent` 包含一个按钮，下面的代码会点击这个按钮。
 
 ```js
-const wrapper = mount(MyComponent)
+test('triggers a click', async () => {
+  const wrapper = mount(MyComponent)
 
-await wrapper.find('button').trigger('click')
+  await wrapper.find('button').trigger('click')
+})
 ```
 
 ### 选项
@@ -27,9 +31,11 @@ await wrapper.find('button').trigger('click')
 注意其目标不能被添加到 `options` 对象中。
 
 ```js
-const wrapper = mount(MyButton)
+test('triggers a click', async () => {
+  const wrapper = mount(MyComponent)
 
-await wrapper.trigger('click', { button: 0 })
+  await wrapper.trigger('click', { button: 0 })
+})
 ```
 
 ### 鼠标点击示例