Skip to content

Commit 7b40394

Browse files
jcoynejcoyne
committed
Upgrade to vitest 4
1 parent 6cd07e4 commit 7b40394

5 files changed

Lines changed: 173 additions & 147 deletions

File tree

‎__tests__/src/components/AnnotationsOverlay.test.js‎

Lines changed: 91 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -59,27 +59,24 @@ describe('AnnotationsOverlay', () => {
5959
const resize = vi.fn();
6060
const canvasUpdate = vi.fn();
6161

62-
OpenSeadragonCanvasOverlay.mockImplementation(() => ({
63-
canvasUpdate,
64-
clear,
65-
resize,
66-
}));
62+
OpenSeadragonCanvasOverlay.mockImplementation(function () {
63+
return {
64+
canvasUpdate,
65+
clear,
66+
resize,
67+
};
68+
});
6769

6870
const { component, rerender, viewer } = createWrapper({ viewer: null });
6971

7072
const forceRedraw = vi.spyOn(viewer, 'forceRedraw');
7173

72-
rerender(cloneElement(
73-
component,
74-
{
75-
annotations: [
76-
new AnnotationList(
77-
{ '@id': 'foo', resources: [{ foo: 'bar' }] },
78-
),
79-
],
74+
rerender(
75+
cloneElement(component, {
76+
annotations: [new AnnotationList({ '@id': 'foo', resources: [{ foo: 'bar' }] })],
8077
viewer,
81-
},
82-
));
78+
}),
79+
);
8380

8481
// OSD ordinarily would fire this event:
8582
viewer.raiseEvent('update-viewport');
@@ -95,34 +92,46 @@ describe('AnnotationsOverlay', () => {
9592
it('converts the annotations to canvas and checks that the canvas is displayed', () => {
9693
const strokeRect = vi.fn();
9794
const context2d = {
98-
restore: () => { },
99-
save: () => { },
95+
restore: () => {},
96+
save: () => {},
10097
strokeRect,
10198
};
10299

103-
OpenSeadragonCanvasOverlay.mockImplementation(() => ({
104-
canvasUpdate: (f) => f(),
105-
clear: vi.fn(),
106-
context2d,
107-
resize: vi.fn(),
108-
}));
100+
OpenSeadragonCanvasOverlay.mockImplementation(function () {
101+
return {
102+
canvasUpdate: (f) => f(),
103+
clear: vi.fn(),
104+
context2d,
105+
resize: vi.fn(),
106+
};
107+
});
109108

110109
const palette = {
111110
default: { strokeStyle: 'yellow' },
112111
};
113-
const { component, rerender, viewer } = createWrapper({ palette: { annotations: palette }, viewer: null });
112+
const { component, rerender, viewer } = createWrapper({
113+
palette: { annotations: palette },
114+
viewer: null,
115+
});
114116

115-
vi.spyOn(viewer.viewport, 'getMaxZoom').mockImplementation(() => (1));
116-
vi.spyOn(viewer.viewport, 'getZoom').mockImplementation(() => (0.05));
117+
vi.spyOn(viewer.viewport, 'getMaxZoom').mockImplementation(() => 1);
118+
vi.spyOn(viewer.viewport, 'getZoom').mockImplementation(() => 0.05);
117119

118-
rerender(cloneElement(component, {
119-
annotations: [
120-
new AnnotationList(
121-
{ '@id': 'foo', resources: [{ on: 'http://iiif.io/api/presentation/2.0/example/fixtures/canvas/24/c1.json#xywh=10,10,100,200' }] },
122-
),
123-
],
124-
viewer,
125-
}));
120+
rerender(
121+
cloneElement(component, {
122+
annotations: [
123+
new AnnotationList({
124+
'@id': 'foo',
125+
resources: [
126+
{
127+
on: 'http://iiif.io/api/presentation/2.0/example/fixtures/canvas/24/c1.json#xywh=10,10,100,200',
128+
},
129+
],
130+
}),
131+
],
132+
viewer,
133+
}),
134+
);
126135

127136
// OSD ordinarily would fire this event:
128137
viewer.raiseEvent('update-viewport');
@@ -140,17 +149,17 @@ describe('AnnotationsOverlay', () => {
140149

141150
const { viewer } = createWrapper({
142151
annotations: [
143-
new AnnotationList(
144-
{
145-
'@id': 'foo',
146-
resources: [{
152+
new AnnotationList({
153+
'@id': 'foo',
154+
resources: [
155+
{
147156
'@id': 'http://example.org/identifier/annotation/anno-line',
148157
'@type': 'oa:Annotation',
149158
motivation: 'sc:painting',
150159
on: 'http://iiif.io/api/presentation/2.0/example/fixtures/canvas/24/c1.json#xywh=100,100,250,20',
151-
}],
152-
},
153-
),
160+
},
161+
],
162+
}),
154163
],
155164
selectAnnotation,
156165
});
@@ -160,25 +169,28 @@ describe('AnnotationsOverlay', () => {
160169
position: new OpenSeadragon.Point(101, 101),
161170
});
162171

163-
expect(selectAnnotation).toHaveBeenCalledWith('base', 'http://example.org/identifier/annotation/anno-line');
172+
expect(selectAnnotation).toHaveBeenCalledWith(
173+
'base',
174+
'http://example.org/identifier/annotation/anno-line',
175+
);
164176
});
165177

166178
it('triggers a deselectAnnotation for an already-selected annotation', () => {
167179
const deselectAnnotation = vi.fn();
168180

169181
const { viewer } = createWrapper({
170182
annotations: [
171-
new AnnotationList(
172-
{
173-
'@id': 'foo',
174-
resources: [{
183+
new AnnotationList({
184+
'@id': 'foo',
185+
resources: [
186+
{
175187
'@id': 'http://example.org/identifier/annotation/anno-line',
176188
'@type': 'oa:Annotation',
177189
motivation: 'sc:painting',
178190
on: 'http://iiif.io/api/presentation/2.0/example/fixtures/canvas/24/c1.json#xywh=100,100,250,20',
179-
}],
180-
},
181-
),
191+
},
192+
],
193+
}),
182194
],
183195
deselectAnnotation,
184196
selectedAnnotationId: 'http://example.org/identifier/annotation/anno-line',
@@ -189,35 +201,40 @@ describe('AnnotationsOverlay', () => {
189201
position: new OpenSeadragon.Point(101, 101),
190202
});
191203

192-
expect(deselectAnnotation).toHaveBeenCalledWith('base', 'http://example.org/identifier/annotation/anno-line');
204+
expect(deselectAnnotation).toHaveBeenCalledWith(
205+
'base',
206+
'http://example.org/identifier/annotation/anno-line',
207+
);
193208
});
194209

195210
it('selects the closest annotation', () => {
196211
const selectAnnotation = vi.fn();
197212

198213
const { viewer } = createWrapper({
199214
annotations: [
200-
new AnnotationList(
201-
{
202-
'@id': 'foo',
203-
resources: [{
215+
new AnnotationList({
216+
'@id': 'foo',
217+
resources: [
218+
{
204219
'@id': 'http://example.org/identifier/annotation/anno-line',
205220
'@type': 'oa:Annotation',
206221
motivation: 'sc:painting',
207222
on: 'http://iiif.io/api/presentation/2.0/example/fixtures/canvas/24/c1.json#xywh=100,100,250,20',
208-
}, {
223+
},
224+
{
209225
'@id': 'http://example.org/identifier/annotation/larger-box',
210226
'@type': 'oa:Annotation',
211227
motivation: 'sc:painting',
212228
on: 'http://iiif.io/api/presentation/2.0/example/fixtures/canvas/24/c1.json#xywh=0,0,250,250',
213-
}, {
229+
},
230+
{
214231
'@id': 'http://example.org/identifier/annotation/on-another-canvas',
215232
'@type': 'oa:Annotation',
216233
motivation: 'sc:painting',
217234
on: 'http://iiif.io/some-other-canvas#xywh=101,101,3,3',
218-
}],
219-
},
220-
),
235+
},
236+
],
237+
}),
221238
],
222239
selectAnnotation,
223240
});
@@ -227,7 +244,10 @@ describe('AnnotationsOverlay', () => {
227244
position: new OpenSeadragon.Point(101, 101),
228245
});
229246

230-
expect(selectAnnotation).toHaveBeenCalledWith('base', 'http://example.org/identifier/annotation/anno-line');
247+
expect(selectAnnotation).toHaveBeenCalledWith(
248+
'base',
249+
'http://example.org/identifier/annotation/anno-line',
250+
);
231251
});
232252
});
233253

@@ -238,27 +258,29 @@ describe('AnnotationsOverlay', () => {
238258

239259
const { viewer } = createWrapper({
240260
annotations: [
241-
new AnnotationList(
242-
{
243-
'@id': 'foo',
244-
resources: [{
261+
new AnnotationList({
262+
'@id': 'foo',
263+
resources: [
264+
{
245265
'@id': 'foo',
246266
'@type': 'oa:Annotation',
247267
motivation: 'sc:painting',
248268
on: 'http://iiif.io/api/presentation/2.0/example/fixtures/canvas/24/c1.json#xywh=100,100,250,20',
249-
}, {
269+
},
270+
{
250271
'@id': 'bar',
251272
'@type': 'oa:Annotation',
252273
motivation: 'sc:painting',
253274
on: 'http://iiif.io/api/presentation/2.0/example/fixtures/canvas/24/c1.json#xywh=0,0,250,250',
254-
}, {
275+
},
276+
{
255277
'@id': 'irrelevant-box',
256278
'@type': 'oa:Annotation',
257279
motivation: 'sc:painting',
258280
on: 'http://iiif.io/api/presentation/2.0/example/fixtures/canvas/24/c1.json#xywh=0,0,50,50',
259-
}],
260-
},
261-
),
281+
},
282+
],
283+
}),
262284
],
263285
hoverAnnotation,
264286
});

‎__tests__/src/components/OpenSeadragonComponent.test.js‎

Lines changed: 23 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -13,26 +13,28 @@ describe('OpenSeadragonComponent', () => {
1313
fitBoundsWithConstraints = vi.fn();
1414

1515
// Mock methods used in the component
16-
OpenSeadragon.mockImplementation(() => ({
17-
addHandler: vi.fn(),
18-
addOnceHandler,
19-
canvas: {},
20-
destroy: vi.fn(),
21-
innerTracker: {},
22-
removeAllHandlers: vi.fn(),
23-
viewport: {
24-
centerSpringX: { target: { value: 0 } },
25-
centerSpringY: { target: { value: 0 } },
26-
fitBounds: vi.fn(),
27-
fitBoundsWithConstraints,
28-
zoomSpring: { target: { value: 1 } },
29-
},
30-
world: { addOnceHandler },
31-
}));
32-
33-
OpenSeadragon.Rect = vi.fn((x, y, width, height) => ({
34-
height, width, x, y,
35-
}));
16+
OpenSeadragon.mockImplementation(function () {
17+
return {
18+
addHandler: vi.fn(),
19+
addOnceHandler,
20+
canvas: {},
21+
destroy: vi.fn(),
22+
innerTracker: {},
23+
removeAllHandlers: vi.fn(),
24+
viewport: {
25+
centerSpringX: { target: { value: 0 } },
26+
centerSpringY: { target: { value: 0 } },
27+
fitBounds: vi.fn(),
28+
fitBoundsWithConstraints,
29+
zoomSpring: { target: { value: 1 } },
30+
},
31+
world: { addOnceHandler },
32+
};
33+
});
34+
35+
OpenSeadragon.Rect = vi.fn(function (x, y, width, height) {
36+
return { height, width, x, y };
37+
});
3638
});
3739

3840
/**
@@ -53,9 +55,7 @@ describe('OpenSeadragonComponent', () => {
5355
* @returns {object} Render result
5456
*/
5557
function renderAndInitialize(bounds = [0, 0, 5000, 3000]) {
56-
const result = render(
57-
<OpenSeadragonComponent windowId="test" viewerConfig={{ bounds }} />,
58-
);
58+
const result = render(<OpenSeadragonComponent windowId="test" viewerConfig={{ bounds }} />);
5959

6060
// Component registers a 'tile-loaded' handler during mount to set initial viewport
6161
invokeTileLoadedHandler();

‎__tests__/src/components/WorkspaceExport.test.js‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -19,13 +19,7 @@ describe('WorkspaceExport', () => {
1919
workspace: {},
2020
};
2121

22-
render(
23-
<WorkspaceExport
24-
open
25-
handleClose={handleClose}
26-
exportableState={mockState}
27-
/>,
28-
);
22+
render(<WorkspaceExport open handleClose={handleClose} exportableState={mockState} />);
2923
});
3024

3125
it('renders without an error', () => {
@@ -44,18 +38,24 @@ describe('WorkspaceExport', () => {
4438
it('reveals a snackbar on copy', async () => {
4539
// jsdom doesn't support the clipboard API or prompt (used as a fallback)
4640
// so we mock the prompt at least to avoid a warning in the test output
47-
vi.spyOn(window, 'prompt').mockImplementation(() => true);
41+
vi.stubGlobal(
42+
'prompt',
43+
vi.fn(() => true),
44+
);
4845

4946
await user.click(screen.getByRole('button', { name: 'Copy' }));
50-
expect(screen.getByRole('alert')).toHaveTextContent('The workspace configuration was copied to your clipboard');
47+
expect(screen.getByRole('alert')).toHaveTextContent(
48+
'The workspace configuration was copied to your clipboard',
49+
);
5150

5251
await user.click(screen.getByRole('button', { name: 'Dismiss' }));
5352
expect(handleClose).toHaveBeenCalled();
5453
});
5554

5655
it('renders an exportable version of state', async () => {
5756
await user.click(screen.getByRole('button', { name: 'View workspace configuration' }));
58-
expect(screen.getByRole('region').querySelector('pre')).toHaveTextContent( // eslint-disable-line testing-library/no-node-access
57+
// eslint-disable-next-line testing-library/no-node-access
58+
expect(screen.getByRole('region').querySelector('pre')).toHaveTextContent(
5959
'{ "companionWindows": {}, "config": {}, "elasticLayout": {}, "viewers": {}, "windows": {}, "workspace": {} }',
6060
);
6161
});

0 commit comments

Comments
 (0)