blob: 1f5d90e5a643d79128b46c305be25cd57a05b134 (
plain)
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
|
import { describe, expect, it } from '@jest/globals';
import { render, screen as rtlScreen } from '@testing-library/react';
import { ProgressBar } from './progress-bar';
describe('ProgressBar', () => {
it('renders a progress bar', () => {
const max = 50;
const current = 10;
const label = `${current} loaded out of a total of ${max}`;
render(<ProgressBar current={current} label={label} max={max} />);
expect(
rtlScreen.getByRole('progressbar', { name: label })
).toBeInTheDocument();
});
it('can render a progress bar with loading state', () => {
const max = 50;
const current = 10;
const label = `${current} loaded out of a total of ${max}`;
render(<ProgressBar current={current} isLoading label={label} max={max} />);
const progressBar = rtlScreen.getByRole('progressbar', { name: label });
expect(progressBar).not.toHaveValue();
expect(progressBar.parentElement).toHaveClass('progress--loading');
});
it('can render a centered progress bar', () => {
const max = 50;
const current = 10;
const label = `${current} loaded out of a total of ${max}`;
render(
<ProgressBar current={current} isCentered label={label} max={max} />
);
expect(
rtlScreen.getByRole('progressbar', { name: label }).parentElement
?.parentElement
).toHaveClass('wrapper--centered');
});
});
|