Skip to content

Commit f19517b

Browse files
authored
test: migrate lifecycle tests to use vitest spies (#4815)
* test: migrate lifecycle tests to use vitest spies Last one for the browser tests! * chore: add missing import
1 parent 6ab3132 commit f19517b

11 files changed

+308
-272
lines changed

test/browser/lifecycles/componentDidCatch.test.js

Lines changed: 90 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { setupRerender } from 'preact/test-utils';
22
import { createElement, render, Component, Fragment } from 'preact';
33
import { setupScratch, teardown } from '../../_util/helpers';
4+
import { vi } from 'vitest';
45

56
/** @jsx createElement */
67

@@ -42,8 +43,8 @@ describe('Lifecycle methods', () => {
4243

4344
let thrower;
4445

45-
sinon.spy(Receiver.prototype, 'componentDidCatch');
46-
sinon.spy(Receiver.prototype, 'render');
46+
vi.spyOn(Receiver.prototype, 'componentDidCatch');
47+
vi.spyOn(Receiver.prototype, 'render');
4748

4849
function throwExpectedError() {
4950
throw (expectedError = new Error('Error!'));
@@ -63,19 +64,19 @@ describe('Lifecycle methods', () => {
6364
return <div>ThrowErr: componentDidCatch</div>;
6465
}
6566
};
66-
sinon.spy(ThrowErr.prototype, 'componentDidCatch');
67+
vi.spyOn(ThrowErr.prototype, 'componentDidCatch');
6768

6869
expectedError = undefined;
6970

70-
Receiver.prototype.componentDidCatch.resetHistory();
71-
Receiver.prototype.render.resetHistory();
71+
Receiver.prototype.componentDidCatch.mockClear();
72+
Receiver.prototype.render.mockClear();
7273
});
7374

7475
afterEach(() => {
7576
expect(
7677
ThrowErr.prototype.componentDidCatch,
7778
"Throwing component should not catch it's own error."
78-
).to.not.be.called;
79+
).not.toHaveBeenCalled();
7980
thrower = undefined;
8081
});
8182

@@ -101,8 +102,9 @@ describe('Lifecycle methods', () => {
101102
);
102103
rerender();
103104

104-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
105-
expectedError
105+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
106+
expectedError,
107+
expect.anything()
106108
);
107109
});
108110

@@ -136,8 +138,9 @@ describe('Lifecycle methods', () => {
136138
</Receiver>,
137139
scratch
138140
);
139-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
140-
expectedError
141+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
142+
expectedError,
143+
expect.anything()
141144
);
142145
});
143146

@@ -150,8 +153,9 @@ describe('Lifecycle methods', () => {
150153
</Receiver>,
151154
scratch
152155
);
153-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
154-
expectedError
156+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
157+
expectedError,
158+
expect.anything()
155159
);
156160
});
157161

@@ -164,26 +168,28 @@ describe('Lifecycle methods', () => {
164168
</Receiver>,
165169
scratch
166170
);
167-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
168-
expectedError
171+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
172+
expectedError,
173+
expect.anything()
169174
);
170175
});
171176

172177
it('should be called when child fails in getDerivedStateFromProps', () => {
173178
ThrowErr.getDerivedStateFromProps = throwExpectedError;
174179

175-
sinon.spy(ThrowErr.prototype, 'render');
180+
vi.spyOn(ThrowErr.prototype, 'render');
176181
render(
177182
<Receiver>
178183
<ThrowErr />
179184
</Receiver>,
180185
scratch
181186
);
182187

183-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
184-
expectedError
188+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
189+
expectedError,
190+
expect.anything()
185191
);
186-
expect(ThrowErr.prototype.render).not.to.have.been.called;
192+
expect(ThrowErr.prototype.render).not.toHaveBeenCalled();
187193
});
188194

189195
it('should be called when child fails in getSnapshotBeforeUpdate', () => {
@@ -198,8 +204,9 @@ describe('Lifecycle methods', () => {
198204
thrower.forceUpdate();
199205
rerender();
200206

201-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
202-
expectedError
207+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
208+
expectedError,
209+
expect.anything()
203210
);
204211
});
205212

@@ -215,8 +222,9 @@ describe('Lifecycle methods', () => {
215222

216223
thrower.forceUpdate();
217224
rerender();
218-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
219-
expectedError
225+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
226+
expectedError,
227+
expect.anything()
220228
);
221229
});
222230

@@ -232,8 +240,9 @@ describe('Lifecycle methods', () => {
232240

233241
thrower.forceUpdate();
234242
rerender();
235-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
236-
expectedError
243+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
244+
expectedError,
245+
expect.anything()
237246
);
238247
});
239248

@@ -259,14 +268,15 @@ describe('Lifecycle methods', () => {
259268
}
260269
}
261270

262-
sinon.spy(Receiver.prototype, 'componentDidCatch');
271+
vi.spyOn(Receiver.prototype, 'componentDidCatch');
263272
render(<Receiver />, scratch);
264273

265274
receiver.setState({ foo: 'baz' });
266275
rerender();
267276

268-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
269-
expectedError
277+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
278+
expectedError,
279+
expect.anything()
270280
);
271281
});
272282

@@ -292,14 +302,15 @@ describe('Lifecycle methods', () => {
292302
}
293303
}
294304

295-
sinon.spy(Receiver.prototype, 'componentDidCatch');
305+
vi.spyOn(Receiver.prototype, 'componentDidCatch');
296306
render(<Receiver />, scratch);
297307

298308
receiver.setState({ foo: 'baz' });
299309
rerender();
300310

301-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
302-
expectedError
311+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
312+
expectedError,
313+
expect.anything()
303314
);
304315
});
305316

@@ -318,8 +329,9 @@ describe('Lifecycle methods', () => {
318329
</Receiver>,
319330
scratch
320331
);
321-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
322-
expectedError
332+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
333+
expectedError,
334+
expect.anything()
323335
);
324336
});
325337

@@ -347,10 +359,11 @@ describe('Lifecycle methods', () => {
347359
}
348360
}
349361

350-
sinon.spy(Receiver.prototype, 'componentDidCatch');
362+
vi.spyOn(Receiver.prototype, 'componentDidCatch');
351363
render(<Receiver />, scratch);
352-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
353-
expectedError
364+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
365+
expectedError,
366+
expect.anything()
354367
);
355368
});
356369

@@ -376,10 +389,11 @@ describe('Lifecycle methods', () => {
376389
}
377390
}
378391

379-
sinon.spy(Receiver.prototype, 'componentDidCatch');
392+
vi.spyOn(Receiver.prototype, 'componentDidCatch');
380393
render(<Receiver />, scratch);
381-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
382-
expectedError
394+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
395+
expectedError,
396+
expect.anything()
383397
);
384398
});
385399

@@ -404,8 +418,10 @@ describe('Lifecycle methods', () => {
404418
</Receiver>,
405419
scratch
406420
);
407-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledOnceWith(
408-
expectedError
421+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledOnce();
422+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
423+
expectedError,
424+
expect.anything()
409425
);
410426
});
411427

@@ -420,8 +436,9 @@ describe('Lifecycle methods', () => {
420436
</Receiver>,
421437
scratch
422438
);
423-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
424-
expectedError
439+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
440+
expectedError,
441+
expect.anything()
425442
);
426443
});
427444

@@ -438,8 +455,9 @@ describe('Lifecycle methods', () => {
438455
</Receiver>,
439456
scratch
440457
);
441-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
442-
expectedError
458+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
459+
expectedError,
460+
expect.anything()
443461
);
444462
});
445463

@@ -481,7 +499,7 @@ describe('Lifecycle methods', () => {
481499
throwExpectedError();
482500
}
483501

484-
sinon.spy(Adapter.prototype, 'componentDidCatch');
502+
vi.spyOn(Adapter.prototype, 'componentDidCatch');
485503
render(
486504
<Receiver>
487505
<Adapter>
@@ -491,11 +509,13 @@ describe('Lifecycle methods', () => {
491509
scratch
492510
);
493511

494-
expect(Adapter.prototype.componentDidCatch).to.have.been.calledWith(
495-
expectedError
512+
expect(Adapter.prototype.componentDidCatch).toHaveBeenCalledWith(
513+
expectedError,
514+
expect.anything()
496515
);
497-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
498-
adaptedError
516+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
517+
adaptedError,
518+
expect.anything()
499519
);
500520

501521
rerender();
@@ -521,7 +541,7 @@ describe('Lifecycle methods', () => {
521541
throwExpectedError();
522542
}
523543

524-
sinon.spy(Adapter.prototype, 'componentDidCatch');
544+
vi.spyOn(Adapter.prototype, 'componentDidCatch');
525545

526546
render(
527547
<Receiver>
@@ -533,11 +553,13 @@ describe('Lifecycle methods', () => {
533553
);
534554
rerender();
535555

536-
expect(Adapter.prototype.componentDidCatch).to.have.been.calledWith(
537-
expectedError
556+
expect(Adapter.prototype.componentDidCatch).toHaveBeenCalledWith(
557+
expectedError,
558+
expect.anything()
538559
);
539-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
540-
expectedError
560+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
561+
expectedError,
562+
expect.anything()
541563
);
542564
expect(scratch).to.have.property('textContent', 'Error: Error!');
543565
});
@@ -556,7 +578,7 @@ describe('Lifecycle methods', () => {
556578
throw new Error('Error!');
557579
}
558580

559-
sinon.spy(Adapter.prototype, 'componentDidCatch');
581+
vi.spyOn(Adapter.prototype, 'componentDidCatch');
560582

561583
render(
562584
<Receiver>
@@ -568,10 +590,8 @@ describe('Lifecycle methods', () => {
568590
);
569591
rerender();
570592

571-
expect(Adapter.prototype.componentDidCatch, 'Adapter').to.have.been
572-
.called;
573-
expect(Receiver.prototype.componentDidCatch, 'Receiver').to.have.been
574-
.called;
593+
expect(Adapter.prototype.componentDidCatch).toHaveBeenCalled();
594+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalled();
575595
expect(scratch).to.have.property('textContent', 'Error: Error!');
576596
});
577597

@@ -595,7 +615,7 @@ describe('Lifecycle methods', () => {
595615
throwExpectedError();
596616
}
597617

598-
sinon.spy(TopReceiver.prototype, 'componentDidCatch');
618+
vi.spyOn(TopReceiver.prototype, 'componentDidCatch');
599619

600620
render(
601621
<TopReceiver>
@@ -607,9 +627,10 @@ describe('Lifecycle methods', () => {
607627
);
608628
rerender();
609629

610-
expect(TopReceiver.prototype.componentDidCatch).not.to.have.been.called;
611-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
612-
expectedError
630+
expect(TopReceiver.prototype.componentDidCatch).not.toHaveBeenCalled();
631+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
632+
expectedError,
633+
expect.anything()
613634
);
614635
expect(scratch).to.have.property('textContent', 'Error: Error!');
615636
});
@@ -624,8 +645,9 @@ describe('Lifecycle methods', () => {
624645
</Receiver>,
625646
scratch
626647
);
627-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
628-
expectedError
648+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
649+
expectedError,
650+
expect.anything()
629651
);
630652
});
631653

@@ -646,8 +668,9 @@ describe('Lifecycle methods', () => {
646668
</Receiver>,
647669
scratch
648670
);
649-
expect(Receiver.prototype.componentDidCatch).to.have.been.calledWith(
650-
expectedError
671+
expect(Receiver.prototype.componentDidCatch).toHaveBeenCalledWith(
672+
expectedError,
673+
expect.anything()
651674
);
652675
});
653676

0 commit comments

Comments
 (0)