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
|
import { describe, expect, it, jest } from '@jest/globals';
import { render, screen as rtlScreen } from '@testing-library/react';
import { SocialLink } from './social-link';
/**
* Next.js mock images to use next/image component. So for now, I need to mock
* the svg files manually.
*/
jest.mock('@assets/images/social-media/github.svg', () => 'svg-file');
jest.mock('@assets/images/social-media/gitlab.svg', () => 'svg-file');
jest.mock('@assets/images/social-media/linkedin.svg', () => 'svg-file');
jest.mock('@assets/images/social-media/twitter.svg', () => 'svg-file');
describe('SocialLink', () => {
it('render a Github social link', () => {
const label = 'sed ea impedit';
const target = '/voluptas';
render(<SocialLink icon="Github" label={label} url={target} />);
expect(rtlScreen.getByRole('link', { name: label })).toHaveAttribute(
'href',
target
);
});
it('render a Gitlab social link', () => {
const label = 'rerum velit asperiores';
const target = '/enim';
render(<SocialLink icon="Gitlab" label={label} url={target} />);
expect(rtlScreen.getByRole('link', { name: label })).toHaveAttribute(
'href',
target
);
});
it('render a LinkedIn social link', () => {
const label = 'in dolores sed';
const target = '/ut';
render(<SocialLink icon="LinkedIn" label={label} url={target} />);
expect(rtlScreen.getByRole('link', { name: label })).toHaveAttribute(
'href',
target
);
});
it('render a Twitter social link', () => {
const label = 'voluptatibus temporibus expedita';
const target = '/magni';
render(<SocialLink icon="Twitter" label={label} url={target} />);
expect(rtlScreen.getByRole('link', { name: label })).toHaveAttribute(
'href',
target
);
});
});
|
