Skip to content

Commit 16b8e1c

Browse files
danielbariondanielbarion
committed
test: update tests to match this PR and add new tests to attributes
1 parent e8aa9cf commit 16b8e1c

File tree

2 files changed

+167
-107
lines changed

2 files changed

+167
-107
lines changed

‎src/test/__snapshots__/index.spec.js.snap

Lines changed: 88 additions & 106 deletions
Original file line numberDiff line numberDiff line change
@@ -1,123 +1,105 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

3+
exports[`tooltip attributes basic tooltip component 1`] = `
4+
<span
5+
data-tooltip-content="Hello World!"
6+
id="basic-example-attr"
7+
>
8+
Lorem Ipsum
9+
</span>
10+
`;
11+
12+
exports[`tooltip attributes tooltip component - delayHide 1`] = `
13+
<span
14+
data-tooltip-content="Hello World!"
15+
data-tooltip-delay-hide={1000}
16+
id="basic-example-delay-hide-attr"
17+
>
18+
Lorem Ipsum
19+
</span>
20+
`;
21+
22+
exports[`tooltip attributes tooltip component - delayShow 1`] = `
23+
<span
24+
data-tooltip-content="Hello World!"
25+
data-tooltip-delay-show={1000}
26+
id="basic-example-delay-show-attr"
27+
>
28+
Lorem Ipsum
29+
</span>
30+
`;
31+
32+
exports[`tooltip attributes tooltip component - html 1`] = `
33+
<span
34+
data-tooltip-html="Hello World!"
35+
data-tooltip-place="top"
36+
data-tooltip-variant="info"
37+
id="basic-example-html-attr"
38+
>
39+
Lorem Ipsum
40+
</span>
41+
`;
42+
43+
exports[`tooltip attributes tooltip component - without anchorId 1`] = `
44+
<span
45+
data-tooltip-content="Hello World!"
46+
>
47+
Lorem Ipsum
48+
</span>
49+
`;
50+
351
exports[`tooltip props basic tooltip component 1`] = `
4-
[
5-
<span
6-
id="basic-example"
7-
>
8-
Lorem Ipsum
9-
</span>,
10-
<div
11-
className="react-tooltip"
12-
role="tooltip"
13-
style={{}}
14-
>
15-
Hello World!
16-
<div
17-
className="react-tooltip-arrow"
18-
style={{}}
19-
/>
20-
</div>,
21-
]
52+
<span
53+
id="basic-example"
54+
>
55+
Lorem Ipsum
56+
</span>
57+
`;
58+
59+
exports[`tooltip props tooltip component - delayHide 1`] = `
60+
<span
61+
id="basic-example-delay-hide"
62+
>
63+
Lorem Ipsum
64+
</span>
65+
`;
66+
67+
exports[`tooltip props tooltip component - delayShow 1`] = `
68+
<span
69+
id="basic-example-delay-show"
70+
>
71+
Lorem Ipsum
72+
</span>
2273
`;
2374

2475
exports[`tooltip props tooltip component - getContent 1`] = `
25-
[
26-
<span
27-
id="basic-example-get-content"
28-
>
29-
Lorem Ipsum
30-
</span>,
31-
<div
32-
className="react-tooltip"
33-
role="tooltip"
34-
style={{}}
35-
>
36-
Hello World!
37-
<div
38-
className="react-tooltip-arrow"
39-
style={{}}
40-
/>
41-
</div>,
42-
]
76+
<span
77+
id="basic-example-get-content"
78+
>
79+
Lorem Ipsum
80+
</span>
4381
`;
4482

4583
exports[`tooltip props tooltip component - html 1`] = `
46-
[
47-
<span
48-
id="basic-example-html"
49-
>
50-
Lorem Ipsum
51-
</span>,
52-
<div
53-
className="react-tooltip"
54-
role="tooltip"
55-
style={{}}
56-
>
57-
<span
58-
dangerouslySetInnerHTML={
59-
{
60-
"__html": "Hello World!",
61-
}
62-
}
63-
/>
64-
<div
65-
className="react-tooltip-arrow"
66-
style={{}}
67-
/>
68-
</div>,
69-
]
84+
<span
85+
id="basic-example-html"
86+
>
87+
Lorem Ipsum
88+
</span>
7089
`;
7190

7291
exports[`tooltip props tooltip component - position props 1`] = `
73-
[
74-
<span
75-
id="position-props"
76-
>
77-
Lorem Ipsum
78-
</span>,
79-
<div
80-
className="react-tooltip"
81-
role="tooltip"
82-
style={{}}
83-
>
84-
Hello World!
85-
<div
86-
className="react-tooltip-arrow"
87-
style={{}}
88-
/>
89-
</div>,
90-
]
92+
<span
93+
id="position-props"
94+
>
95+
Lorem Ipsum
96+
</span>
9197
`;
9298

9399
exports[`tooltip props tooltip component - without anchorId 1`] = `
94-
[
95-
<span>
96-
Lorem Ipsum
97-
</span>,
98-
<div
99-
className="react-tooltip"
100-
role="tooltip"
101-
style={{}}
102-
>
103-
Hello World!
104-
<div
105-
className="react-tooltip-arrow"
106-
style={{}}
107-
/>
108-
</div>,
109-
]
100+
<span>
101+
Lorem Ipsum
102+
</span>
110103
`;
111104

112-
exports[`tooltip props tooltip component - without element reference 1`] = `
113-
<div
114-
className="react-tooltip"
115-
role="tooltip"
116-
style={{}}
117-
>
118-
<div
119-
className="react-tooltip-arrow"
120-
style={{}}
121-
/>
122-
</div>
123-
`;
105+
exports[`tooltip props tooltip component - without element reference 1`] = `null`;

‎src/test/index.spec.js

Lines changed: 79 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,15 @@ const TooltipProps = ({ id, ...tooltipParams }) => (
1313
<Tooltip anchorId={id} {...tooltipParams} />
1414
</>
1515
)
16+
// eslint-disable-next-line react/prop-types
17+
const TooltipAttrs = ({ id, ...anchorParams }) => (
18+
<>
19+
<span id={id} {...anchorParams}>
20+
Lorem Ipsum
21+
</span>
22+
<Tooltip anchorId={id} />
23+
</>
24+
)
1625

1726
describe('tooltip props', () => {
1827
test('tooltip component - without anchorId', () => {
@@ -55,6 +64,22 @@ describe('tooltip props', () => {
5564
expect(tree).toMatchSnapshot()
5665
})
5766

67+
test('tooltip component - delayShow', () => {
68+
const component = renderer.create(
69+
<TooltipProps id="basic-example-delay-show" content="Hello World!" delayShow={1000} />,
70+
)
71+
const tree = component.toJSON()
72+
expect(tree).toMatchSnapshot()
73+
})
74+
75+
test('tooltip component - delayHide', () => {
76+
const component = renderer.create(
77+
<TooltipProps id="basic-example-delay-hide" content="Hello World!" delayHide={1000} />,
78+
)
79+
const tree = component.toJSON()
80+
expect(tree).toMatchSnapshot()
81+
})
82+
5883
test('tooltip component - position props', () => {
5984
const component = renderer.create(
6085
<TooltipProps id="position-props" content="Hello World!" position={{ x: 0, y: 0 }} />,
@@ -64,6 +89,59 @@ describe('tooltip props', () => {
6489
})
6590
})
6691

92+
describe('tooltip attributes', () => {
93+
test('tooltip component - without anchorId', () => {
94+
const component = renderer.create(<TooltipAttrs data-tooltip-content="Hello World!" />)
95+
const tree = component.toJSON()
96+
expect(tree).toMatchSnapshot()
97+
})
98+
99+
test('basic tooltip component', () => {
100+
const component = renderer.create(
101+
<TooltipAttrs id="basic-example-attr" data-tooltip-content="Hello World!" />,
102+
)
103+
const tree = component.toJSON()
104+
expect(tree).toMatchSnapshot()
105+
})
106+
107+
test('tooltip component - html', () => {
108+
const component = renderer.create(
109+
<TooltipAttrs
110+
id="basic-example-html-attr"
111+
data-tooltip-html="Hello World!"
112+
data-tooltip-variant="info"
113+
data-tooltip-place="top"
114+
/>,
115+
)
116+
const tree = component.toJSON()
117+
expect(tree).toMatchSnapshot()
118+
})
119+
120+
test('tooltip component - delayShow', () => {
121+
const component = renderer.create(
122+
<TooltipAttrs
123+
id="basic-example-delay-show-attr"
124+
data-tooltip-content="Hello World!"
125+
data-tooltip-delay-show={1000}
126+
/>,
127+
)
128+
const tree = component.toJSON()
129+
expect(tree).toMatchSnapshot()
130+
})
131+
132+
test('tooltip component - delayHide', () => {
133+
const component = renderer.create(
134+
<TooltipAttrs
135+
id="basic-example-delay-hide-attr"
136+
data-tooltip-content="Hello World!"
137+
data-tooltip-delay-hide={1000}
138+
/>,
139+
)
140+
const tree = component.toJSON()
141+
expect(tree).toMatchSnapshot()
142+
})
143+
})
144+
67145
describe('compute positions', () => {
68146
test('empty reference elements', async () => {
69147
const value = await computeTooltipPosition({
@@ -122,7 +200,7 @@ describe('compute positions', () => {
122200
top: '',
123201
},
124202
tooltipStyles: {
125-
left: '-5px',
203+
left: '5px',
126204
top: '-10px',
127205
},
128206
})

0 commit comments

Comments
 (0)