-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathApp.test.js
More file actions
99 lines (77 loc) · 2.7 KB
/
App.test.js
File metadata and controls
99 lines (77 loc) · 2.7 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
import React from 'react';
import App from './App';
import { render, within, fireEvent, cleanup } from '@testing-library/react';
import '@testing-library/jest-dom/extend-expect';
const testIds = {
restartButton: "button-restart",
prevButton: "button-prev",
nextButton: "button-next",
title: "title",
text: "text",
};
const makeSlides = (numSlides) => Array.from({length: 10}, (_, idx) => ({ title: `title ${idx}`, text: `text ${idx}` }));
const renderApp = (slides) => render(<App slides={slides} />);
beforeEach(() => {
});
afterEach(() => {
cleanup();
});
test('App renders correctly', () => {
const slides = makeSlides(2);
const { getByTestId } = renderApp(slides);
const restartButton = getByTestId(testIds.restartButton);
expect(restartButton).toHaveTextContent("Restart");
expect(restartButton).toBeDisabled();
const prevButton = getByTestId(testIds.prevButton);
expect(prevButton).toHaveTextContent("Prev");
expect(prevButton).toBeDisabled();
const nextButton = getByTestId(testIds.nextButton);
expect(nextButton).toHaveTextContent("Next");
expect(nextButton).toBeEnabled();
const titleElem = getByTestId(testIds.title);
expect(titleElem).toHaveTextContent(slides[0].title);
const textElem = getByTestId(testIds.text);
expect(textElem).toHaveTextContent(slides[0].text);
});
test('Switching between slides works as expected', () => {
const slides = makeSlides(5);
const { getByTestId } = renderApp(slides);
const restartButton = getByTestId(testIds.restartButton);
const prevButton = getByTestId(testIds.prevButton);
const nextButton = getByTestId(testIds.nextButton);
const titleElem = getByTestId(testIds.title);
const textElem = getByTestId(testIds.text);
const clicks = [
'next', 'next', 'next', 'prev', 'prev', 'prev', 'next', 'next', 'restart', 'next', 'next', 'next', 'next', 'prev',
];
let idx = 0;
for (const click of clicks) {
if (click === 'restart') {
fireEvent.click(restartButton);
idx = 0;
} else if (click === 'prev') {
fireEvent.click(prevButton);
idx -= 1;
} else if (click === 'next') {
fireEvent.click(nextButton);
idx += 1;
}
expect(idx >= 0).toEqual(true);
expect(idx < slides.length).toEqual(true);
if (idx > 0) {
expect(restartButton).toBeEnabled();
expect(prevButton).toBeEnabled();
} else {
expect(restartButton).toBeDisabled();
expect(prevButton).toBeDisabled();
}
if (idx+1 < slides.length) {
expect(nextButton).toBeEnabled();
} else {
expect(nextButton).toBeDisabled();
}
const { title, text } = slides[idx];
expect(titleElem).toHaveTextContent(title);
expect(textElem).toHaveTextContent(text);
}
});