Skip to content

Commit 537a4ae

Browse files
committed
part of Utils snapshot tests
1 parent c44416a commit 537a4ae

File tree

8 files changed

+208
-87
lines changed

8 files changed

+208
-87
lines changed

__tests__/Utils/AvatarPack.test.js

Lines changed: 4 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -2,53 +2,14 @@
22
* @jest-environment jsdom
33
*/
44
import React from 'react';
5-
import { render, screen } from '../../test-utils';
65
import AvatarPack from '../../components/Utils/AvatarPack';
7-
import nextRouter from 'next/router';
8-
import userEvent from '@testing-library/user-event';
6+
import renderer from 'react-test-renderer';
97
// Test cases for full balances, empty balances, and undefined balances.
108

11-
nextRouter.useRouter = jest.fn();
12-
const push = jest.fn(() => {
13-
return { catch: jest.fn };
14-
});
15-
169
describe('AvatarPack', () => {
1710
// Test cases for
18-
19-
beforeEach(() => {
20-
nextRouter.useRouter.mockImplementation(() => ({
21-
query: { type: null },
22-
prefetch: jest.fn(() => {
23-
return { catch: jest.fn };
24-
}),
25-
push,
26-
}));
27-
});
28-
it('should show org name on hover', async () => {
29-
// ARRANGE
30-
const user = userEvent.setup();
31-
32-
render(
33-
<AvatarPack
34-
avatars={[
35-
{
36-
login: 'OpenQDev',
37-
url: 'https://github.com/OpenQDev',
38-
avatarUrl: 'https://avatars.githubusercontent.com/u/77402538?s=200&v=4',
39-
},
40-
]}
41-
/>
42-
);
43-
// ASSERT
44-
await user.hover(screen.getByTestId('link'));
45-
expect(screen.getByText('OpenQDev')).toBeInTheDocument();
46-
});
47-
48-
it('should have link with correct url', async () => {
49-
// ARRANGE
50-
51-
render(
11+
it('should match DOM Snapshot', () => {
12+
const tree = renderer.create(
5213
<AvatarPack
5314
avatars={[
5415
{
@@ -59,7 +20,6 @@ describe('AvatarPack', () => {
5920
]}
6021
/>
6122
);
62-
// ASSERT
63-
expect(screen.getByTestId('link')).toBeInTheDocument();
23+
expect(tree.toJSON()).toMatchSnapshot();
6424
});
6525
});

__tests__/Utils/Carousel.test.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { render, screen, waitFor } from '../../test-utils';
66
import Carousel from '../../components/Utils/Carousel';
77
import CarouselBounty from '../../components/Bounty/CarouselBounty';
88
import nextRouter from 'next/router';
9+
import ShallowRenderer from 'react-test-renderer/shallow';
910
// Test cases for full balances, empty balances, and undefined balances.
1011

1112
nextRouter.useRouter = jest.fn();
@@ -172,6 +173,12 @@ describe('Carousel', () => {
172173
push,
173174
}));
174175
});
176+
it('should match DOM Snapshot', () => {
177+
const shallow = new ShallowRenderer();
178+
shallow.render(<Carousel height={36}></Carousel>);
179+
const tree = shallow.getRenderOutput();
180+
expect(tree).toMatchSnapshot();
181+
});
175182
it('should display repo name and title', async () => {
176183
// ARRANGE
177184

__tests__/Utils/DropdownBasic.test.js renamed to __tests__/Utils/Dropdown.test.js

Lines changed: 6 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { render, screen } from '../../test-utils';
66
import Dropdown from '../../components/Utils/Dropdown';
77
import userEvent from '@testing-library/user-event';
88
import nextRouter from 'next/router';
9+
import renderer from 'react-test-renderer';
910

1011
nextRouter.useRouter = jest.fn();
1112
describe('Dropdown', () => {
@@ -14,24 +15,11 @@ describe('Dropdown', () => {
1415
beforeEach(() => {});
1516
const names = ['foo', 'bar'];
1617

17-
it('should be render with title', async () => {
18-
// ARRANGE
19-
render(<Dropdown toggleFunc={mockDropdown} title={title} names={names} toggleVal={names[0]} />);
20-
const displayTitle = screen.getByText('pizzas');
21-
const firstName = screen.getByText(names[0]);
22-
const altName = screen.getByText(names[1]);
23-
expect(firstName).toBeInTheDocument();
24-
expect(altName).toBeInTheDocument();
25-
expect(displayTitle).toBeInTheDocument();
26-
});
27-
28-
it('should render firstname as title when !title prop', async () => {
29-
// ARRANGE
30-
render(<Dropdown toggleFunc={mockDropdown} title={title} names={names} toggleVal={names[0]} />);
31-
const firstName = screen.getAllByText(names[0]);
32-
const altName = screen.getByText(names[1]);
33-
expect(firstName[0]).toBeInTheDocument();
34-
expect(altName).toBeInTheDocument();
18+
it('should match DOM Snapshot', () => {
19+
const tree = renderer.create(
20+
<Dropdown toggleFunc={mockDropdown} title={title} names={names} toggleVal={names[0]} />
21+
);
22+
expect(tree.toJSON()).toMatchSnapshot();
3523
});
3624

3725
it('should be useable dropdown', async () => {

__tests__/Utils/Jazzicon.test.js

Lines changed: 4 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -2,37 +2,16 @@
22
* @jest-environment jsdom
33
*/
44
import React from 'react';
5-
import { render, screen } from '../../test-utils';
65
import Jazzicon from '../../components/Utils/Jazzicon';
7-
import nextRouter from 'next/router';
6+
import renderer from 'react-test-renderer';
87
// Test cases for full balances, empty balances, and undefined balances.
98

10-
nextRouter.useRouter = jest.fn();
11-
const push = jest.fn(() => {
12-
return { catch: jest.fn };
13-
});
149
const address = '0xf39Fd6e51aad88F6F4ce6aB8827279cffFb92266';
1510

1611
describe('Jazzicon', () => {
1712
// Test cases for
18-
19-
beforeEach(() => {
20-
nextRouter.useRouter.mockImplementation(() => ({
21-
query: { type: null },
22-
prefetch: jest.fn(() => {
23-
return { catch: jest.fn };
24-
}),
25-
push,
26-
}));
27-
});
28-
it('should display address and have link', async () => {
29-
// ARRANGE
30-
31-
render(<Jazzicon address={address} size={24} />);
32-
// ASSERT
33-
const icon = screen.getAllByTestId('link');
34-
const toolTip = screen.getByText(address);
35-
expect(icon[0]).toBeInTheDocument();
36-
expect(toolTip).toBeInTheDocument();
13+
it('should match DOM Snapshot', () => {
14+
const tree = renderer.create(<Jazzicon address={address} size={24} />);
15+
expect(tree.toJSON()).toMatchSnapshot();
3716
});
3817
});
Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`AvatarPack should match DOM Snapshot 1`] = `
4+
<div
5+
className="flex flex-row-reverse relative w-min"
6+
>
7+
<div
8+
className="w-8"
9+
>
10+
<div
11+
className="group undefined"
12+
>
13+
<div
14+
className="h-8 w-8 rounded-full bg-black cursor-pointer overflow-hidden position relative hover:z-10 z-0 hover:border-gray-700 hover:border border border-transparent"
15+
>
16+
<div
17+
data-testid="link"
18+
onClick={[Function]}
19+
onMouseEnter={[Function]}
20+
onTouchStart={[Function]}
21+
>
22+
<img
23+
alt="avatar"
24+
data-nimg="1"
25+
decoding="async"
26+
height={32}
27+
loading="lazy"
28+
onError={[Function]}
29+
onLoad={[Function]}
30+
src="/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F77402538%3Fs%3D200%26v%3D4&w=64&q=75"
31+
srcSet="/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F77402538%3Fs%3D200%26v%3D4&w=32&q=75 1x, /_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F77402538%3Fs%3D200%26v%3D4&w=64&q=75 2x"
32+
style={
33+
{
34+
"color": "transparent",
35+
}
36+
}
37+
width={32}
38+
/>
39+
</div>
40+
</div>
41+
<div
42+
className="justify-center w-full relative hidden z-50 group-hover:block undefined "
43+
>
44+
<div
45+
className="flex flex-col items-center"
46+
>
47+
<div
48+
className="flex mt-0.5 md:mt-1 tooltip-triangle absolute undefined"
49+
/>
50+
<div
51+
className="flex tooltip absolute undefined"
52+
>
53+
<div
54+
className="undefined"
55+
>
56+
OpenQDev
57+
</div>
58+
</div>
59+
</div>
60+
</div>
61+
</div>
62+
</div>
63+
</div>
64+
`;
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`Carousel should match DOM Snapshot 1`] = `
4+
<div
5+
className="relative undefined justify-center self-center w-full flex undefined"
6+
onMouseUp={[Function]}
7+
>
8+
<div
9+
className="flex gap-2 xl:max-w-[100%] xl:w-[980px] undefined overflow-x-auto justify-items-center"
10+
data-testid="carousel"
11+
/>
12+
</div>
13+
`;
Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`Dropdown should match DOM Snapshot 1`] = `
4+
<details
5+
className="h-7 undefined text-sm text-muted cursor-pointer"
6+
onToggle={[Function]}
7+
open={false}
8+
>
9+
<summary
10+
className="inline-flex justify-between undefined rounded-l-sm border-border-default text-primary rounded-l-smleading-2 py-[5px] px-4"
11+
>
12+
pizzas
13+
<svg
14+
className="fill-muted relative top-1"
15+
height="16"
16+
viewBox="0 0 16 16"
17+
width="16"
18+
xmlns="http://www.w3.org/2000/svg"
19+
>
20+
<path
21+
d="M4.427 7.427l3.396 3.396a.25.25 0 00.354 0l3.396-3.396A.25.25 0 0011.396 7H4.604a.25.25 0 00-.177.427z"
22+
/>
23+
</svg>
24+
</summary>
25+
<div
26+
className="w-0"
27+
>
28+
<ul
29+
className="z-20 relative bg-subtle undefined max-h-60 overflow-y-auto mt-2 mb-4 shadow-[rgb(1,_4,_9)_0px_8px_24px_0px] border-web-gray border rounded-sm"
30+
>
31+
<li
32+
className="relative w-full hover:bg-dropdown-hover"
33+
>
34+
<button
35+
className=" text-left p-2 w-full"
36+
onClick={[Function]}
37+
value="foo"
38+
>
39+
<svg
40+
className="inline mr-2 fill-muted"
41+
height="16"
42+
viewBox="0 0 16 16"
43+
width="16"
44+
xmlns="http://www.w3.org/2000/svg"
45+
>
46+
<path
47+
d="M13.78 4.22a.75.75 0 010 1.06l-7.25 7.25a.75.75 0 01-1.06 0L2.22 9.28a.75.75 0 011.06-1.06L6 10.94l6.72-6.72a.75.75 0 011.06 0z"
48+
fillRule="evenodd"
49+
/>
50+
</svg>
51+
foo
52+
</button>
53+
</li>
54+
<li
55+
className="relative w-full hover:bg-dropdown-hover"
56+
>
57+
<button
58+
className=" text-left p-2 w-full"
59+
onClick={[Function]}
60+
value="bar"
61+
>
62+
<div
63+
className="inline-block w-6"
64+
/>
65+
bar
66+
</button>
67+
</li>
68+
69+
</ul>
70+
</div>
71+
</details>
72+
`;
Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`Jazzicon should match DOM Snapshot 1`] = `
4+
<div
5+
className="w-9 h-9 mr-px"
6+
data-testid="link"
7+
>
8+
<div
9+
className="group undefined"
10+
>
11+
<div
12+
className="cursor-pointer"
13+
>
14+
0xf39Fd6e51aad88F6F4ce6aB8827279cffFb92266
15+
</div>
16+
<div
17+
className="justify-center w-full relative hidden z-50 group-hover:block relative bottom-2 "
18+
>
19+
<div
20+
className="flex flex-col items-center"
21+
>
22+
<div
23+
className="flex mt-0.5 md:mt-1 tooltip-triangle absolute undefined"
24+
/>
25+
<div
26+
className="flex tooltip absolute undefined"
27+
>
28+
<div
29+
className="undefined"
30+
>
31+
0xf39Fd6e51aad88F6F4ce6aB8827279cffFb92266
32+
</div>
33+
</div>
34+
</div>
35+
</div>
36+
</div>
37+
</div>
38+
`;

0 commit comments

Comments
 (0)