Add missing public methods API docs

Author: afontcu

docs/api/index.md

@@ -4,7 +4,7 @@ sidebar: auto
 
 # API Reference
 
-## mount()
+## mount
 
 Creates a Wrapper that contains the mounted and rendered Vue component to test.
 
@@ -1584,11 +1584,47 @@ The `Vue` app instance. You can access all of the [instance methods](https://v3.
 `vm` is only available on a `VueWrapper`.
 :::
 
-## Global Config
+## shallowMount
 
-### config
+Creates a Wrapper that contains the mounted and rendered Vue component to test with all children stubbed out.
 
-#### config.global
+**Signature:**
+
+```ts
+interface MountingOptions<Props, Data = {}> {
+  attachTo?: HTMLElement | string
+  attrs?: Record<string, unknown>
+  data?: () => {} extends Data ? any : Data extends object ? Partial<Data> : any
+  props?: (RawProps & Props) | ({} extends Props ? null : never)
+  slots?: { [key: string]: Slot } & { default?: Slot }
+  global?: GlobalMountOptions
+  shallow?: boolean
+}
+
+function mount(Component, options?: MountingOptions): VueWrapper
+```
+
+**Details:**
+
+`shallowMount` behaves exactly like `mount`, but it stubs all child components by default. Essentially, `shallowMount(Component)` is an alias of `mount(Component, { shallow: true })`.
+
+## flushPromises
+
+**Signature:**
+
+```ts
+flushPromises(): Promise<unknown>
+```
+
+**Details:**
+
+`flushPromises` flushes al resolved promise handlers. This helps make sure async operations such as promises or DOM updates have happened before asserting against them.
+
+Check out [Making HTTP requests](../guide/advanced/http-requests.md) to see an example of `flushPromises` in action.
+
+## config
+
+### config.global
 
 **Signature:**
 

docs/guide/advanced/async-suspense.md

@@ -2,7 +2,9 @@
 
 You may have noticed some other parts of the guide using `await` when calling some methods on `wrapper`, such as `trigger` and `setValue`. What's that all about?
 
-You might know Vue updates reactively; when you change a value, the DOM is automatically updated to reflect the latest value. Vue does this _asynchronously_. In contrast, a test runner like Jest runs _synchronously_. This can cause some surprising results in tests. Let's look at some strategies to ensure Vue is updating the DOM as expected when we run our tests.
+You might know Vue updates reactively: when you change a value, the DOM is automatically updated to reflect the latest value. [Vue does these updates asynchronously](https://v3.vuejs.org/guide/change-detection.html#async-update-queue). In contrast, a test runner like Jest runs _synchronously_. This can cause some surprising results in tests.
+
+Let's look at some strategies to ensure Vue is updating the DOM as expected when we run our tests.
 
 ## A Simple Example - Updating with `trigger`
 
@@ -11,7 +13,7 @@ Let's re-use the `<Counter>` component from [event handling](../essentials/event
 ```js
 const Counter = {
   template: `
-    Count: {{ count }}
+    <p>Count: {{ count }}</p>
     <button @click="handleClick">Increment</button>
   `,
   data() {
@@ -39,11 +41,15 @@ test('increments by 1', () => {
 })
 ```
 
-Surprisingly, this fails! The reason is although `count` is increased, Vue will not update the DOM until the next "tick" or "render cycle". For this reason, the assertion will be called before Vue updates the DOM. This has to do with the concept of "macrotasks", "microtasks" and the JavaScript Event Loop. You can read more details and see a simple example [here](https://javascript.info/event-loop#macrotasks-and-microtasks).
+Surprisingly, this fails! The reason is although `count` is increased, Vue will not update the DOM until the next event loop "tick. For this reason, the assertion (`expect()...`) will be called before Vue updates the DOM.
+
+:::tip
+If you want to learn more about this core JavaScript behavior, read about the [Event Loop and its macrotasks and microtasks](https://javascript.info/event-loop#macrotasks-and-microtasks).
+:::
 
-Implementation details aside, how can we fix this? Vue actually provides a way for us to wait until the DOM is updated: `nextTick`:
+Implementation details aside, how can we fix this? Vue actually provides a way for us to wait until the DOM is updated: `nextTick`.
 
-```js {7}
+```js {1,7}
 import { nextTick } from 'vue'
 
 test('increments by 1', async () => {
@@ -56,7 +62,9 @@ test('increments by 1', async () => {
 })
 ```
 
-Now the test will pass, because we ensure the next "tick" has executed updated the DOM before the assertion runs. Since `await nextTick()` is common, VTU provides a shortcut. Methods than cause the DOM to update, such as `trigger` and `setValue` return `nextTick`! So you can just `await` those directly:
+Now the test will pass, because we ensure the next "tick" has executed updated the DOM before the assertion runs.
+
+Since `await nextTick()` is common, Vue Test Utils provides a shortcut. Methods than cause the DOM to update, such as `trigger` and `setValue` return `nextTick`, so you can just `await` those directly:
 
 ```js {4}
 test('increments by 1', async () => {
@@ -70,44 +78,45 @@ test('increments by 1', async () => {
 
 ## Resolving Other Asynchronous Behavior
 
-`nextTick` is useful to ensure some change in reactivty data is reflected in the DOM before continuing the test. However, sometimes you may want to ensure other, non Vue-related asynchronous behavior is completed, too. A common example is a function that returns a `Promise` that will lead to a change in the DOM. Perhaps you mocked your `axios` HTTP client using `jest.mock`:
+`nextTick` is useful to ensure some change in reactive data is reflected in the DOM before continuing the test. However, sometimes you may want to ensure other, non Vue-related asynchronous behavior is completed, too.
+
+A common example is a function that returns a `Promise`. Perhaps you mocked your `axios` HTTP client using `jest.mock`:
 
 ```js
 jest.mock('axios', () => ({
   get: () => Promise.resolve({ data: 'some mocked data!' })
 }))
 ```
 
-In this case, Vue has no knowledge of the unresolved Promise, so calling `nextTick` will not work - your assertion may run before it is resolved. For scenarios like this, you can use `[flush-promises](https://www.npmjs.com/package/flush-promises)`, which causes all outstanding promises to resolve immediately.
+In this case, Vue has no knowledge of the unresolved Promise, so calling `nextTick` will not work - your assertion may run before it is resolved. For scenarios like this, Vue Test Utils exposes [`flushPromises`](../../api/#flushPromises), which causes all outstanding promises to resolve immediately.
 
 Let's see an example:
 
-```js
-import flushPromises from 'flush-promises'
+```js{1,12}
+import { flushPromises } from '@vue/test-utils'
 import axios from 'axios'
 
 jest.mock('axios', () => ({
-  get: () =>
-    new Promise((resolve) => {
-      resolve({ data: 'some mocked data!' })
-    })
+  get: () => Promise.resolve({ data: 'some mocked data!' })
 }))
 
 test('uses a mocked axios HTTP client and flush-promises', async () => {
   // some component that makes a HTTP called in `created` using `axios`
   const wrapper = mount(AxiosComponent)
 
-  await flushPromises() // axios promise is resolved immediately!
+  await flushPromises() // axios promise is resolved immediately
 
-  // assertions!
+  // after line above, axios request has resolved with the mocked data.
 })
 ```
 
-> If you haven't tested Components with API requests before, you can learn more in [HTTP Requests](./http-requests).
+:::tip
+If you want to learn more about testing requests on Components, make sure you check [Making HTTP Requests](http-requests.md) guide.
+:::
 
 ## Conclusion
 
-- Vue updates the DOM asynchronously; tests runner execute code synchronously.
+- Vue updates the DOM asynchronously; tests runner execute code synchronously instead.
 - Use `await nextTick()` to ensure the DOM has updated before the test continues
-- Functions that might update the DOM, like `trigger` and `setValue` return `nextTick`, so you should `await` them.
-- Use `flush-promises` to resolve any unresolved promises from non-Vue dependencies.
+- Functions that might update the DOM (like `trigger` and `setValue`) return `nextTick`, so you need `await` them.
+- Use `flush-promises` from Vue Test Utils to resolve any unresolved promises from non-Vue dependencies (such as API requests).

docs/guide/essentials/easy-to-test.md

@@ -22,7 +22,7 @@ Think in terms of inputs and outputs from a user perspective. Roughly, this is e
 | Events       | Emitted events (using `$emit`)                 |
 | Side Effects | Such as `console.log` or API calls             |
 
-### Everything else is implementation details
+**Everything else is implementation details**.
 
 Notice how this list does not include elements such as internal methods, intermediate states or even data.