Skip to content

Commit 50f68e0

Browse files
authored
Add test coverage for EuiBadge. (#185)
1 parent dc65097 commit 50f68e0

File tree

2 files changed

+232
-3
lines changed

2 files changed

+232
-3
lines changed

src/components/badge/__snapshots__/badge.test.js.snap

+183-1
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,189 @@ exports[`EuiBadge is rendered 1`] = `
99
<span
1010
class="euiBadge__content"
1111
>
12-
<span />
12+
<span>
13+
Content
14+
</span>
15+
</span>
16+
</div>
17+
`;
18+
19+
exports[`EuiBadge props color accent is rendered 1`] = `
20+
<div
21+
class="euiBadge euiBadge--accent"
22+
>
23+
<span
24+
class="euiBadge__content"
25+
>
26+
<span>
27+
Content
28+
</span>
29+
</span>
30+
</div>
31+
`;
32+
33+
exports[`EuiBadge props color danger is rendered 1`] = `
34+
<div
35+
class="euiBadge euiBadge--danger"
36+
>
37+
<span
38+
class="euiBadge__content"
39+
>
40+
<span>
41+
Content
42+
</span>
43+
</span>
44+
</div>
45+
`;
46+
47+
exports[`EuiBadge props color default is rendered 1`] = `
48+
<div
49+
class="euiBadge euiBadge--default"
50+
>
51+
<span
52+
class="euiBadge__content"
53+
>
54+
<span>
55+
Content
56+
</span>
57+
</span>
58+
</div>
59+
`;
60+
61+
exports[`EuiBadge props color primary is rendered 1`] = `
62+
<div
63+
class="euiBadge euiBadge--primary"
64+
>
65+
<span
66+
class="euiBadge__content"
67+
>
68+
<span>
69+
Content
70+
</span>
71+
</span>
72+
</div>
73+
`;
74+
75+
exports[`EuiBadge props color secondary is rendered 1`] = `
76+
<div
77+
class="euiBadge euiBadge--secondary"
78+
>
79+
<span
80+
class="euiBadge__content"
81+
>
82+
<span>
83+
Content
84+
</span>
85+
</span>
86+
</div>
87+
`;
88+
89+
exports[`EuiBadge props color warning is rendered 1`] = `
90+
<div
91+
class="euiBadge euiBadge--warning"
92+
>
93+
<span
94+
class="euiBadge__content"
95+
>
96+
<span>
97+
Content
98+
</span>
99+
</span>
100+
</div>
101+
`;
102+
103+
exports[`EuiBadge props iconSide left is rendered 1`] = `
104+
<div
105+
class="euiBadge euiBadge--default"
106+
>
107+
<span
108+
class="euiBadge__content"
109+
>
110+
<svg
111+
class="euiIcon euiBadge__icon euiIcon--medium"
112+
height="18"
113+
viewBox="0 0 18 18"
114+
width="18"
115+
xmlns="http://www.w3.org/2000/svg"
116+
>
117+
<g
118+
fill-rule="evenodd"
119+
>
120+
<path
121+
d="M13.689 11.132c1.155 1.222 1.953 2.879 2.183 4.748a1.007 1.007 0 0 1-1 1.12H3.007a1.005 1.005 0 0 1-1-1.12c.23-1.87 1.028-3.526 2.183-4.748.247.228.505.442.782.633-1.038 1.069-1.765 2.55-1.972 4.237L14.872 16c-.204-1.686-.93-3.166-1.966-4.235a7.01 7.01 0 0 0 .783-.633zM8.939 1c1.9 0 3 2 4.38 2.633a2.483 2.483 0 0 1-1.88.867c-.298 0-.579-.06-.844-.157A3.726 3.726 0 0 1 7.69 5.75c-1.395 0-3.75.25-3.245-1.903C5.94 3 6.952 1 8.94 1z"
122+
/>
123+
<path
124+
d="M8.94 2c2.205 0 4 1.794 4 4s-1.795 4-4 4c-2.207 0-4-1.794-4-4s1.793-4 4-4m0 9A5 5 0 1 0 8.937.999 5 5 0 0 0 8.94 11"
125+
/>
126+
</g>
127+
</svg>
128+
<span>
129+
Content
130+
</span>
131+
</span>
132+
</div>
133+
`;
134+
135+
exports[`EuiBadge props iconSide right is rendered 1`] = `
136+
<div
137+
class="euiBadge euiBadge--default euiBadge--iconRight"
138+
>
139+
<span
140+
class="euiBadge__content"
141+
>
142+
<svg
143+
class="euiIcon euiBadge__icon euiIcon--medium"
144+
height="18"
145+
viewBox="0 0 18 18"
146+
width="18"
147+
xmlns="http://www.w3.org/2000/svg"
148+
>
149+
<g
150+
fill-rule="evenodd"
151+
>
152+
<path
153+
d="M13.689 11.132c1.155 1.222 1.953 2.879 2.183 4.748a1.007 1.007 0 0 1-1 1.12H3.007a1.005 1.005 0 0 1-1-1.12c.23-1.87 1.028-3.526 2.183-4.748.247.228.505.442.782.633-1.038 1.069-1.765 2.55-1.972 4.237L14.872 16c-.204-1.686-.93-3.166-1.966-4.235a7.01 7.01 0 0 0 .783-.633zM8.939 1c1.9 0 3 2 4.38 2.633a2.483 2.483 0 0 1-1.88.867c-.298 0-.579-.06-.844-.157A3.726 3.726 0 0 1 7.69 5.75c-1.395 0-3.75.25-3.245-1.903C5.94 3 6.952 1 8.94 1z"
154+
/>
155+
<path
156+
d="M8.94 2c2.205 0 4 1.794 4 4s-1.795 4-4 4c-2.207 0-4-1.794-4-4s1.793-4 4-4m0 9A5 5 0 1 0 8.937.999 5 5 0 0 0 8.94 11"
157+
/>
158+
</g>
159+
</svg>
160+
<span>
161+
Content
162+
</span>
163+
</span>
164+
</div>
165+
`;
166+
167+
exports[`EuiBadge props iconType is rendered 1`] = `
168+
<div
169+
class="euiBadge euiBadge--default"
170+
>
171+
<span
172+
class="euiBadge__content"
173+
>
174+
<svg
175+
class="euiIcon euiBadge__icon euiIcon--medium"
176+
height="18"
177+
viewBox="0 0 18 18"
178+
width="18"
179+
xmlns="http://www.w3.org/2000/svg"
180+
>
181+
<g
182+
fill-rule="evenodd"
183+
>
184+
<path
185+
d="M13.689 11.132c1.155 1.222 1.953 2.879 2.183 4.748a1.007 1.007 0 0 1-1 1.12H3.007a1.005 1.005 0 0 1-1-1.12c.23-1.87 1.028-3.526 2.183-4.748.247.228.505.442.782.633-1.038 1.069-1.765 2.55-1.972 4.237L14.872 16c-.204-1.686-.93-3.166-1.966-4.235a7.01 7.01 0 0 0 .783-.633zM8.939 1c1.9 0 3 2 4.38 2.633a2.483 2.483 0 0 1-1.88.867c-.298 0-.579-.06-.844-.157A3.726 3.726 0 0 1 7.69 5.75c-1.395 0-3.75.25-3.245-1.903C5.94 3 6.952 1 8.94 1z"
186+
/>
187+
<path
188+
d="M8.94 2c2.205 0 4 1.794 4 4s-1.795 4-4 4c-2.207 0-4-1.794-4-4s1.793-4 4-4m0 9A5 5 0 1 0 8.937.999 5 5 0 0 0 8.94 11"
189+
/>
190+
</g>
191+
</svg>
192+
<span>
193+
Content
194+
</span>
13195
</span>
14196
</div>
15197
`;

src/components/badge/badge.test.js

+49-2
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,62 @@ import React from 'react';
22
import { render } from 'enzyme';
33
import { requiredProps } from '../../test/required_props';
44

5-
import { EuiBadge } from './badge';
5+
import { EuiBadge, COLORS, ICON_SIDES } from './badge';
66

77
describe('EuiBadge', () => {
88
test('is rendered', () => {
99
const component = render(
10-
<EuiBadge {...requiredProps} />
10+
<EuiBadge {...requiredProps}>
11+
Content
12+
</EuiBadge>
1113
);
1214

1315
expect(component)
1416
.toMatchSnapshot();
1517
});
18+
19+
describe('props', () => {
20+
describe('iconType', () => {
21+
it('is rendered', () => {
22+
const component = render(
23+
<EuiBadge iconType="user">
24+
Content
25+
</EuiBadge>
26+
);
27+
28+
expect(component)
29+
.toMatchSnapshot();
30+
});
31+
});
32+
33+
describe('color', () => {
34+
COLORS.forEach(color => {
35+
it(`${color} is rendered`, () => {
36+
const component = render(
37+
<EuiBadge color={color}>
38+
Content
39+
</EuiBadge>
40+
);
41+
42+
expect(component)
43+
.toMatchSnapshot();
44+
});
45+
});
46+
});
47+
48+
describe('iconSide', () => {
49+
ICON_SIDES.forEach(iconSide => {
50+
it(`${iconSide} is rendered`, () => {
51+
const component = render(
52+
<EuiBadge iconType="user" iconSide={iconSide}>
53+
Content
54+
</EuiBadge>
55+
);
56+
57+
expect(component)
58+
.toMatchSnapshot();
59+
});
60+
});
61+
});
62+
});
1663
});

0 commit comments

Comments
 (0)