@zohodesk/dot 1.0.0-temp-193.8 → 1.0.0-temp-193.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/MessageBanner/__tests__/MessageBanner.spec.js +52 -2
- package/es/MessageBanner/__tests__/__snapshots__/MessageBanner.spec.js.snap +320 -1
- package/es/NewStar/__tests__/NewStar.spec.js +27 -1
- package/es/NewStar/__tests__/__snapshots__/NewStar.spec.js.snap +289 -1
- package/es/Separator/__tests__/Separator.spec.js +74 -2
- package/es/Separator/__tests__/__snapshots__/Separator.spec.js.snap +1095 -3
- package/es/Separator/props/defaultProps.js +0 -1
- package/es/Separator/props/propTypes.js +2 -2
- package/es/v1/DotProvider/DotProvider.js +12 -3
- package/lib/MessageBanner/__tests__/MessageBanner.spec.js +52 -2
- package/lib/MessageBanner/__tests__/__snapshots__/MessageBanner.spec.js.snap +320 -1
- package/lib/NewStar/__tests__/NewStar.spec.js +27 -1
- package/lib/NewStar/__tests__/__snapshots__/NewStar.spec.js.snap +289 -1
- package/lib/Separator/__tests__/Separator.spec.js +74 -2
- package/lib/Separator/__tests__/__snapshots__/Separator.spec.js.snap +1095 -3
- package/lib/Separator/props/defaultProps.js +0 -1
- package/lib/Separator/props/propTypes.js +2 -2
- package/lib/v1/DotProvider/DotProvider.js +12 -3
- package/package.json +5 -5
- package/result.json +1 -1
- package/unittest/index.html +1 -1
|
@@ -2,10 +2,60 @@ import React from 'react';
|
|
|
2
2
|
import { render } from '@testing-library/react';
|
|
3
3
|
import MessageBanner from "../MessageBanner";
|
|
4
4
|
describe('MessageBanner', () => {
|
|
5
|
-
|
|
5
|
+
const PALETTE = ['default', 'blue', 'white'];
|
|
6
|
+
const TYPE = ['primary', 'secondary'];
|
|
7
|
+
const mockOnClose = jest.fn();
|
|
8
|
+
test('rendering the default props', () => {
|
|
6
9
|
const {
|
|
7
10
|
asFragment
|
|
8
|
-
} = render( /*#__PURE__*/React.createElement(MessageBanner,
|
|
11
|
+
} = render( /*#__PURE__*/React.createElement(MessageBanner, {
|
|
12
|
+
message: "This is a Message"
|
|
13
|
+
}));
|
|
14
|
+
expect(asFragment()).toMatchSnapshot();
|
|
15
|
+
});
|
|
16
|
+
test('rendering the href props along with urlText props', () => {
|
|
17
|
+
const {
|
|
18
|
+
asFragment
|
|
19
|
+
} = render( /*#__PURE__*/React.createElement(MessageBanner, {
|
|
20
|
+
href: "https://www.zoho.com/",
|
|
21
|
+
urlText: "This is a HREF Message"
|
|
22
|
+
}));
|
|
23
|
+
expect(asFragment()).toMatchSnapshot();
|
|
24
|
+
});
|
|
25
|
+
test.each(PALETTE)('rendering the palette of - %s', palette => {
|
|
26
|
+
const {
|
|
27
|
+
asFragment
|
|
28
|
+
} = render( /*#__PURE__*/React.createElement(MessageBanner, {
|
|
29
|
+
message: "This is a Message",
|
|
30
|
+
palette: palette
|
|
31
|
+
}));
|
|
32
|
+
expect(asFragment()).toMatchSnapshot();
|
|
33
|
+
});
|
|
34
|
+
test.each(TYPE)('rendering the type of - %s', type => {
|
|
35
|
+
const {
|
|
36
|
+
asFragment
|
|
37
|
+
} = render( /*#__PURE__*/React.createElement(MessageBanner, {
|
|
38
|
+
message: "This is a Message",
|
|
39
|
+
type: type
|
|
40
|
+
}));
|
|
41
|
+
expect(asFragment()).toMatchSnapshot();
|
|
42
|
+
});
|
|
43
|
+
test('rendering the customClass props', () => {
|
|
44
|
+
const {
|
|
45
|
+
asFragment
|
|
46
|
+
} = render( /*#__PURE__*/React.createElement(MessageBanner, {
|
|
47
|
+
message: "This is a Message",
|
|
48
|
+
customClass: "customMessage"
|
|
49
|
+
}));
|
|
50
|
+
expect(asFragment()).toMatchSnapshot();
|
|
51
|
+
});
|
|
52
|
+
test('rendering the onClose props via mock function', () => {
|
|
53
|
+
const {
|
|
54
|
+
asFragment
|
|
55
|
+
} = render( /*#__PURE__*/React.createElement(MessageBanner, {
|
|
56
|
+
message: "This is a Message",
|
|
57
|
+
onClose: mockOnClose
|
|
58
|
+
}));
|
|
9
59
|
expect(asFragment()).toMatchSnapshot();
|
|
10
60
|
});
|
|
11
61
|
});
|
|
@@ -1,6 +1,125 @@
|
|
|
1
1
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
2
2
|
|
|
3
|
-
exports[`MessageBanner rendering the
|
|
3
|
+
exports[`MessageBanner rendering the customClass props 1`] = `
|
|
4
|
+
<DocumentFragment>
|
|
5
|
+
<div
|
|
6
|
+
class="type_primary palette_default customMessage flex rowdir"
|
|
7
|
+
data-id="MessageBanner"
|
|
8
|
+
data-selector-id="messageBanner"
|
|
9
|
+
data-test-id="MessageBanner"
|
|
10
|
+
>
|
|
11
|
+
<div
|
|
12
|
+
class="grow basis shrinkOff"
|
|
13
|
+
data-id="boxComponent"
|
|
14
|
+
data-selector-id="box"
|
|
15
|
+
data-test-id="boxComponent"
|
|
16
|
+
>
|
|
17
|
+
<div
|
|
18
|
+
class="flex cover rowdir both"
|
|
19
|
+
data-id="containerComponent"
|
|
20
|
+
data-selector-id="container"
|
|
21
|
+
data-test-id="containerComponent"
|
|
22
|
+
>
|
|
23
|
+
<div
|
|
24
|
+
class="message basisAuto shrinkOn"
|
|
25
|
+
data-id="boxComponent"
|
|
26
|
+
data-selector-id="box"
|
|
27
|
+
data-test-id="boxComponent"
|
|
28
|
+
data-title="This is a Message"
|
|
29
|
+
>
|
|
30
|
+
This is a Message
|
|
31
|
+
</div>
|
|
32
|
+
</div>
|
|
33
|
+
</div>
|
|
34
|
+
</div>
|
|
35
|
+
</DocumentFragment>
|
|
36
|
+
`;
|
|
37
|
+
|
|
38
|
+
exports[`MessageBanner rendering the default props 1`] = `
|
|
39
|
+
<DocumentFragment>
|
|
40
|
+
<div
|
|
41
|
+
class="type_primary palette_default flex rowdir"
|
|
42
|
+
data-id="MessageBanner"
|
|
43
|
+
data-selector-id="messageBanner"
|
|
44
|
+
data-test-id="MessageBanner"
|
|
45
|
+
>
|
|
46
|
+
<div
|
|
47
|
+
class="grow basis shrinkOff"
|
|
48
|
+
data-id="boxComponent"
|
|
49
|
+
data-selector-id="box"
|
|
50
|
+
data-test-id="boxComponent"
|
|
51
|
+
>
|
|
52
|
+
<div
|
|
53
|
+
class="flex cover rowdir both"
|
|
54
|
+
data-id="containerComponent"
|
|
55
|
+
data-selector-id="container"
|
|
56
|
+
data-test-id="containerComponent"
|
|
57
|
+
>
|
|
58
|
+
<div
|
|
59
|
+
class="message basisAuto shrinkOn"
|
|
60
|
+
data-id="boxComponent"
|
|
61
|
+
data-selector-id="box"
|
|
62
|
+
data-test-id="boxComponent"
|
|
63
|
+
data-title="This is a Message"
|
|
64
|
+
>
|
|
65
|
+
This is a Message
|
|
66
|
+
</div>
|
|
67
|
+
</div>
|
|
68
|
+
</div>
|
|
69
|
+
</div>
|
|
70
|
+
</DocumentFragment>
|
|
71
|
+
`;
|
|
72
|
+
|
|
73
|
+
exports[`MessageBanner rendering the href props along with urlText props 1`] = `
|
|
74
|
+
<DocumentFragment>
|
|
75
|
+
<div
|
|
76
|
+
class="type_primary palette_default flex rowdir"
|
|
77
|
+
data-id="MessageBanner"
|
|
78
|
+
data-selector-id="messageBanner"
|
|
79
|
+
data-test-id="MessageBanner"
|
|
80
|
+
>
|
|
81
|
+
<div
|
|
82
|
+
class="grow basis shrinkOff"
|
|
83
|
+
data-id="boxComponent"
|
|
84
|
+
data-selector-id="box"
|
|
85
|
+
data-test-id="boxComponent"
|
|
86
|
+
>
|
|
87
|
+
<div
|
|
88
|
+
class="flex cover rowdir both"
|
|
89
|
+
data-id="containerComponent"
|
|
90
|
+
data-selector-id="container"
|
|
91
|
+
data-test-id="containerComponent"
|
|
92
|
+
>
|
|
93
|
+
<div
|
|
94
|
+
class="message basisAuto shrinkOn"
|
|
95
|
+
data-id="boxComponent"
|
|
96
|
+
data-selector-id="box"
|
|
97
|
+
data-test-id="boxComponent"
|
|
98
|
+
/>
|
|
99
|
+
<div
|
|
100
|
+
class="shrinkOff"
|
|
101
|
+
data-id="boxComponent"
|
|
102
|
+
data-selector-id="box"
|
|
103
|
+
data-test-id="boxComponent"
|
|
104
|
+
>
|
|
105
|
+
<a
|
|
106
|
+
class="container link"
|
|
107
|
+
data-id="MessageBanner_link"
|
|
108
|
+
data-test-id="MessageBanner_link"
|
|
109
|
+
href="https://www.zoho.com/"
|
|
110
|
+
rel="noopener noreferrer"
|
|
111
|
+
target="_blank"
|
|
112
|
+
>
|
|
113
|
+
This is a HREF Message
|
|
114
|
+
</a>
|
|
115
|
+
</div>
|
|
116
|
+
</div>
|
|
117
|
+
</div>
|
|
118
|
+
</div>
|
|
119
|
+
</DocumentFragment>
|
|
120
|
+
`;
|
|
121
|
+
|
|
122
|
+
exports[`MessageBanner rendering the onClose props via mock function 1`] = `
|
|
4
123
|
<DocumentFragment>
|
|
5
124
|
<div
|
|
6
125
|
class="type_primary palette_default flex rowdir"
|
|
@@ -25,9 +144,209 @@ exports[`MessageBanner rendering the defult props 1`] = `
|
|
|
25
144
|
data-id="boxComponent"
|
|
26
145
|
data-selector-id="box"
|
|
27
146
|
data-test-id="boxComponent"
|
|
147
|
+
data-title="This is a Message"
|
|
148
|
+
>
|
|
149
|
+
This is a Message
|
|
150
|
+
</div>
|
|
151
|
+
</div>
|
|
152
|
+
</div>
|
|
153
|
+
<div
|
|
154
|
+
class="close shrinkOff"
|
|
155
|
+
data-id="MessageBanner_close"
|
|
156
|
+
data-selector-id="box"
|
|
157
|
+
data-test-id="MessageBanner_close"
|
|
158
|
+
>
|
|
159
|
+
<div
|
|
160
|
+
class="flex cover coldir both"
|
|
161
|
+
data-id="containerComponent"
|
|
162
|
+
data-selector-id="container"
|
|
163
|
+
data-test-id="containerComponent"
|
|
164
|
+
>
|
|
165
|
+
<i
|
|
166
|
+
aria-hidden="true"
|
|
167
|
+
class="zd_font_icons basic icon-close-e "
|
|
168
|
+
data-id="fontIcon"
|
|
169
|
+
data-selector-id="fontIcon"
|
|
170
|
+
data-test-id="fontIcon"
|
|
171
|
+
style="--zd-iconfont-size: var(--zd_font_size35);"
|
|
28
172
|
/>
|
|
29
173
|
</div>
|
|
30
174
|
</div>
|
|
31
175
|
</div>
|
|
32
176
|
</DocumentFragment>
|
|
33
177
|
`;
|
|
178
|
+
|
|
179
|
+
exports[`MessageBanner rendering the palette of - blue 1`] = `
|
|
180
|
+
<DocumentFragment>
|
|
181
|
+
<div
|
|
182
|
+
class="type_primary palette_blue flex rowdir"
|
|
183
|
+
data-id="MessageBanner"
|
|
184
|
+
data-selector-id="messageBanner"
|
|
185
|
+
data-test-id="MessageBanner"
|
|
186
|
+
>
|
|
187
|
+
<div
|
|
188
|
+
class="grow basis shrinkOff"
|
|
189
|
+
data-id="boxComponent"
|
|
190
|
+
data-selector-id="box"
|
|
191
|
+
data-test-id="boxComponent"
|
|
192
|
+
>
|
|
193
|
+
<div
|
|
194
|
+
class="flex cover rowdir both"
|
|
195
|
+
data-id="containerComponent"
|
|
196
|
+
data-selector-id="container"
|
|
197
|
+
data-test-id="containerComponent"
|
|
198
|
+
>
|
|
199
|
+
<div
|
|
200
|
+
class="message basisAuto shrinkOn"
|
|
201
|
+
data-id="boxComponent"
|
|
202
|
+
data-selector-id="box"
|
|
203
|
+
data-test-id="boxComponent"
|
|
204
|
+
data-title="This is a Message"
|
|
205
|
+
>
|
|
206
|
+
This is a Message
|
|
207
|
+
</div>
|
|
208
|
+
</div>
|
|
209
|
+
</div>
|
|
210
|
+
</div>
|
|
211
|
+
</DocumentFragment>
|
|
212
|
+
`;
|
|
213
|
+
|
|
214
|
+
exports[`MessageBanner rendering the palette of - default 1`] = `
|
|
215
|
+
<DocumentFragment>
|
|
216
|
+
<div
|
|
217
|
+
class="type_primary palette_default flex rowdir"
|
|
218
|
+
data-id="MessageBanner"
|
|
219
|
+
data-selector-id="messageBanner"
|
|
220
|
+
data-test-id="MessageBanner"
|
|
221
|
+
>
|
|
222
|
+
<div
|
|
223
|
+
class="grow basis shrinkOff"
|
|
224
|
+
data-id="boxComponent"
|
|
225
|
+
data-selector-id="box"
|
|
226
|
+
data-test-id="boxComponent"
|
|
227
|
+
>
|
|
228
|
+
<div
|
|
229
|
+
class="flex cover rowdir both"
|
|
230
|
+
data-id="containerComponent"
|
|
231
|
+
data-selector-id="container"
|
|
232
|
+
data-test-id="containerComponent"
|
|
233
|
+
>
|
|
234
|
+
<div
|
|
235
|
+
class="message basisAuto shrinkOn"
|
|
236
|
+
data-id="boxComponent"
|
|
237
|
+
data-selector-id="box"
|
|
238
|
+
data-test-id="boxComponent"
|
|
239
|
+
data-title="This is a Message"
|
|
240
|
+
>
|
|
241
|
+
This is a Message
|
|
242
|
+
</div>
|
|
243
|
+
</div>
|
|
244
|
+
</div>
|
|
245
|
+
</div>
|
|
246
|
+
</DocumentFragment>
|
|
247
|
+
`;
|
|
248
|
+
|
|
249
|
+
exports[`MessageBanner rendering the palette of - white 1`] = `
|
|
250
|
+
<DocumentFragment>
|
|
251
|
+
<div
|
|
252
|
+
class="type_primary palette_white flex rowdir"
|
|
253
|
+
data-id="MessageBanner"
|
|
254
|
+
data-selector-id="messageBanner"
|
|
255
|
+
data-test-id="MessageBanner"
|
|
256
|
+
>
|
|
257
|
+
<div
|
|
258
|
+
class="grow basis shrinkOff"
|
|
259
|
+
data-id="boxComponent"
|
|
260
|
+
data-selector-id="box"
|
|
261
|
+
data-test-id="boxComponent"
|
|
262
|
+
>
|
|
263
|
+
<div
|
|
264
|
+
class="flex cover rowdir both"
|
|
265
|
+
data-id="containerComponent"
|
|
266
|
+
data-selector-id="container"
|
|
267
|
+
data-test-id="containerComponent"
|
|
268
|
+
>
|
|
269
|
+
<div
|
|
270
|
+
class="message basisAuto shrinkOn"
|
|
271
|
+
data-id="boxComponent"
|
|
272
|
+
data-selector-id="box"
|
|
273
|
+
data-test-id="boxComponent"
|
|
274
|
+
data-title="This is a Message"
|
|
275
|
+
>
|
|
276
|
+
This is a Message
|
|
277
|
+
</div>
|
|
278
|
+
</div>
|
|
279
|
+
</div>
|
|
280
|
+
</div>
|
|
281
|
+
</DocumentFragment>
|
|
282
|
+
`;
|
|
283
|
+
|
|
284
|
+
exports[`MessageBanner rendering the type of - primary 1`] = `
|
|
285
|
+
<DocumentFragment>
|
|
286
|
+
<div
|
|
287
|
+
class="type_primary palette_default flex rowdir"
|
|
288
|
+
data-id="MessageBanner"
|
|
289
|
+
data-selector-id="messageBanner"
|
|
290
|
+
data-test-id="MessageBanner"
|
|
291
|
+
>
|
|
292
|
+
<div
|
|
293
|
+
class="grow basis shrinkOff"
|
|
294
|
+
data-id="boxComponent"
|
|
295
|
+
data-selector-id="box"
|
|
296
|
+
data-test-id="boxComponent"
|
|
297
|
+
>
|
|
298
|
+
<div
|
|
299
|
+
class="flex cover rowdir both"
|
|
300
|
+
data-id="containerComponent"
|
|
301
|
+
data-selector-id="container"
|
|
302
|
+
data-test-id="containerComponent"
|
|
303
|
+
>
|
|
304
|
+
<div
|
|
305
|
+
class="message basisAuto shrinkOn"
|
|
306
|
+
data-id="boxComponent"
|
|
307
|
+
data-selector-id="box"
|
|
308
|
+
data-test-id="boxComponent"
|
|
309
|
+
data-title="This is a Message"
|
|
310
|
+
>
|
|
311
|
+
This is a Message
|
|
312
|
+
</div>
|
|
313
|
+
</div>
|
|
314
|
+
</div>
|
|
315
|
+
</div>
|
|
316
|
+
</DocumentFragment>
|
|
317
|
+
`;
|
|
318
|
+
|
|
319
|
+
exports[`MessageBanner rendering the type of - secondary 1`] = `
|
|
320
|
+
<DocumentFragment>
|
|
321
|
+
<div
|
|
322
|
+
class="type_secondary palette_default flex rowdir"
|
|
323
|
+
data-id="MessageBanner"
|
|
324
|
+
data-selector-id="messageBanner"
|
|
325
|
+
data-test-id="MessageBanner"
|
|
326
|
+
>
|
|
327
|
+
<div
|
|
328
|
+
class="grow basis shrinkOff"
|
|
329
|
+
data-id="boxComponent"
|
|
330
|
+
data-selector-id="box"
|
|
331
|
+
data-test-id="boxComponent"
|
|
332
|
+
>
|
|
333
|
+
<div
|
|
334
|
+
class="flex cover rowdir both"
|
|
335
|
+
data-id="containerComponent"
|
|
336
|
+
data-selector-id="container"
|
|
337
|
+
data-test-id="containerComponent"
|
|
338
|
+
>
|
|
339
|
+
<div
|
|
340
|
+
class="message basisAuto shrinkOn"
|
|
341
|
+
data-id="boxComponent"
|
|
342
|
+
data-selector-id="box"
|
|
343
|
+
data-test-id="boxComponent"
|
|
344
|
+
data-title="This is a Message"
|
|
345
|
+
>
|
|
346
|
+
This is a Message
|
|
347
|
+
</div>
|
|
348
|
+
</div>
|
|
349
|
+
</div>
|
|
350
|
+
</div>
|
|
351
|
+
</DocumentFragment>
|
|
352
|
+
`;
|
|
@@ -2,10 +2,36 @@ import React from 'react';
|
|
|
2
2
|
import { render } from '@testing-library/react';
|
|
3
3
|
import NewStar from "../NewStar";
|
|
4
4
|
describe('NewStar', () => {
|
|
5
|
-
|
|
5
|
+
const PALETTE = ['green', 'blue', 'yellow'];
|
|
6
|
+
const POSITION = ['topRight', 'topLeft', 'bottomRight', 'bottomLeft'];
|
|
7
|
+
test('rendering the default props', () => {
|
|
6
8
|
const {
|
|
7
9
|
asFragment
|
|
8
10
|
} = render( /*#__PURE__*/React.createElement(NewStar, null));
|
|
9
11
|
expect(asFragment()).toMatchSnapshot();
|
|
10
12
|
});
|
|
13
|
+
test.each(PALETTE)('rendering the palette of - %s', palette => {
|
|
14
|
+
const {
|
|
15
|
+
asFragment
|
|
16
|
+
} = render( /*#__PURE__*/React.createElement(NewStar, {
|
|
17
|
+
palette: palette
|
|
18
|
+
}));
|
|
19
|
+
expect(asFragment()).toMatchSnapshot();
|
|
20
|
+
});
|
|
21
|
+
test.each(POSITION)('rendering the position of - %s', position => {
|
|
22
|
+
const {
|
|
23
|
+
asFragment
|
|
24
|
+
} = render( /*#__PURE__*/React.createElement(NewStar, {
|
|
25
|
+
position: position
|
|
26
|
+
}));
|
|
27
|
+
expect(asFragment()).toMatchSnapshot();
|
|
28
|
+
});
|
|
29
|
+
test('rendering the customClass props', () => {
|
|
30
|
+
const {
|
|
31
|
+
asFragment
|
|
32
|
+
} = render( /*#__PURE__*/React.createElement(NewStar, {
|
|
33
|
+
customClass: "customStar"
|
|
34
|
+
}));
|
|
35
|
+
expect(asFragment()).toMatchSnapshot();
|
|
36
|
+
});
|
|
11
37
|
});
|