@capillarytech/creatives-library 8.0.264 → 8.0.265

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.
Files changed (158) hide show
  1. package/constants/unified.js +0 -1
  2. package/package.json +1 -1
  3. package/services/api.js +0 -5
  4. package/utils/common.js +0 -6
  5. package/utils/tagValidations.js +1 -2
  6. package/utils/tests/transformerUtils.test.js +0 -297
  7. package/utils/transformerUtils.js +0 -40
  8. package/v2Components/CapImageUpload/constants.js +0 -2
  9. package/v2Components/CapImageUpload/index.js +16 -65
  10. package/v2Components/CapImageUpload/index.scss +1 -4
  11. package/v2Components/CapImageUpload/messages.js +1 -5
  12. package/v2Components/CommonTestAndPreview/UnifiedPreview/_unifiedPreview.scss +2 -2
  13. package/v2Components/FormBuilder/index.js +8 -8
  14. package/v2Containers/App/constants.js +0 -5
  15. package/v2Containers/CreativesContainer/SlideBoxContent.js +2 -57
  16. package/v2Containers/CreativesContainer/SlideBoxHeader.js +0 -1
  17. package/v2Containers/CreativesContainer/constants.js +0 -3
  18. package/v2Containers/CreativesContainer/index.js +0 -168
  19. package/v2Containers/CreativesContainer/messages.js +0 -4
  20. package/v2Containers/CreativesContainer/tests/SlideBoxContent.test.js +0 -210
  21. package/v2Containers/CreativesContainer/tests/__snapshots__/SlideBoxContent.test.js.snap +0 -304
  22. package/v2Containers/Email/index.js +7 -3
  23. package/v2Containers/FTP/index.js +1 -1
  24. package/v2Containers/InApp/index.js +0 -1
  25. package/v2Containers/Line/Container/Text/index.js +0 -1
  26. package/v2Containers/MobilePushNew/index.js +0 -1
  27. package/v2Containers/Rcs/index.js +0 -3
  28. package/v2Containers/SmsTrai/Edit/index.js +0 -1
  29. package/v2Containers/Templates/ChannelTypeIllustration.js +1 -13
  30. package/v2Containers/Templates/_templates.scss +0 -205
  31. package/v2Containers/Templates/actions.js +1 -2
  32. package/v2Containers/Templates/constants.js +0 -1
  33. package/v2Containers/Templates/index.js +34 -274
  34. package/v2Containers/Templates/messages.js +0 -24
  35. package/v2Containers/Templates/reducer.js +0 -2
  36. package/v2Containers/Templates/tests/index.test.js +0 -10
  37. package/v2Containers/TemplatesV2/index.js +7 -15
  38. package/v2Containers/TemplatesV2/messages.js +0 -4
  39. package/v2Containers/Viber/index.js +0 -1
  40. package/v2Containers/Whatsapp/index.js +0 -1
  41. package/v2Containers/Zalo/index.js +0 -1
  42. package/v2Containers/Zalo/tests/index.test.js +5 -1
  43. package/utils/imageUrlUpload.js +0 -141
  44. package/v2Components/CapImageUrlUpload/constants.js +0 -26
  45. package/v2Components/CapImageUrlUpload/index.js +0 -365
  46. package/v2Components/CapImageUrlUpload/index.scss +0 -35
  47. package/v2Components/CapImageUrlUpload/messages.js +0 -47
  48. package/v2Containers/WebPush/Create/components/BrandIconSection.js +0 -108
  49. package/v2Containers/WebPush/Create/components/ButtonForm.js +0 -172
  50. package/v2Containers/WebPush/Create/components/ButtonItem.js +0 -101
  51. package/v2Containers/WebPush/Create/components/ButtonList.js +0 -145
  52. package/v2Containers/WebPush/Create/components/ButtonsLinksSection.js +0 -164
  53. package/v2Containers/WebPush/Create/components/ButtonsLinksSection.test.js +0 -463
  54. package/v2Containers/WebPush/Create/components/FormActions.js +0 -54
  55. package/v2Containers/WebPush/Create/components/FormActions.test.js +0 -163
  56. package/v2Containers/WebPush/Create/components/MediaSection.js +0 -142
  57. package/v2Containers/WebPush/Create/components/MediaSection.test.js +0 -341
  58. package/v2Containers/WebPush/Create/components/MessageSection.js +0 -103
  59. package/v2Containers/WebPush/Create/components/MessageSection.test.js +0 -268
  60. package/v2Containers/WebPush/Create/components/NotificationTitleSection.js +0 -87
  61. package/v2Containers/WebPush/Create/components/NotificationTitleSection.test.js +0 -210
  62. package/v2Containers/WebPush/Create/components/TemplateNameSection.js +0 -54
  63. package/v2Containers/WebPush/Create/components/TemplateNameSection.test.js +0 -143
  64. package/v2Containers/WebPush/Create/components/__snapshots__/ButtonsLinksSection.test.js.snap +0 -86
  65. package/v2Containers/WebPush/Create/components/__snapshots__/FormActions.test.js.snap +0 -16
  66. package/v2Containers/WebPush/Create/components/__snapshots__/MediaSection.test.js.snap +0 -41
  67. package/v2Containers/WebPush/Create/components/__snapshots__/MessageSection.test.js.snap +0 -54
  68. package/v2Containers/WebPush/Create/components/__snapshots__/NotificationTitleSection.test.js.snap +0 -37
  69. package/v2Containers/WebPush/Create/components/__snapshots__/TemplateNameSection.test.js.snap +0 -21
  70. package/v2Containers/WebPush/Create/components/_buttons.scss +0 -246
  71. package/v2Containers/WebPush/Create/components/tests/ButtonForm.test.js +0 -554
  72. package/v2Containers/WebPush/Create/components/tests/ButtonItem.test.js +0 -607
  73. package/v2Containers/WebPush/Create/components/tests/ButtonList.test.js +0 -633
  74. package/v2Containers/WebPush/Create/components/tests/__snapshots__/ButtonForm.test.js.snap +0 -666
  75. package/v2Containers/WebPush/Create/components/tests/__snapshots__/ButtonItem.test.js.snap +0 -74
  76. package/v2Containers/WebPush/Create/components/tests/__snapshots__/ButtonList.test.js.snap +0 -78
  77. package/v2Containers/WebPush/Create/hooks/useButtonManagement.js +0 -138
  78. package/v2Containers/WebPush/Create/hooks/useButtonManagement.test.js +0 -406
  79. package/v2Containers/WebPush/Create/hooks/useCharacterCount.js +0 -30
  80. package/v2Containers/WebPush/Create/hooks/useCharacterCount.test.js +0 -151
  81. package/v2Containers/WebPush/Create/hooks/useImageUpload.js +0 -104
  82. package/v2Containers/WebPush/Create/hooks/useImageUpload.test.js +0 -538
  83. package/v2Containers/WebPush/Create/hooks/useTagManagement.js +0 -122
  84. package/v2Containers/WebPush/Create/hooks/useTagManagement.test.js +0 -633
  85. package/v2Containers/WebPush/Create/index.js +0 -1148
  86. package/v2Containers/WebPush/Create/index.scss +0 -134
  87. package/v2Containers/WebPush/Create/messages.js +0 -211
  88. package/v2Containers/WebPush/Create/preview/DevicePreviewContent.js +0 -228
  89. package/v2Containers/WebPush/Create/preview/NotificationContainer.js +0 -294
  90. package/v2Containers/WebPush/Create/preview/PreviewContent.js +0 -90
  91. package/v2Containers/WebPush/Create/preview/PreviewControls.js +0 -305
  92. package/v2Containers/WebPush/Create/preview/PreviewDisclaimer.js +0 -25
  93. package/v2Containers/WebPush/Create/preview/WebPushPreview.js +0 -155
  94. package/v2Containers/WebPush/Create/preview/assets/Light.svg +0 -53
  95. package/v2Containers/WebPush/Create/preview/assets/Top.svg +0 -5
  96. package/v2Containers/WebPush/Create/preview/assets/android-arrow-down.svg +0 -9
  97. package/v2Containers/WebPush/Create/preview/assets/android-arrow-up.svg +0 -9
  98. package/v2Containers/WebPush/Create/preview/assets/chrome-icon.png +0 -0
  99. package/v2Containers/WebPush/Create/preview/assets/edge-icon.png +0 -0
  100. package/v2Containers/WebPush/Create/preview/assets/firefox-icon.svg +0 -106
  101. package/v2Containers/WebPush/Create/preview/assets/iOS.svg +0 -26
  102. package/v2Containers/WebPush/Create/preview/assets/macos-arrow-down-icon.svg +0 -9
  103. package/v2Containers/WebPush/Create/preview/assets/macos-triple-dot-icon.svg +0 -9
  104. package/v2Containers/WebPush/Create/preview/assets/opera-icon.svg +0 -18
  105. package/v2Containers/WebPush/Create/preview/assets/safari-icon.svg +0 -29
  106. package/v2Containers/WebPush/Create/preview/assets/windows-close-icon.svg +0 -9
  107. package/v2Containers/WebPush/Create/preview/assets/windows-triple-dot-icon.svg +0 -9
  108. package/v2Containers/WebPush/Create/preview/components/AndroidMobileChromeHeader.js +0 -51
  109. package/v2Containers/WebPush/Create/preview/components/AndroidMobileExpanded.js +0 -145
  110. package/v2Containers/WebPush/Create/preview/components/IOSHeader.js +0 -45
  111. package/v2Containers/WebPush/Create/preview/components/NotificationExpandedContent.js +0 -68
  112. package/v2Containers/WebPush/Create/preview/components/NotificationHeader.js +0 -61
  113. package/v2Containers/WebPush/Create/preview/components/WindowsChromeExpanded.js +0 -99
  114. package/v2Containers/WebPush/Create/preview/components/tests/AndroidMobileExpanded.test.js +0 -733
  115. package/v2Containers/WebPush/Create/preview/components/tests/WindowsChromeExpanded.test.js +0 -571
  116. package/v2Containers/WebPush/Create/preview/components/tests/__snapshots__/AndroidMobileExpanded.test.js.snap +0 -85
  117. package/v2Containers/WebPush/Create/preview/components/tests/__snapshots__/WindowsChromeExpanded.test.js.snap +0 -81
  118. package/v2Containers/WebPush/Create/preview/config/notificationMappings.js +0 -50
  119. package/v2Containers/WebPush/Create/preview/constants.js +0 -637
  120. package/v2Containers/WebPush/Create/preview/notification-container.scss +0 -79
  121. package/v2Containers/WebPush/Create/preview/preview.scss +0 -358
  122. package/v2Containers/WebPush/Create/preview/styles/_android-mobile-chrome.scss +0 -370
  123. package/v2Containers/WebPush/Create/preview/styles/_android-mobile-edge.scss +0 -12
  124. package/v2Containers/WebPush/Create/preview/styles/_android-mobile-firefox.scss +0 -12
  125. package/v2Containers/WebPush/Create/preview/styles/_android-mobile-opera.scss +0 -12
  126. package/v2Containers/WebPush/Create/preview/styles/_android-tablet-chrome.scss +0 -47
  127. package/v2Containers/WebPush/Create/preview/styles/_android-tablet-edge.scss +0 -11
  128. package/v2Containers/WebPush/Create/preview/styles/_android-tablet-firefox.scss +0 -11
  129. package/v2Containers/WebPush/Create/preview/styles/_android-tablet-opera.scss +0 -11
  130. package/v2Containers/WebPush/Create/preview/styles/_base.scss +0 -207
  131. package/v2Containers/WebPush/Create/preview/styles/_ios.scss +0 -153
  132. package/v2Containers/WebPush/Create/preview/styles/_ipados.scss +0 -107
  133. package/v2Containers/WebPush/Create/preview/styles/_macos-chrome.scss +0 -101
  134. package/v2Containers/WebPush/Create/preview/styles/_windows-chrome.scss +0 -229
  135. package/v2Containers/WebPush/Create/preview/tests/DevicePreviewContent.test.js +0 -909
  136. package/v2Containers/WebPush/Create/preview/tests/NotificationContainer.test.js +0 -1081
  137. package/v2Containers/WebPush/Create/preview/tests/PreviewControls.test.js +0 -723
  138. package/v2Containers/WebPush/Create/preview/tests/WebPushPreview.test.js +0 -1327
  139. package/v2Containers/WebPush/Create/preview/tests/__snapshots__/DevicePreviewContent.test.js.snap +0 -131
  140. package/v2Containers/WebPush/Create/preview/tests/__snapshots__/NotificationContainer.test.js.snap +0 -112
  141. package/v2Containers/WebPush/Create/preview/tests/__snapshots__/PreviewControls.test.js.snap +0 -144
  142. package/v2Containers/WebPush/Create/preview/tests/__snapshots__/WebPushPreview.test.js.snap +0 -129
  143. package/v2Containers/WebPush/Create/utils/payloadBuilder.js +0 -96
  144. package/v2Containers/WebPush/Create/utils/payloadBuilder.test.js +0 -396
  145. package/v2Containers/WebPush/Create/utils/previewUtils.js +0 -89
  146. package/v2Containers/WebPush/Create/utils/urlValidation.js +0 -115
  147. package/v2Containers/WebPush/Create/utils/urlValidation.test.js +0 -449
  148. package/v2Containers/WebPush/Create/utils/validation.js +0 -76
  149. package/v2Containers/WebPush/Create/utils/validation.test.js +0 -283
  150. package/v2Containers/WebPush/actions.js +0 -60
  151. package/v2Containers/WebPush/constants.js +0 -132
  152. package/v2Containers/WebPush/index.js +0 -2
  153. package/v2Containers/WebPush/reducer.js +0 -104
  154. package/v2Containers/WebPush/sagas.js +0 -119
  155. package/v2Containers/WebPush/selectors.js +0 -65
  156. package/v2Containers/WebPush/tests/reducer.test.js +0 -863
  157. package/v2Containers/WebPush/tests/sagas.test.js +0 -566
  158. package/v2Containers/WebPush/tests/selectors.test.js +0 -960
@@ -1,733 +0,0 @@
1
- import React from 'react';
2
- import { shallowWithIntl, mountWithIntl } from '../../../../../../helpers/intl-enzym-test-helpers';
3
- import AndroidMobileExpanded from '../AndroidMobileExpanded';
4
-
5
- describe('AndroidMobileExpanded', () => {
6
- const defaultProps = {
7
- icon: 'https://example.com/chrome-icon.png',
8
- selectedBrowser: 'Chrome',
9
- notificationTitle: 'Test Notification Title',
10
- notificationBody: 'Test notification body text that can be quite long and should be truncated after 4 lines',
11
- displayUrl: 'example.com',
12
- brandIcon: 'https://example.com/brand-icon.png',
13
- shouldShowBrandIcon: false,
14
- shouldShowBrandIconExpanded: false,
15
- mediaImageUrl: '',
16
- };
17
-
18
- beforeEach(() => {
19
- jest.clearAllMocks();
20
- });
21
-
22
- describe('Basic Rendering', () => {
23
- it('should render correctly with default props', () => {
24
- const wrapper = shallowWithIntl(<AndroidMobileExpanded {...defaultProps} />);
25
- expect(wrapper).toMatchSnapshot();
26
- });
27
-
28
- it('should render all required elements', () => {
29
- const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
30
-
31
- // Browser icon container
32
- expect(wrapper.find('.android-mobile-expanded-icon').exists()).toBe(true);
33
- expect(wrapper.find('.notification-icon-container').exists()).toBe(true);
34
- expect(wrapper.find('.notification-icon').exists()).toBe(true);
35
-
36
- // Wrapper container
37
- expect(wrapper.find('.android-mobile-expanded-wrapper').exists()).toBe(true);
38
-
39
- // Top section
40
- expect(wrapper.find('.android-mobile-expanded-top').exists()).toBe(true);
41
- expect(wrapper.find('.android-mobile-expanded-top-content').exists()).toBe(true);
42
-
43
- // Header
44
- expect(wrapper.find('.android-mobile-expanded-header').exists()).toBe(true);
45
- expect(wrapper.find('.android-mobile-expanded-header-content').exists()).toBe(true);
46
- expect(wrapper.find('.android-mobile-expanded-browser-name').exists()).toBe(true);
47
- expect(wrapper.find('.android-mobile-expanded-domain-time').exists()).toBe(true);
48
- expect(wrapper.find('.android-mobile-expanded-domain').exists()).toBe(true);
49
- expect(wrapper.find('.android-mobile-expanded-time').exists()).toBe(true);
50
-
51
- // Title
52
- expect(wrapper.find('.android-mobile-expanded-title').exists()).toBe(true);
53
-
54
- // Body
55
- expect(wrapper.find('.android-mobile-expanded-body').exists()).toBe(true);
56
- expect(wrapper.find('.android-mobile-expanded-body-text').exists()).toBe(true);
57
-
58
- // Arrow
59
- expect(wrapper.find('.notification-action-arrow.android-mobile-expanded-arrow').exists()).toBe(true);
60
- });
61
-
62
- it('should render browser icon with correct src and alt', () => {
63
- const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
64
- const icon = wrapper.find('.notification-icon');
65
-
66
- expect(icon.exists()).toBe(true);
67
- expect(icon.prop('src')).toBe(defaultProps.icon);
68
- expect(icon.prop('alt')).toBe(defaultProps.selectedBrowser);
69
- });
70
-
71
- it('should render notification title', () => {
72
- const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
73
- const title = wrapper.find('.android-mobile-expanded-title');
74
-
75
- expect(title.exists()).toBe(true);
76
- expect(title.text()).toBe(defaultProps.notificationTitle);
77
- });
78
-
79
- it('should render notification body', () => {
80
- const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
81
- const body = wrapper.find('.android-mobile-expanded-body-text');
82
-
83
- expect(body.exists()).toBe(true);
84
- expect(body.text()).toBe(defaultProps.notificationBody);
85
- });
86
-
87
- it('should render display URL', () => {
88
- const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
89
- const domain = wrapper.find('.android-mobile-expanded-domain');
90
-
91
- expect(domain.exists()).toBe(true);
92
- expect(domain.text()).toBe(defaultProps.displayUrl);
93
- });
94
-
95
- it('should render hardcoded time', () => {
96
- const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
97
- const time = wrapper.find('.android-mobile-expanded-time');
98
-
99
- expect(time.exists()).toBe(true);
100
- expect(time.text()).toBe('2:29 PM');
101
- });
102
-
103
- it('should render arrow icon', () => {
104
- const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
105
- const arrow = wrapper.find('.notification-action-arrow.android-mobile-expanded-arrow');
106
- const arrowIcon = wrapper.find('.android-mobile-expanded-arrow-icon');
107
-
108
- expect(arrow.exists()).toBe(true);
109
- expect(arrowIcon.exists()).toBe(true);
110
- expect(arrowIcon.prop('alt')).toBe('Collapse');
111
- });
112
- });
113
-
114
- describe('getBrowserDisplayName', () => {
115
- it('should return "Chrome" for Chrome browser', () => {
116
- const wrapper = mountWithIntl(
117
- <AndroidMobileExpanded {...defaultProps} selectedBrowser="Chrome" />
118
- );
119
- const browserName = wrapper.find('.android-mobile-expanded-browser-name');
120
-
121
- expect(browserName.text()).toBe('Chrome');
122
- });
123
-
124
- it('should return "Firefox" for Firefox browser', () => {
125
- const wrapper = mountWithIntl(
126
- <AndroidMobileExpanded {...defaultProps} selectedBrowser="Firefox" />
127
- );
128
- const browserName = wrapper.find('.android-mobile-expanded-browser-name');
129
-
130
- expect(browserName.text()).toBe('Firefox');
131
- });
132
-
133
- it('should return "Edge" for Edge browser', () => {
134
- const wrapper = mountWithIntl(
135
- <AndroidMobileExpanded {...defaultProps} selectedBrowser="Edge" />
136
- );
137
- const browserName = wrapper.find('.android-mobile-expanded-browser-name');
138
-
139
- expect(browserName.text()).toBe('Edge');
140
- });
141
-
142
- it('should return "Opera" for Opera browser', () => {
143
- const wrapper = mountWithIntl(
144
- <AndroidMobileExpanded {...defaultProps} selectedBrowser="Opera" />
145
- );
146
- const browserName = wrapper.find('.android-mobile-expanded-browser-name');
147
-
148
- expect(browserName.text()).toBe('Opera');
149
- });
150
-
151
- it('should return the browser name as-is for unknown browsers', () => {
152
- const unknownBrowser = 'Safari';
153
- const wrapper = mountWithIntl(
154
- <AndroidMobileExpanded {...defaultProps} selectedBrowser={unknownBrowser} />
155
- );
156
- const browserName = wrapper.find('.android-mobile-expanded-browser-name');
157
-
158
- expect(browserName.text()).toBe(unknownBrowser);
159
- });
160
-
161
- it('should handle empty string browser name', () => {
162
- const wrapper = mountWithIntl(
163
- <AndroidMobileExpanded {...defaultProps} selectedBrowser="" />
164
- );
165
- const browserName = wrapper.find('.android-mobile-expanded-browser-name');
166
-
167
- expect(browserName.text()).toBe('');
168
- });
169
-
170
- it('should handle case-sensitive browser names', () => {
171
- const wrapper = mountWithIntl(
172
- <AndroidMobileExpanded {...defaultProps} selectedBrowser="chrome" />
173
- );
174
- const browserName = wrapper.find('.android-mobile-expanded-browser-name');
175
-
176
- // Should return as-is since "chrome" (lowercase) is not in the mapping
177
- expect(browserName.text()).toBe('chrome');
178
- });
179
- });
180
-
181
- describe('Brand Icon Display Logic', () => {
182
- it('should show brand icon when shouldShowBrandIconExpanded is true and brandIcon exists', () => {
183
- const wrapper = mountWithIntl(
184
- <AndroidMobileExpanded
185
- {...defaultProps}
186
- shouldShowBrandIconExpanded={true}
187
- brandIcon="https://example.com/brand-icon.png"
188
- />
189
- );
190
-
191
- const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
192
- expect(brandIconContainer.exists()).toBe(true);
193
-
194
- const brandIcon = wrapper.find('.notification-brand-icon');
195
- expect(brandIcon.exists()).toBe(true);
196
- expect(brandIcon.prop('src')).toBe('https://example.com/brand-icon.png');
197
- expect(brandIcon.prop('alt')).toBe('Brand icon');
198
- });
199
-
200
- it('should show brand icon when shouldShowBrandIcon is true and brandIcon exists', () => {
201
- const wrapper = mountWithIntl(
202
- <AndroidMobileExpanded
203
- {...defaultProps}
204
- shouldShowBrandIcon={true}
205
- brandIcon="https://example.com/brand-icon.png"
206
- />
207
- );
208
-
209
- const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
210
- expect(brandIconContainer.exists()).toBe(true);
211
-
212
- const brandIcon = wrapper.find('.notification-brand-icon');
213
- expect(brandIcon.exists()).toBe(true);
214
- expect(brandIcon.prop('src')).toBe('https://example.com/brand-icon.png');
215
- });
216
-
217
- it('should show brand icon when both shouldShowBrandIcon and shouldShowBrandIconExpanded are true', () => {
218
- const wrapper = mountWithIntl(
219
- <AndroidMobileExpanded
220
- {...defaultProps}
221
- shouldShowBrandIcon={true}
222
- shouldShowBrandIconExpanded={true}
223
- brandIcon="https://example.com/brand-icon.png"
224
- />
225
- );
226
-
227
- const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
228
- expect(brandIconContainer.exists()).toBe(true);
229
- });
230
-
231
- it('should not show brand icon when both shouldShowBrandIcon and shouldShowBrandIconExpanded are false', () => {
232
- const wrapper = mountWithIntl(
233
- <AndroidMobileExpanded
234
- {...defaultProps}
235
- shouldShowBrandIcon={false}
236
- shouldShowBrandIconExpanded={false}
237
- brandIcon="https://example.com/brand-icon.png"
238
- />
239
- );
240
-
241
- const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
242
- expect(brandIconContainer.exists()).toBe(false);
243
- });
244
-
245
- it('should not show brand icon when brandIcon is not provided, even if shouldShowBrandIconExpanded is true', () => {
246
- const wrapper = mountWithIntl(
247
- <AndroidMobileExpanded
248
- {...defaultProps}
249
- shouldShowBrandIconExpanded={true}
250
- brandIcon=""
251
- />
252
- );
253
-
254
- const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
255
- expect(brandIconContainer.exists()).toBe(false);
256
- });
257
-
258
- it('should not show brand icon when brandIcon is not provided, even if shouldShowBrandIcon is true', () => {
259
- const wrapper = mountWithIntl(
260
- <AndroidMobileExpanded
261
- {...defaultProps}
262
- shouldShowBrandIcon={true}
263
- brandIcon={null}
264
- />
265
- );
266
-
267
- const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
268
- expect(brandIconContainer.exists()).toBe(false);
269
- });
270
-
271
- it('should not show brand icon when brandIcon is undefined', () => {
272
- const propsWithoutBrandIcon = { ...defaultProps };
273
- delete propsWithoutBrandIcon.brandIcon;
274
-
275
- const wrapper = mountWithIntl(
276
- <AndroidMobileExpanded
277
- {...propsWithoutBrandIcon}
278
- shouldShowBrandIcon={true}
279
- shouldShowBrandIconExpanded={true}
280
- />
281
- );
282
-
283
- const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
284
- expect(brandIconContainer.exists()).toBe(false);
285
- });
286
-
287
- it('should handle shouldShowBrandIconExpanded taking precedence when both flags are set', () => {
288
- // When shouldShowBrandIconExpanded is true, it should show (OR logic)
289
- const wrapper = mountWithIntl(
290
- <AndroidMobileExpanded
291
- {...defaultProps}
292
- shouldShowBrandIcon={false}
293
- shouldShowBrandIconExpanded={true}
294
- brandIcon="https://example.com/brand-icon.png"
295
- />
296
- );
297
-
298
- const brandIconContainer = wrapper.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
299
- expect(brandIconContainer.exists()).toBe(true);
300
- });
301
- });
302
-
303
- describe('Media Image Display', () => {
304
- it('should render media image when mediaImageUrl is provided', () => {
305
- const wrapper = mountWithIntl(
306
- <AndroidMobileExpanded
307
- {...defaultProps}
308
- mediaImageUrl="https://example.com/media-image.jpg"
309
- />
310
- );
311
-
312
- const mediaContainer = wrapper.find('.android-mobile-expanded-media');
313
- expect(mediaContainer.exists()).toBe(true);
314
-
315
- const mediaImage = wrapper.find('.android-mobile-expanded-media-image');
316
- expect(mediaImage.exists()).toBe(true);
317
- expect(mediaImage.prop('src')).toBe('https://example.com/media-image.jpg');
318
- expect(mediaImage.prop('alt')).toBe('Notification media');
319
- });
320
-
321
- it('should not render media image when mediaImageUrl is empty string', () => {
322
- const wrapper = mountWithIntl(
323
- <AndroidMobileExpanded
324
- {...defaultProps}
325
- mediaImageUrl=""
326
- />
327
- );
328
-
329
- const mediaContainer = wrapper.find('.android-mobile-expanded-media');
330
- expect(mediaContainer.exists()).toBe(false);
331
- });
332
-
333
- it('should not render media image when mediaImageUrl is not provided', () => {
334
- const propsWithoutMedia = { ...defaultProps };
335
- delete propsWithoutMedia.mediaImageUrl;
336
-
337
- const wrapper = mountWithIntl(<AndroidMobileExpanded {...propsWithoutMedia} />);
338
-
339
- const mediaContainer = wrapper.find('.android-mobile-expanded-media');
340
- expect(mediaContainer.exists()).toBe(false);
341
- });
342
-
343
- it('should not render media image when mediaImageUrl is null', () => {
344
- const wrapper = mountWithIntl(
345
- <AndroidMobileExpanded
346
- {...defaultProps}
347
- mediaImageUrl={null}
348
- />
349
- );
350
-
351
- const mediaContainer = wrapper.find('.android-mobile-expanded-media');
352
- expect(mediaContainer.exists()).toBe(false);
353
- });
354
-
355
- it('should not render media image when mediaImageUrl is undefined', () => {
356
- const wrapper = mountWithIntl(
357
- <AndroidMobileExpanded
358
- {...defaultProps}
359
- mediaImageUrl={undefined}
360
- />
361
- );
362
-
363
- const mediaContainer = wrapper.find('.android-mobile-expanded-media');
364
- expect(mediaContainer.exists()).toBe(false);
365
- });
366
- });
367
-
368
- describe('Edge Cases and Optional Props', () => {
369
- it('should handle empty notification title', () => {
370
- const wrapper = mountWithIntl(
371
- <AndroidMobileExpanded {...defaultProps} notificationTitle="" />
372
- );
373
- const title = wrapper.find('.android-mobile-expanded-title');
374
-
375
- expect(title.exists()).toBe(true);
376
- expect(title.text()).toBe('');
377
- });
378
-
379
- it('should handle empty notification body', () => {
380
- const wrapper = mountWithIntl(
381
- <AndroidMobileExpanded {...defaultProps} notificationBody="" />
382
- );
383
- const body = wrapper.find('.android-mobile-expanded-body-text');
384
-
385
- expect(body.exists()).toBe(true);
386
- expect(body.text()).toBe('');
387
- });
388
-
389
- it('should handle empty display URL', () => {
390
- const wrapper = mountWithIntl(
391
- <AndroidMobileExpanded {...defaultProps} displayUrl="" />
392
- );
393
- const domain = wrapper.find('.android-mobile-expanded-domain');
394
-
395
- expect(domain.exists()).toBe(true);
396
- expect(domain.text()).toBe('');
397
- });
398
-
399
- it('should handle very long notification title', () => {
400
- const longTitle = 'A'.repeat(200);
401
- const wrapper = mountWithIntl(
402
- <AndroidMobileExpanded {...defaultProps} notificationTitle={longTitle} />
403
- );
404
- const title = wrapper.find('.android-mobile-expanded-title');
405
-
406
- expect(title.exists()).toBe(true);
407
- expect(title.text()).toBe(longTitle);
408
- });
409
-
410
- it('should handle very long notification body', () => {
411
- const longBody = 'B'.repeat(500);
412
- const wrapper = mountWithIntl(
413
- <AndroidMobileExpanded {...defaultProps} notificationBody={longBody} />
414
- );
415
- const body = wrapper.find('.android-mobile-expanded-body-text');
416
-
417
- expect(body.exists()).toBe(true);
418
- expect(body.text()).toBe(longBody);
419
- });
420
-
421
- it('should handle missing optional props gracefully', () => {
422
- const minimalProps = {
423
- icon: 'https://example.com/icon.png',
424
- selectedBrowser: 'Chrome',
425
- };
426
-
427
- const wrapper = mountWithIntl(<AndroidMobileExpanded {...minimalProps} />);
428
-
429
- // Should still render all structural elements
430
- expect(wrapper.find('.android-mobile-expanded-wrapper').exists()).toBe(true);
431
- expect(wrapper.find('.android-mobile-expanded-title').exists()).toBe(true);
432
- expect(wrapper.find('.android-mobile-expanded-body-text').exists()).toBe(true);
433
- });
434
- });
435
-
436
- describe('Component Structure', () => {
437
- it('should have correct DOM hierarchy', () => {
438
- const wrapper = mountWithIntl(<AndroidMobileExpanded {...defaultProps} />);
439
-
440
- // Icon should be sibling to wrapper
441
- const icon = wrapper.find('.android-mobile-expanded-icon');
442
- const wrapperDiv = wrapper.find('.android-mobile-expanded-wrapper');
443
- const arrow = wrapper.find('.notification-action-arrow.android-mobile-expanded-arrow');
444
-
445
- expect(icon.exists()).toBe(true);
446
- expect(wrapperDiv.exists()).toBe(true);
447
- expect(arrow.exists()).toBe(true);
448
-
449
- // Top section should contain header and title
450
- const topSection = wrapper.find('.android-mobile-expanded-top');
451
- expect(topSection.find('.android-mobile-expanded-header').exists()).toBe(true);
452
- expect(topSection.find('.android-mobile-expanded-title').exists()).toBe(true);
453
-
454
- // Body should contain body text
455
- const bodySection = wrapper.find('.android-mobile-expanded-body');
456
- expect(bodySection.find('.android-mobile-expanded-body-text').exists()).toBe(true);
457
- });
458
-
459
- it('should render brand icon in correct location when shown', () => {
460
- const wrapper = mountWithIntl(
461
- <AndroidMobileExpanded
462
- {...defaultProps}
463
- shouldShowBrandIconExpanded={true}
464
- brandIcon="https://example.com/brand-icon.png"
465
- />
466
- );
467
-
468
- // Brand icon should be in the top section
469
- const topSection = wrapper.find('.android-mobile-expanded-top');
470
- const brandIconContainer = topSection.find('.notification-brand-icon-container.android-mobile-chrome-brand-icon');
471
-
472
- expect(brandIconContainer.exists()).toBe(true);
473
- });
474
-
475
- it('should render media image in body section when provided', () => {
476
- const wrapper = mountWithIntl(
477
- <AndroidMobileExpanded
478
- {...defaultProps}
479
- mediaImageUrl="https://example.com/media.jpg"
480
- />
481
- );
482
-
483
- // Media should be in the body section
484
- const bodySection = wrapper.find('.android-mobile-expanded-body');
485
- const mediaContainer = bodySection.find('.android-mobile-expanded-media');
486
-
487
- expect(mediaContainer.exists()).toBe(true);
488
- });
489
- });
490
-
491
- describe('CTA Buttons', () => {
492
- it('should render CTA buttons when enableCtas is true and ctaButtons array has items', () => {
493
- const ctaButtons = [
494
- { id: '1', label: 'Button 1' },
495
- { id: '2', label: 'Button 2' },
496
- ];
497
-
498
- const wrapper = mountWithIntl(
499
- <AndroidMobileExpanded
500
- {...defaultProps}
501
- enableCtas={true}
502
- ctaButtons={ctaButtons}
503
- />
504
- );
505
-
506
- const ctaContainer = wrapper.find('.android-mobile-expanded-cta-container');
507
- expect(ctaContainer.exists()).toBe(true);
508
-
509
- const ctaButtonsElements = wrapper.find('.android-mobile-expanded-cta-button');
510
- expect(ctaButtonsElements.length).toBe(2);
511
-
512
- expect(ctaButtonsElements.at(0).find('.android-mobile-expanded-cta-button-text').text()).toBe('Button 1');
513
- expect(ctaButtonsElements.at(1).find('.android-mobile-expanded-cta-button-text').text()).toBe('Button 2');
514
- });
515
-
516
- it('should not render CTA buttons when enableCtas is false', () => {
517
- const ctaButtons = [
518
- { id: '1', label: 'Button 1' },
519
- ];
520
-
521
- const wrapper = mountWithIntl(
522
- <AndroidMobileExpanded
523
- {...defaultProps}
524
- enableCtas={false}
525
- ctaButtons={ctaButtons}
526
- />
527
- );
528
-
529
- const ctaContainer = wrapper.find('.android-mobile-expanded-cta-container');
530
- expect(ctaContainer.exists()).toBe(false);
531
- });
532
-
533
- it('should not render CTA buttons when ctaButtons array is empty', () => {
534
- const wrapper = mountWithIntl(
535
- <AndroidMobileExpanded
536
- {...defaultProps}
537
- enableCtas={true}
538
- ctaButtons={[]}
539
- />
540
- );
541
-
542
- const ctaContainer = wrapper.find('.android-mobile-expanded-cta-container');
543
- expect(ctaContainer.exists()).toBe(false);
544
- });
545
-
546
- it('should not render CTA buttons when ctaButtons is null', () => {
547
- const wrapper = mountWithIntl(
548
- <AndroidMobileExpanded
549
- {...defaultProps}
550
- enableCtas={true}
551
- ctaButtons={null}
552
- />
553
- );
554
-
555
- const ctaContainer = wrapper.find('.android-mobile-expanded-cta-container');
556
- expect(ctaContainer.exists()).toBe(false);
557
- });
558
-
559
- it('should not render CTA buttons when ctaButtons is undefined', () => {
560
- const propsWithoutCtas = { ...defaultProps };
561
- delete propsWithoutCtas.ctaButtons;
562
-
563
- const wrapper = mountWithIntl(
564
- <AndroidMobileExpanded
565
- {...propsWithoutCtas}
566
- enableCtas={true}
567
- />
568
- );
569
-
570
- const ctaContainer = wrapper.find('.android-mobile-expanded-cta-container');
571
- expect(ctaContainer.exists()).toBe(false);
572
- });
573
-
574
- it('should apply single button class when only one CTA button is provided', () => {
575
- const ctaButtons = [
576
- { id: '1', label: 'Single Button' },
577
- ];
578
-
579
- const wrapper = mountWithIntl(
580
- <AndroidMobileExpanded
581
- {...defaultProps}
582
- enableCtas={true}
583
- ctaButtons={ctaButtons}
584
- />
585
- );
586
-
587
- const ctaButton = wrapper.find('.android-mobile-expanded-cta-button');
588
- expect(ctaButton.hasClass('android-mobile-expanded-cta-button-single')).toBe(true);
589
- });
590
-
591
- it('should not apply single button class when multiple CTA buttons are provided', () => {
592
- const ctaButtons = [
593
- { id: '1', label: 'Button 1' },
594
- { id: '2', label: 'Button 2' },
595
- ];
596
-
597
- const wrapper = mountWithIntl(
598
- <AndroidMobileExpanded
599
- {...defaultProps}
600
- enableCtas={true}
601
- ctaButtons={ctaButtons}
602
- />
603
- );
604
-
605
- const ctaButtonsElements = wrapper.find('.android-mobile-expanded-cta-button');
606
- ctaButtonsElements.forEach((button) => {
607
- expect(button.hasClass('android-mobile-expanded-cta-button-single')).toBe(false);
608
- });
609
- });
610
-
611
- it('should render dividers between multiple CTA buttons', () => {
612
- const ctaButtons = [
613
- { id: '1', label: 'Button 1' },
614
- { id: '2', label: 'Button 2' },
615
- { id: '3', label: 'Button 3' },
616
- ];
617
-
618
- const wrapper = mountWithIntl(
619
- <AndroidMobileExpanded
620
- {...defaultProps}
621
- enableCtas={true}
622
- ctaButtons={ctaButtons}
623
- />
624
- );
625
-
626
- const dividers = wrapper.find('.android-mobile-expanded-cta-divider');
627
- // Should have 2 dividers for 3 buttons (dividers appear between buttons, not before first)
628
- expect(dividers.length).toBe(2);
629
- });
630
-
631
- it('should not render divider before first button', () => {
632
- const ctaButtons = [
633
- { id: '1', label: 'Button 1' },
634
- { id: '2', label: 'Button 2' },
635
- ];
636
-
637
- const wrapper = mountWithIntl(
638
- <AndroidMobileExpanded
639
- {...defaultProps}
640
- enableCtas={true}
641
- ctaButtons={ctaButtons}
642
- />
643
- );
644
-
645
- const ctaContainer = wrapper.find('.android-mobile-expanded-cta-container');
646
- const firstChild = ctaContainer.children().at(0);
647
-
648
- // First child should be a button, not a divider
649
- expect(firstChild.hasClass('android-mobile-expanded-cta-button')).toBe(true);
650
- });
651
-
652
- it('should render CTA buttons with correct keys', () => {
653
- const ctaButtons = [
654
- { id: 'button-1', label: 'Button 1' },
655
- { id: 'button-2', label: 'Button 2' },
656
- ];
657
-
658
- const wrapper = mountWithIntl(
659
- <AndroidMobileExpanded
660
- {...defaultProps}
661
- enableCtas={true}
662
- ctaButtons={ctaButtons}
663
- />
664
- );
665
-
666
- const ctaButtonsElements = wrapper.find('.android-mobile-expanded-cta-button');
667
- // React Fragment keys are not directly accessible, but we can verify buttons render correctly
668
- expect(ctaButtonsElements.length).toBe(2);
669
- expect(ctaButtonsElements.at(0).find('.android-mobile-expanded-cta-button-text').text()).toBe('Button 1');
670
- expect(ctaButtonsElements.at(1).find('.android-mobile-expanded-cta-button-text').text()).toBe('Button 2');
671
- });
672
-
673
- it('should render CTA buttons with aria-label', () => {
674
- const ctaButtons = [
675
- { id: '1', label: 'Click Me' },
676
- ];
677
-
678
- const wrapper = mountWithIntl(
679
- <AndroidMobileExpanded
680
- {...defaultProps}
681
- enableCtas={true}
682
- ctaButtons={ctaButtons}
683
- />
684
- );
685
-
686
- const ctaButton = wrapper.find('.android-mobile-expanded-cta-button');
687
- expect(ctaButton.prop('aria-label')).toBe('Click Me');
688
- });
689
-
690
- it('should handle CTA button with empty label', () => {
691
- const ctaButtons = [
692
- { id: '1', label: '' },
693
- ];
694
-
695
- const wrapper = mountWithIntl(
696
- <AndroidMobileExpanded
697
- {...defaultProps}
698
- enableCtas={true}
699
- ctaButtons={ctaButtons}
700
- />
701
- );
702
-
703
- const ctaButton = wrapper.find('.android-mobile-expanded-cta-button');
704
- expect(ctaButton.exists()).toBe(true);
705
- expect(ctaButton.find('.android-mobile-expanded-cta-button-text').text()).toBe('');
706
- expect(ctaButton.prop('aria-label')).toBe('');
707
- });
708
- });
709
-
710
- describe('PropTypes Validation', () => {
711
- it('should require icon prop', () => {
712
- const propsWithoutIcon = { ...defaultProps };
713
- delete propsWithoutIcon.icon;
714
-
715
- // PropTypes validation happens at runtime, but we can verify the component handles missing props
716
- // In a real scenario, this would be caught by PropTypes in development mode
717
- expect(() => {
718
- mountWithIntl(<AndroidMobileExpanded {...propsWithoutIcon} />);
719
- }).not.toThrow();
720
- });
721
-
722
- it('should require selectedBrowser prop', () => {
723
- const propsWithoutBrowser = { ...defaultProps };
724
- delete propsWithoutBrowser.selectedBrowser;
725
-
726
- // Component should still render, but PropTypes would warn in development
727
- expect(() => {
728
- mountWithIntl(<AndroidMobileExpanded {...propsWithoutBrowser} />);
729
- }).not.toThrow();
730
- });
731
- });
732
- });
733
-