Skip to content

Commit

Permalink
docs: Improve formatting and readability of the Mocking / Cheat Sheet…
Browse files Browse the repository at this point in the history
… section (#5632)
  • Loading branch information
weedySeaDragon committed Apr 29, 2024
1 parent 200609c commit 08c79d6
Showing 1 changed file with 26 additions and 21 deletions.
47 changes: 26 additions & 21 deletions docs/guide/mocking.md
Original file line number Diff line number Diff line change
Expand Up @@ -474,14 +474,14 @@ describe('delayed execution', () => {

I want to…

- Spy on a `method`
### Spy on a `method`

```ts
const instance = new SomeClass()
vi.spyOn(instance, 'method')
```

- Mock exported variables
### Mock exported variables
```js
// some-path.js
export const getter = 'variable'
Expand All @@ -493,9 +493,14 @@ import * as exports from './some-path.js'
vi.spyOn(exports, 'getter', 'get').mockReturnValue('mocked')
```

- Mock exported function
### Mock an exported function

1. Example with `vi.mock`:

::: warning
Don't forget that a `vi.mock` call is hoisted to top of the file. It will always be executed before all imports.
:::

Example with `vi.mock`:
```ts
// ./some-path.js
export function method() {}
Expand All @@ -508,20 +513,16 @@ vi.mock('./some-path.js', () => ({
}))
```

::: warning
Don't forget that `vi.mock` call is hoisted to top of the file. **Do not** put `vi.mock` calls inside `beforeEach`, only one of these will actually mock a module.
:::

Example with `vi.spyOn`:
2. Example with `vi.spyOn`:
```ts
import * as exports from './some-path.js'

vi.spyOn(exports, 'method').mockImplementation(() => {})
```

- Mock exported class implementation
### Mock an exported class implementation

Example with `vi.mock` and prototype:
1. Example with `vi.mock` and `.prototype`:
```ts
// some-path.ts
export class SomeClass {}
Expand All @@ -537,7 +538,7 @@ vi.mock('./some-path.js', () => {
// SomeClass.mock.instances will have SomeClass
```

Example with `vi.mock` and return value:
2. Example with `vi.mock` and a return value:
```ts
import { SomeClass } from './some-path.js'

Expand All @@ -550,7 +551,7 @@ vi.mock('./some-path.js', () => {
// SomeClass.mock.returns will have returned object
```

Example with `vi.spyOn`:
3. Example with `vi.spyOn`:

```ts
import * as exports from './some-path.js'
Expand All @@ -560,9 +561,9 @@ vi.spyOn(exports, 'SomeClass').mockImplementation(() => {
})
```

- Spy on an object returned from a function
### Spy on an object returned from a function

Example using cache:
1. Example using cache:

```ts
// some-path.ts
Expand Down Expand Up @@ -603,7 +604,7 @@ const obj = useObject()
expect(obj.method).toHaveBeenCalled()
```

- Mock part of a module
### Mock part of a module

```ts
import { mocked, original } from './some-path.js'
Expand All @@ -619,7 +620,7 @@ original() // has original behaviour
mocked() // is a spy function
```

- Mock current date
### Mock the current date

To mock `Date`'s time, you can use `vi.setSystemTime` helper function. This value will **not** automatically reset between different tests.

Expand All @@ -634,7 +635,7 @@ expect(now.valueOf()).toBe(mockDate.valueOf())
vi.useRealTimers()
```

- Mock global variable
### Mock a global variable

You can set global variable by assigning a value to `globalThis` or using [`vi.stubGlobal`](/api/vi#vi-stubglobal) helper. When using `vi.stubGlobal`, it will **not** automatically reset between different tests, unless you enable [`unstubGlobals`](/config/#unstubglobals) config option or call [`vi.unstubAllGlobals`](/api/vi#vi-unstuballglobals).

Expand All @@ -643,9 +644,13 @@ vi.stubGlobal('__VERSION__', '1.0.0')
expect(__VERSION__).toBe('1.0.0')
```

- Mock `import.meta.env`
### Mock `import.meta.env`

1. To change environmental variable, you can just assign a new value to it.

To change environmental variable, you can just assign a new value to it. This value will **not** automatically reset between different tests.
::: warning
The environmental variable value will **_not_** automatically reset between different tests.
:::

```ts
import { beforeEach, expect, it } from 'vitest'
Expand All @@ -663,7 +668,7 @@ it('changes value', () => {
})
```

If you want to automatically reset value, you can use `vi.stubEnv` helper with [`unstubEnvs`](/config/#unstubenvs) config option enabled (or call [`vi.unstubAllEnvs`](/api/vi#vi-unstuballenvs) manually in `beforeEach` hook):
2. If you want to automatically reset the value(s), you can use the `vi.stubEnv` helper with the [`unstubEnvs`](/config/#unstubenvs) config option enabled (or call [`vi.unstubAllEnvs`](/api/vi#vi-unstuballenvs) manually in a `beforeEach` hook):

```ts
import { expect, it, vi } from 'vitest'
Expand Down

0 comments on commit 08c79d6

Please sign in to comment.