Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: use docusaurus-remark-plugin-tab-blocks to format tabs with code examples #12859

Merged
merged 37 commits into from May 31, 2022
Merged
Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
37 commits
Select commit Hold shift + click to select a range
e677256
docs: add custom plugin for tabs
mrazauskas May 18, 2022
587ce12
ups.. bring back TOC
mrazauskas May 18, 2022
24037f0
copyright
mrazauskas May 18, 2022
513c98e
versioned docs
mrazauskas May 18, 2022
fcdd672
restart CI
mrazauskas May 18, 2022
72ad9b5
Merge branch 'main' into docs-tabs-plugin
mrazauskas May 19, 2022
a91f1a4
rework Configuration.md
mrazauskas May 19, 2022
81806d9
rename plugin
mrazauskas May 19, 2022
442ff23
less code
mrazauskas May 19, 2022
1ec1602
support title
mrazauskas May 22, 2022
cbd1018
fix copyright headers
mrazauskas May 22, 2022
92302ab
babel?
mrazauskas May 22, 2022
686dfd6
babel again
mrazauskas May 22, 2022
7e6a2f7
fix babel
mrazauskas May 22, 2022
29e6505
fix meta check
mrazauskas May 22, 2022
39eeb8b
tweak processFixture
mrazauskas May 22, 2022
aa36069
deploy?
mrazauskas May 22, 2022
b66022a
rework logic
mrazauskas May 23, 2022
d7f454c
do not travers transformed nodes
mrazauskas May 23, 2022
b22c274
clean up
mrazauskas May 24, 2022
b44faa3
add span support
mrazauskas May 24, 2022
ef6e70c
use span in docs
mrazauskas May 24, 2022
8343517
fix node count
mrazauskas May 24, 2022
3733213
run tests before deploy
mrazauskas May 24, 2022
b6fe5c6
hm..
mrazauskas May 24, 2022
fd09543
lock
mrazauskas May 24, 2022
cd98e66
fix scripts
mrazauskas May 24, 2022
c1985d3
add changelog entry
mrazauskas May 24, 2022
6a4a028
clean up
mrazauskas May 24, 2022
359bb9c
revert babel
mrazauskas May 24, 2022
8ab524b
deps
mrazauskas May 24, 2022
6e6ae7e
deps
mrazauskas May 24, 2022
7137bae
ignore incomplete spans
mrazauskas May 24, 2022
d15f3fe
clean up
mrazauskas May 24, 2022
fbe1562
Merge branch 'main' into docs-tabs-plugin
mrazauskas May 24, 2022
8c25393
use docusaurus-remark-plugin-tab-blocks
mrazauskas May 30, 2022
6269532
restart CI
mrazauskas May 30, 2022
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
115 changes: 16 additions & 99 deletions docs/MockFunctionAPI.md
Expand Up @@ -25,9 +25,6 @@ import TOCInline from '@theme/TOCInline';

## Reference

import Tabs from '@theme/Tabs';
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The plugin will add these too.

import TabItem from '@theme/TabItem';

### `mockFn.getMockName()`

Returns the mock name string set by calling `mockFn.mockName(value)`.
Expand Down Expand Up @@ -159,10 +156,7 @@ Accepts a function that should be used as the implementation of the mock. The mo

:::

<Tabs groupId="examples">
<TabItem value="js" label="JavaScript">

```js
```js tab
mrazauskas marked this conversation as resolved.
Show resolved Hide resolved
const mockFn = jest.fn(scalar => 42 + scalar);

mockFn(0); // 42
Expand All @@ -174,11 +168,7 @@ mockFn(2); // 38
mockFn(3); // 39
```

</TabItem>

<TabItem value="ts" label="TypeScript">

```js
```ts tab
const mockFn = jest.fn((scalar: number) => 42 + scalar);

mockFn(0); // 42
Expand All @@ -190,9 +180,6 @@ mockFn(2); // 38
mockFn(3); // 39
```

</TabItem>
</Tabs>

`.mockImplementation()` can also be used to mock class constructors:

<Tabs groupId="examples">
Expand Down Expand Up @@ -257,10 +244,7 @@ console.log('Calls to method: ', mockMethod.mock.calls);

Accepts a function that will be used as an implementation of the mock for one call to the mocked function. Can be chained so that multiple function calls produce different results.

<Tabs groupId="examples">
<TabItem value="js" label="JavaScript">

```js
```js tab
const mockFn = jest
.fn()
.mockImplementationOnce(cb => cb(null, true))
Expand All @@ -270,11 +254,7 @@ mockFn((err, val) => console.log(val)); // true
mockFn((err, val) => console.log(val)); // false
```

</TabItem>

<TabItem value="ts" label="TypeScript">

```ts
```ts tab
const mockFn = jest
.fn<(cb: (a: null, b: boolean) => void) => void>()
.mockImplementationOnce(cb => cb(null, true))
Expand All @@ -284,9 +264,6 @@ mockFn((err, val) => console.log(val)); // true
mockFn((err, val) => console.log(val)); // false
```

</TabItem>
</Tabs>

When the mocked function runs out of implementations defined with `.mockImplementationOnce()`, it will execute the default implementation set with `jest.fn(() => defaultValue)` or `.mockImplementation(() => defaultValue)` if they were called:

```js
Expand Down Expand Up @@ -336,10 +313,7 @@ jest.fn(function () {

Accepts a value that will be returned whenever the mock function is called.

<Tabs groupId="examples">
<TabItem value="js" label="JavaScript">

```js
```js tab
const mock = jest.fn();

mock.mockReturnValue(42);
Expand All @@ -349,11 +323,7 @@ mock.mockReturnValue(43);
mock(); // 43
```

</TabItem>

<TabItem value="ts" label="TypeScript">

```ts
```ts tab
const mock = jest.fn<() => number>();

mock.mockReturnValue(42);
Expand All @@ -363,17 +333,11 @@ mock.mockReturnValue(43);
mock(); // 43
```

</TabItem>
</Tabs>

### `mockFn.mockReturnValueOnce(value)`

Accepts a value that will be returned for one call to the mock function. Can be chained so that successive calls to the mock function return different values. When there are no more `mockReturnValueOnce` values to use, calls will return a value specified by `mockReturnValue`.

<Tabs groupId="examples">
<TabItem value="js" label="JavaScript">

```js
```js tab
const mockFn = jest
.fn()
.mockReturnValue('default')
Expand All @@ -386,11 +350,7 @@ mockFn(); // 'default'
mockFn(); // 'default'
```

</TabItem>

<TabItem value="ts" label="TypeScript">

```ts
```ts tab
const mockFn = jest
.fn<() => string>()
.mockReturnValue('default')
Expand All @@ -403,9 +363,6 @@ mockFn(); // 'default'
mockFn(); // 'default'
```

</TabItem>
</Tabs>

### `mockFn.mockResolvedValue(value)`

Syntactic sugar function for:
Expand All @@ -416,32 +373,22 @@ jest.fn().mockImplementation(() => Promise.resolve(value));

Useful to mock async functions in async tests:

<Tabs groupId="examples">
<TabItem value="js" label="JavaScript">

```js
```js tab
test('async test', async () => {
const asyncMock = jest.fn().mockResolvedValue(43);

await asyncMock(); // 43
});
```

</TabItem>

<TabItem value="ts" label="TypeScript">

```ts
```ts tab
test('async test', async () => {
const asyncMock = jest.fn<() => Promise<number>>().mockResolvedValue(43);

await asyncMock(); // 43
});
```

</TabItem>
</Tabs>

### `mockFn.mockResolvedValueOnce(value)`

Syntactic sugar function for:
Expand All @@ -452,10 +399,7 @@ jest.fn().mockImplementationOnce(() => Promise.resolve(value));

Useful to resolve different values over multiple async calls:

<Tabs groupId="examples">
<TabItem value="js" label="JavaScript">

```js
```js tab
test('async test', async () => {
const asyncMock = jest
.fn()
Expand All @@ -470,11 +414,7 @@ test('async test', async () => {
});
```

</TabItem>

<TabItem value="ts" label="TypeScript">

```ts
```ts tab
test('async test', async () => {
const asyncMock = jest
.fn<() => Promise<string>>()
Expand All @@ -489,9 +429,6 @@ test('async test', async () => {
});
```

</TabItem>
</Tabs>

### `mockFn.mockRejectedValue(value)`

Syntactic sugar function for:
Expand All @@ -502,10 +439,7 @@ jest.fn().mockImplementation(() => Promise.reject(value));

Useful to create async mock functions that will always reject:

<Tabs groupId="examples">
<TabItem value="js" label="JavaScript">

```js
```js tab
test('async test', async () => {
const asyncMock = jest
.fn()
Expand All @@ -515,11 +449,7 @@ test('async test', async () => {
});
```

</TabItem>

<TabItem value="ts" label="TypeScript">

```ts
```ts tab
test('async test', async () => {
const asyncMock = jest
.fn<() => Promise<never>>()
Expand All @@ -529,9 +459,6 @@ test('async test', async () => {
});
```

</TabItem>
</Tabs>

### `mockFn.mockRejectedValueOnce(value)`

Syntactic sugar function for:
Expand All @@ -542,10 +469,7 @@ jest.fn().mockImplementationOnce(() => Promise.reject(value));

Useful together with `.mockResolvedValueOnce()` or to reject with different exceptions over multiple async calls:

<Tabs groupId="examples">
<TabItem value="js" label="JavaScript">

```js
```js tab
test('async test', async () => {
const asyncMock = jest
.fn()
Expand All @@ -557,11 +481,7 @@ test('async test', async () => {
});
```

</TabItem>

<TabItem value="ts" label="TypeScript">

```ts
```ts tab
test('async test', async () => {
const asyncMock = jest
.fn<() => Promise<string>>()
Expand All @@ -573,9 +493,6 @@ test('async test', async () => {
});
```

</TabItem>
</Tabs>

## TypeScript Usage

:::tip
Expand Down
1 change: 1 addition & 0 deletions website/docusaurus.config.js
Expand Up @@ -56,6 +56,7 @@ module.exports = {
sidebarPath: path.resolve(__dirname, './sidebars.json'),
remarkPlugins: [
[require('@docusaurus/remark-plugin-npm2yarn'), {sync: true}],
require('./src/remark/tabs-plugin'),
],
},
blog: {
Expand Down
3 changes: 2 additions & 1 deletion website/package.json
Expand Up @@ -40,7 +40,8 @@
"react-dom": "^17.0.1",
"react-github-btn": "^1.2.0",
"react-lite-youtube-embed": "^2.2.1-a",
"react-markdown": "^8.0.0"
"react-markdown": "^8.0.0",
"unist-util-visit": "^2.0.3"
},
"devDependencies": {
"@babel/core": "^7.11.6",
Expand Down