Skip to content

Commit 94c1aa8

Browse files
AliceRAliceR
committed
chore: migrate to Yarn 4, remove @testing-library/react-hooks, update tests
- Upgraded project to Yarn 4.10.3 with `yarn set version latest` and `yarn install` - Removed @testing-library/react-hooks with `yarn remove` - Migrated all tests from waitForNextUpdate to waitFor from @testing-library/react - Resolved peer dependency warnings for React 18 - Run library tests from the root: `yarn test` - Run the example app and verify it works: - `cd example && yarn start` - Open http://localhost:3000 and check the app loads and functions as expected.
1 parent a619465 commit 94c1aa8

File tree

9 files changed

+19273
-13172
lines changed

9 files changed

+19273
-13172
lines changed

‎.yarnrc.yml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
nodeLinker: node-modules

‎example/yarn.lock‎

Lines changed: 12914 additions & 9092 deletions
Large diffs are not rendered by default.

‎package.json‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@
55
"repository": "git@github.com:developmentseed/stac-react.git",
66
"author": "Oliver Roick <oliver@roick.email>",
77
"license": "MIT",
8-
"private": false,
98
"main": "./dist/stac-react.cjs",
109
"module": "./dist/stac-react.es.mjs",
1110
"types": "./dist/index.d.ts",
@@ -18,7 +17,6 @@
1817
"@rollup/plugin-typescript": "^9.0.2",
1918
"@testing-library/jest-dom": "^5.16.4",
2019
"@testing-library/react": "^13.1.1",
21-
"@testing-library/react-hooks": "^8.0.0",
2220
"@types/geojson": "^7946.0.8",
2321
"@types/jest": "^27.4.1",
2422
"@types/react": "^18.0.8",
@@ -42,5 +40,5 @@
4240
"lint": "eslint 'src/**/*.ts' 'src/**/*.tsx'",
4341
"build": "rollup -c rollup.config.mjs"
4442
},
45-
"dependencies": {}
43+
"packageManager": "yarn@4.10.3"
4644
}

‎src/hooks/useCollection.test.ts‎

Lines changed: 15 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import fetch from 'jest-fetch-mock';
2-
import { renderHook, act } from '@testing-library/react-hooks';
2+
import { renderHook, act, waitFor } from '@testing-library/react';
33
import useCollection from './useCollection';
44
import wrapper from './wrapper';
55

@@ -18,14 +18,12 @@ describe('useCollection' ,() => {
1818
]
1919
}));
2020

21-
const { result, waitForNextUpdate } = renderHook(
21+
const { result } = renderHook(
2222
() => useCollection('abc'),
2323
{ wrapper }
2424
);
25-
await waitForNextUpdate();
26-
await waitForNextUpdate();
27-
expect(result.current.collection).toEqual({id: 'abc', title: 'Collection A'});
28-
expect(result.current.state).toEqual('IDLE');
25+
await waitFor(() => expect(result.current.state).toBe('IDLE'));
26+
await waitFor(() => expect(result.current.collection).toEqual({id: 'abc', title: 'Collection A'}));
2927
});
3028

3129
it('returns error if collection does not exist', async () => {
@@ -38,49 +36,40 @@ describe('useCollection' ,() => {
3836
]
3937
}));
4038

41-
const { result, waitForNextUpdate } = renderHook(
39+
const { result } = renderHook(
4240
() => useCollection('ghi'),
4341
{ wrapper }
4442
);
45-
await waitForNextUpdate();
46-
await waitForNextUpdate();
47-
expect(result.current.error).toEqual({
43+
await waitFor(() => expect(result.current.error).toEqual({
4844
status: 404,
4945
statusText: 'Not found',
5046
detail: 'Collection does not exist'
51-
});
47+
}));
5248
});
5349

5450
it('handles error with JSON response', async () => {
5551
fetch
5652
.mockResponseOnce(JSON.stringify({ links: [] }), { url: 'https://fake-stac-api.net' })
5753
.mockResponseOnce(JSON.stringify({ error: 'Wrong query' }), { status: 400, statusText: 'Bad Request' });
5854

59-
const { result, waitForNextUpdate } = renderHook(
55+
const { result } = renderHook(
6056
() => useCollection('abc'),
6157
{ wrapper }
6258
);
63-
await waitForNextUpdate();
64-
await waitForNextUpdate();
65-
66-
expect(result.current.error).toEqual({
59+
await waitFor(() => expect(result.current.error).toEqual({
6760
status: 400,
6861
statusText: 'Bad Request',
6962
detail: { error: 'Wrong query' }
70-
});
63+
}));
7164
});
7265

7366
it('handles error with non-JSON response', async () => {
7467
fetch
7568
.mockResponseOnce(JSON.stringify({ links: [] }), { url: 'https://fake-stac-api.net' })
7669
.mockResponseOnce('Wrong query', { status: 400, statusText: 'Bad Request' });
7770

78-
const { result, waitForNextUpdate } = renderHook(
79-
() => useCollection('abc'),
80-
{ wrapper }
81-
);
82-
await waitForNextUpdate();
83-
await waitForNextUpdate();
71+
const { result } = renderHook(() => useCollection('abc'), { wrapper });
72+
await waitFor(() => expect(result.current.error).toBeDefined());
8473

8574
expect(result.current.error).toEqual({
8675
status: 400,
@@ -105,17 +94,14 @@ describe('useCollection' ,() => {
10594
]
10695
}));
10796

108-
const { result, waitForNextUpdate } = renderHook(
97+
const { result } = renderHook(
10998
() => useCollection('abc'),
11099
{ wrapper }
111100
);
112-
await waitForNextUpdate();
113-
await waitForNextUpdate();
114-
expect(result.current.collection).toEqual({id: 'abc', title: 'Collection A'});
101+
await waitFor(() => expect(result.current.collection).toEqual({id: 'abc', title: 'Collection A'}));
115102

116103
act(() => result.current.reload());
117104

118-
await waitForNextUpdate();
119-
expect(result.current.collection).toEqual({id: 'abc', title: 'Collection A - Updated'});
105+
await waitFor(() => expect(result.current.collection).toEqual({id: 'abc', title: 'Collection A - Updated'}));
120106
});
121107
});

‎src/hooks/useCollections.test.ts‎

Lines changed: 17 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import fetch from 'jest-fetch-mock';
2-
import { renderHook, act } from '@testing-library/react-hooks';
2+
import { renderHook, act, waitFor } from '@testing-library/react';
33
import useCollections from './useCollections';
44
import wrapper from './wrapper';
55

@@ -13,15 +13,14 @@ describe('useCollections', () => {
1313
.mockResponseOnce(JSON.stringify({ links: [] }), { url: 'https://fake-stac-api.net' })
1414
.mockResponseOnce(JSON.stringify({ data: '12345' }));
1515

16-
const { result, waitForNextUpdate } = renderHook(
16+
const { result } = renderHook(
1717
() => useCollections(),
1818
{ wrapper }
1919
);
20-
await waitForNextUpdate();
21-
await waitForNextUpdate();
22-
expect(fetch.mock.calls[1][0]).toEqual('https://fake-stac-api.net/collections');
23-
expect(result.current.collections).toEqual({ data: '12345' });
24-
expect(result.current.state).toEqual('IDLE');
20+
await waitFor(() => expect(result.current.collections).toEqual({ data: '12345' }));
21+
await waitFor(() => expect(fetch.mock.calls[1][0]).toEqual('https://fake-stac-api.net/collections'));
22+
await waitFor(() => expect(result.current.collections).toEqual({ data: '12345' }));
23+
await waitFor(() => expect(result.current.state).toEqual('IDLE'));
2524
});
2625

2726
it('reloads collections', async () => {
@@ -30,56 +29,48 @@ describe('useCollections', () => {
3029
.mockResponseOnce(JSON.stringify({ data: 'original' }))
3130
.mockResponseOnce(JSON.stringify({ data: 'reloaded' }));
3231

33-
const { result, waitForNextUpdate } = renderHook(
32+
const { result } = renderHook(
3433
() => useCollections(),
3534
{ wrapper }
3635
);
37-
await waitForNextUpdate();
38-
await waitForNextUpdate();
39-
expect(result.current.collections).toEqual({ data: 'original' });
36+
await waitFor(() => expect(result.current.collections).toEqual({ data: 'original' }));
37+
await waitFor(() => expect(result.current.state).toEqual('IDLE'));
4038

41-
expect(result.current.state).toEqual('IDLE');
4239
act(() => result.current.reload());
43-
44-
await waitForNextUpdate();
45-
expect(result.current.collections).toEqual({ data: 'reloaded' });
40+
41+
await waitFor(() => expect(result.current.collections).toEqual({ data: 'reloaded' }));
4642
});
4743

4844
it('handles error with JSON response', async () => {
4945
fetch
5046
.mockResponseOnce(JSON.stringify({ links: [] }), { url: 'https://fake-stac-api.net' })
5147
.mockResponseOnce(JSON.stringify({ error: 'Wrong query' }), { status: 400, statusText: 'Bad Request' });
5248

53-
const { result, waitForNextUpdate } = renderHook(
49+
const { result } = renderHook(
5450
() => useCollections(),
5551
{ wrapper }
5652
);
5753

58-
await waitForNextUpdate();
59-
await waitForNextUpdate();
60-
61-
expect(result.current.error).toEqual({
54+
await waitFor(() => expect(result.current.error).toEqual({
6255
status: 400,
6356
statusText: 'Bad Request',
6457
detail: { error: 'Wrong query' }
65-
});
58+
}));
6659
});
6760

6861
it('handles error with non-JSON response', async () => {
6962
fetch
7063
.mockResponseOnce(JSON.stringify({ links: [] }), { url: 'https://fake-stac-api.net' })
7164
.mockResponseOnce('Wrong query', { status: 400, statusText: 'Bad Request' });
7265

73-
const { result, waitForNextUpdate } = renderHook(
66+
const { result } = renderHook(
7467
() => useCollections(),
7568
{ wrapper }
7669
);
77-
await waitForNextUpdate();
78-
await waitForNextUpdate();
79-
expect(result.current.error).toEqual({
70+
await waitFor(() => expect(result.current.error).toEqual({
8071
status: 400,
8172
statusText: 'Bad Request',
8273
detail: 'Wrong query'
83-
});
74+
}));
8475
});
8576
});

‎src/hooks/useItem.test.ts‎

Lines changed: 13 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import fetch from 'jest-fetch-mock';
2-
import { renderHook, act } from '@testing-library/react-hooks';
2+
import { renderHook, act, waitFor } from '@testing-library/react';
33
import useItem from './useItem';
44
import wrapper from './wrapper';
55

@@ -13,49 +13,44 @@ describe('useItem', () => {
1313
.mockResponseOnce(JSON.stringify({ id: 'abc', links: [] }))
1414
.mockResponseOnce(JSON.stringify({ id: 'abc' }));
1515

16-
const { result, waitForNextUpdate } = renderHook(
16+
const { result } = renderHook(
1717
() => useItem('https://fake-stac-api.net/items/abc'),
1818
{ wrapper }
1919
);
20-
await waitForNextUpdate();
21-
expect(result.current.item).toEqual({ id: 'abc' });
22-
expect(result.current.state).toEqual('IDLE');
20+
await waitFor(() => expect(result.current.item).toEqual({ id: 'abc' }));
21+
await waitFor(() => expect(result.current.state).toEqual('IDLE'));
2322
});
2423

2524
it('handles error with JSON response', async () => {
2625
fetch
2726
.mockResponseOnce(JSON.stringify({ id: 'abc', links: [] }))
2827
.mockResponseOnce(JSON.stringify({ error: 'Wrong query' }), { status: 400, statusText: 'Bad Request' });
2928

30-
const { result, waitForNextUpdate } = renderHook(
29+
const { result } = renderHook(
3130
() => useItem('https://fake-stac-api.net/items/abc'),
3231
{ wrapper }
3332
);
34-
await waitForNextUpdate();
35-
36-
expect(result.current.error).toEqual({
33+
await waitFor(() => expect(result.current.error).toEqual({
3734
status: 400,
3835
statusText: 'Bad Request',
3936
detail: { error: 'Wrong query' }
40-
});
37+
}));
4138
});
4239

4340
it('handles error with non-JSON response', async () => {
4441
fetch
4542
.mockResponseOnce(JSON.stringify({ id: 'abc', links: [] }))
4643
.mockResponseOnce('Wrong query', { status: 400, statusText: 'Bad Request' });
4744

48-
const { result, waitForNextUpdate } = renderHook(
45+
const { result } = renderHook(
4946
() => useItem('https://fake-stac-api.net/items/abc'),
5047
{ wrapper }
5148
);
52-
await waitForNextUpdate();
53-
54-
expect(result.current.error).toEqual({
49+
await waitFor(() => expect(result.current.error).toEqual({
5550
status: 400,
5651
statusText: 'Bad Request',
5752
detail: 'Wrong query'
58-
});
53+
}));
5954
});
6055

6156
it('reloads item', async () => {
@@ -64,16 +59,14 @@ describe('useItem', () => {
6459
.mockResponseOnce(JSON.stringify({ id: 'abc' }))
6560
.mockResponseOnce(JSON.stringify({ id: 'abc', description: 'Updated' }));
6661

67-
const { result, waitForNextUpdate } = renderHook(
62+
const { result } = renderHook(
6863
() => useItem('https://fake-stac-api.net/items/abc'),
6964
{ wrapper }
7065
);
71-
await waitForNextUpdate();
72-
expect(result.current.item).toEqual({ id: 'abc' });
66+
await waitFor(() => expect(result.current.item).toEqual({ id: 'abc' }));
7367

7468
act(() => result.current.reload());
7569

76-
await waitForNextUpdate();
77-
expect(result.current.item).toEqual({ id: 'abc', description: 'Updated' });
70+
await waitFor(() => expect(result.current.item).toEqual({ id: 'abc', description: 'Updated' }));
7871
});
7972
});

‎src/hooks/useStacApi.test.ts‎

Lines changed: 5 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import fetch from 'jest-fetch-mock';
2-
import { renderHook } from '@testing-library/react-hooks';
2+
import { renderHook, waitFor } from '@testing-library/react';
33
import useCollections from './useCollections';
44
import wrapper from './wrapper';
55

@@ -10,26 +10,22 @@ describe('useStacApi', () => {
1010
.mockResponseOnce(JSON.stringify({ links: [] }), { url: 'https://fake-stac-api.net' })
1111
.mockResponseOnce(JSON.stringify({ data: '12345' }));
1212

13-
const { waitForNextUpdate } = renderHook(
13+
renderHook(
1414
() => useCollections(),
1515
{ wrapper }
1616
);
17-
await waitForNextUpdate();
18-
await waitForNextUpdate();
19-
expect(fetch.mock.calls[1][0]).toEqual('https://fake-stac-api.net/collections');
17+
await waitFor(() => expect(fetch.mock.calls[1][0]).toEqual('https://fake-stac-api.net/collections'));
2018
});
2119

2220
it('initilises StacAPI with redirect URL', async () => {
2321
fetch
2422
.mockResponseOnce(JSON.stringify({ links: [] }), { url: 'https://fake-stac-api.net/redirect/' })
2523
.mockResponseOnce(JSON.stringify({ data: '12345' }));
2624

27-
const { waitForNextUpdate } = renderHook(
25+
renderHook(
2826
() => useCollections(),
2927
{ wrapper }
3028
);
31-
await waitForNextUpdate();
32-
await waitForNextUpdate();
33-
expect(fetch.mock.calls[1][0]).toEqual('https://fake-stac-api.net/redirect/collections');
29+
await waitFor(() => expect(fetch.mock.calls[1][0]).toEqual('https://fake-stac-api.net/redirect/collections'));
3430
});
3531
});

0 commit comments

Comments
 (0)