Resource
import { createResource, Entity } from '@data-client/rest';
export default class Article extends Entity {
id = '';
content = '';
author: number | null = null;
contributors: number[] = [];
pk() {
return this.id?.toString();
}
}
export const ArticleResource = createResource({
urlRoot: 'http://test.com',
path: '/article/:id',
schema: Article,
})
Fixtures
export default {
full: [
{
endpoint: ArticleResource.getList,
args: [{ maxResults: 10 }],
response: [
{
id: 5,
content: 'have a merry christmas',
author: 2,
contributors: [],
},
{
id: 532,
content: 'never again',
author: 23,
contributors: [5],
},
],
},
],
empty: [
{
endpoint: ArticleResource.getList,
args: [{ maxResults: 10 }],
response: [],
},
],
error: [
{
endpoint: ArticleResource.getList,
args: [{ maxResults: 10 }],
response: { message: 'Bad request', status: 400, name: 'Not Found' },
error: true,
},
],
loading: [],
};
Storybook
import { MockResolver } from '@data-client/test';
import type { Fixture } from '@data-client/test';
import { Story } from '@storybook/react/types-6-0';
import ArticleList from 'ArticleList';
import options from './fixtures';
export default {
title: 'Pages/ArticleList',
component: ArticleList,
};
export const FullArticleList = ({ result }) => (
<MockResolver fixtures={options[result]}>
<ArticleList maxResults={10} />
</MockResolver>
);
Hook Unit Test
import { CacheProvider } from '@data-client/react';
import { makeRenderDataClient } from '@data-client/test';
import options from './fixtures';
const renderDataClient = makeRenderDataClient(CacheProvider);
it('should resolve list', async () => {
const { result } = renderDataClient(
() => {
return useSuspense(ArticleResource.getList, {
maxResults: 10,
});
},
{ initialFixtures: options.full },
);
expect(result.current).toBeDefined();
expect(result.current.length).toBe(2);
expect(result.current[0]).toBeInstanceOf(ArticleResource);
});
it('should throw errors on bad network', async () => {
const { result } = renderDataClient(
() => {
return useSuspense(ArticleResource.getList, {
maxResults: 10,
});
},
{ initialFixtures: options.error },
);
expect(result.error).toBeDefined();
expect((result.error as any).status).toBe(400);
});