Skip to main content
Version: 4.1

<MockProvider />

function MockProvider({
children,
results,
}: {
children: React.ReactChild;
results: Fixture[];
}): JSX.Element;

\

is a simple substitute provider to prefill the cache with fixtures so the 'happy path' can be tested. This is useful for storybook as well as component testing.

Arguments

results

interface Fixture {
request: ReadShape<Schema, object>;
params: object;
result: object | string | number;
}

This prop specifies the fixtures to use data from. Each item represents a fetch defined by the FetchShape and params. Result contains the JSON response expected from said fetch.

Returns

JSX.Element

Renders the children prop.

Example

import { MockProvider } from '@rest-hooks/test';

import ArticleResource from 'resources/ArticleResource';
import MyComponentToTest from 'components/MyComponentToTest';

const results = [
{
request: ArticleResource.listShape(),
params: { maxResults: 10 },
result: [
{
id: 5,
content: 'have a merry christmas',
author: 2,
contributors: [],
},
{
id: 532,
content: 'never again',
author: 23,
contributors: [5],
},
],
},
];

<MockProvider results={results}>
<MyComponentToTest />
</MockProvider>