itemengine-cypress-automation 1.0.206-12thJuneFixesAndRepoUpdate-5fe2304.0 → 1.0.206

Sign up to get free protection for your applications and to get access to all the features.
Files changed (42) hide show
  1. package/cypress/e2e/ILC/ChartsBar/Scoring/addAndDeleteBarAllOrNothingScoring.js +1 -1
  2. package/cypress/e2e/ILC/ChartsBar/gridSettings.js +3 -3
  3. package/cypress/e2e/ILC/ChartsBar/labelOptionsSection.js +2 -0
  4. package/cypress/e2e/ILC/ChartsBar/previewContentsForAllViews.smoke.js +17 -17
  5. package/cypress/e2e/ILC/ChartsBar/selectChartTypeSection.js +747 -0
  6. package/cypress/e2e/ILC/ChartsBar/specifyCorrectAnswerSection.js +1 -1
  7. package/cypress/e2e/ILC/ChartsLine/previewContentsForAllViews.smoke.js +7 -7
  8. package/cypress/e2e/ILC/EssayResponse/additionalSettings.js +257 -0
  9. package/cypress/e2e/ILC/EssayResponse/toolSettings.js +73 -0
  10. package/cypress/e2e/ILC/FillInTheGapsDropdownNew/Scoring/manuallyAndNonScored.js +1 -1
  11. package/cypress/e2e/ILC/FillInTheGapsDropdownNew/additionalSettingsBasic.js +2 -2
  12. package/cypress/e2e/ILC/FillInTheGapsDropdownNew/additionalSettingsForDropdowns.js +1 -1
  13. package/cypress/e2e/ILC/FillInTheGapsDropdownNew/editTabBasicSection.js +3 -3
  14. package/cypress/e2e/ILC/FillInTheGapsDropdownNew/previewContentsForAllViews.smoke.js +1 -1
  15. package/cypress/e2e/ILC/FillInTheGapsDropdownNew/specifyCorrectAnswerSection.js +2 -2
  16. package/cypress/e2e/ILC/FillInTheGapsOverImageDragAndDrop/backgroundImageAndCanvasProperties.js +1 -0
  17. package/cypress/e2e/ILC/FillInTheGapsOverImageDragAndDrop/studentViewSettings.js +2 -2
  18. package/cypress/e2e/ILC/FillInTheGapsOverImageDropdownNew/Scoring/partialEqualWeightsWithAlternativePointsGreaterThanCorrectPoints.js +1 -1
  19. package/cypress/e2e/ILC/FillInTheGapsOverImageDropdownNew/specifyCorrectAnswerSection.js +3 -2
  20. package/cypress/e2e/ILC/FillInTheGapsOverImageDropdownNew/styleAndLayoutCutomization.js +2 -2
  21. package/cypress/e2e/ILC/FillInTheGapsOverImageTextNew/Scoring/partialDifferentWeightsAlternativePointsGreaterThanCorrectPoints.js +1 -1
  22. package/cypress/e2e/ILC/FillInTheGapsOverImageTextNew/allOrNothingForAllViews.smoke.js +1 -1
  23. package/cypress/e2e/ILC/FillInTheGapsOverImageTextNew/backgroundImageAndCanvasProperties.js +4 -3
  24. package/cypress/e2e/ILC/FillInTheGapsOverImageTextNew/styleAndLayoutCustomization.js +29 -26
  25. package/cypress/e2e/ILC/FillInTheGapsTextNew/Scoring/manuallyAndNonScored.js +1 -1
  26. package/cypress/e2e/ILC/FillInTheGapsTextNew/additionalSettingsForAnswerInputFields.js +1 -1
  27. package/cypress/e2e/ILC/FillInTheGapsTextNew/allOrNothingForAllViews.smoke.js +1 -1
  28. package/cypress/e2e/ILC/FillInTheGapsTextNew/editTabBasicSection.js +3 -3
  29. package/cypress/e2e/ILC/FillInTheGapsTextNew/previewContentsForAllViews.smoke.js +1 -1
  30. package/cypress/e2e/ILC/ImageHighlight/customiseHighlightStyle.js +707 -0
  31. package/cypress/e2e/ILC/ImageHighlight/imageHighlightStyle.js +4 -3
  32. package/cypress/pages/chartsBarPage.js +212 -35
  33. package/cypress/pages/chartsDotPlotPage.js +10 -25
  34. package/cypress/pages/components/barAndLineChartComponent.js +54 -5
  35. package/cypress/pages/components/chartsCommonComponent.js +16 -1
  36. package/cypress/pages/components/createQuestionBasePage.js +1 -1
  37. package/cypress/pages/components/figCommonStyleAndLayoutComponent.js +1 -1
  38. package/cypress/pages/components/imageCanvasComponent.js +3 -3
  39. package/cypress/pages/essayResponsePage.js +152 -2
  40. package/cypress/pages/imageHighlightPage.js +398 -15
  41. package/cypress/pages/matchingPage.js +1 -0
  42. package/package.json +2 -2
@@ -0,0 +1,747 @@
1
+ import { chartsBarPage, dialogBoxBase } from "../../../pages";
2
+ import utilities from "../../../support/helpers/utilities";
3
+ import abortEarlySetup from "../../../support/helpers/abortEarly";
4
+ const css = Cypress.env('css');
5
+ const barBackgroundColor = ['rgb(46, 169, 89)', 'rgb(6, 117, 244)', 'rgb(219, 124, 0)'];
6
+ const barLabels = ['Bar 1', 'Bar 2', 'Bar 3']
7
+
8
+ describe('Select chart type - Chart', () => {
9
+ before(() => {
10
+ cy.loginAs('admin');
11
+ });
12
+
13
+ describe('Control buttons functionality', () => {
14
+ abortEarlySetup();
15
+ before(() => {
16
+ chartsBarPage.steps.navigateToCreateQuestion('charts');
17
+ cy.barsPreLoaderWait();
18
+ });
19
+
20
+ it('Add bar button should be displayed', () => {
21
+ utilities.verifyElementVisibilityState(chartsBarPage.selectChartTypeChartToolsAddBarOrPointButton(), 'visible');
22
+ });
23
+
24
+ it('When user hovers over Add bar control option then \'Add bar\' tooltip should be displayed', () => {
25
+ chartsBarPage.selectChartTypeChartToolsAddBarOrPointButton()
26
+ .verifyTooltip('Add bar');
27
+ });
28
+
29
+ it('By default, all the control options should be displayed in disabled state', () => {
30
+ utilities.verifyElementVisibilityState(chartsBarPage.controlOptionsSelectChartType('Undo'), 'visible');
31
+ utilities.verifyElementVisibilityState(chartsBarPage.controlOptionsSelectChartType('Reset'), 'visible');
32
+ utilities.verifyElementVisibilityState(chartsBarPage.controlOptionsSelectChartType('Redo'), 'visible');
33
+ utilities.verifyElementDisabled(chartsBarPage.controlOptionsSelectChartType('Undo'));
34
+ utilities.verifyElementDisabled(chartsBarPage.controlOptionsSelectChartType('Reset'));
35
+ utilities.verifyElementDisabled(chartsBarPage.controlOptionsSelectChartType('Redo'));
36
+ });
37
+
38
+ it('By default 3 bars with labels should be displayed in select chart type and specify correct answer section', () => {
39
+ barLabels.forEach((label, index) => {
40
+ chartsBarPage.steps.verifyBarLabelSelectChartType(index, label);
41
+ });
42
+ utilities.verifyElementCount(chartsBarPage.selectChartTypeBar(), 3);
43
+ barLabels.forEach((label, index) => {
44
+ chartsBarPage.steps.verifyBarLabelSpecifyCorrectAnswer(index, label);
45
+ });
46
+ utilities.verifyElementCount(chartsBarPage.specifyCorrectAnswerBar(), 3);
47
+ });
48
+
49
+ it('When user clicks on \'Add bar\' control option then bar should be added in select chart type and specify correct answer section', () => {
50
+ chartsBarPage.steps.addBarOrPointInChartInSelectChartTypeSection();
51
+ chartsBarPage.steps.verifyBarLabelSelectChartType(3, 'Bar 4');
52
+ utilities.verifyElementCount(chartsBarPage.selectChartTypeBar(), 4);
53
+ chartsBarPage.steps.verifyBarLabelSpecifyCorrectAnswer(3, 'Bar 4');
54
+ utilities.verifyElementCount(chartsBarPage.specifyCorrectAnswerBar(), 4);
55
+ });
56
+
57
+ it('When user hovers on the enabled undo and reset button, then tooltips \'Undo\' and \'Reset\' should be displayed', () => {
58
+ chartsBarPage.controlOptionsSelectChartType('Undo')
59
+ .verifyTooltip('Undo');
60
+ chartsBarPage.controlOptionsSelectChartType('Reset')
61
+ .verifyTooltip('Reset');
62
+ });
63
+
64
+ it('CSS of the tooltip text', { tags: 'css' }, () => {
65
+ utilities.triggerMouseover(chartsBarPage.controlOptionsSelectChartType('Undo'));
66
+ utilities.verifyCSS(chartsBarPage.tooltipText(), {
67
+ 'color': css.color.whiteText,
68
+ 'font-size': css.fontSize.small,
69
+ 'font-weight': css.fontWeight.regular,
70
+ 'background-color': css.color.tooltipBg
71
+ });
72
+ utilities.triggerMouseout(chartsBarPage.controlOptionsSelectChartType('Undo'));
73
+ utilities.triggerMouseover(chartsBarPage.controlOptionsSelectChartType('Reset'));
74
+ utilities.verifyCSS(chartsBarPage.tooltipText(), {
75
+ 'color': css.color.whiteText,
76
+ 'font-size': css.fontSize.small,
77
+ 'font-weight': css.fontWeight.regular,
78
+ 'background-color': css.color.tooltipBg
79
+ });
80
+ utilities.triggerMouseout(chartsBarPage.controlOptionsSelectChartType('Reset'));
81
+ });
82
+
83
+ it('Accessibility of the tooltip text', { tags: 'a11y' }, () => {
84
+ utilities.triggerMouseover(chartsBarPage.controlOptionsSelectChartType('Undo'));
85
+ utilities.verifyElementVisibilityState(chartsBarPage.tooltipText(), 'visible');
86
+ cy.checkAccessibility(chartsBarPage.tooltipText().parents('[role="tooltip"]'));
87
+ utilities.triggerMouseout(chartsBarPage.controlOptionsSelectChartType('Undo'));
88
+ utilities.verifyElementVisibilityState(chartsBarPage.tooltipText(), 'notExist');
89
+ utilities.triggerMouseover(chartsBarPage.controlOptionsSelectChartType('Reset'));
90
+ utilities.verifyElementVisibilityState(chartsBarPage.tooltipText(), 'visible');
91
+ cy.checkAccessibility(chartsBarPage.tooltipText().parents('[role="tooltip"]'));
92
+ utilities.triggerMouseout(chartsBarPage.controlOptionsSelectChartType('Reset'));
93
+ utilities.verifyElementVisibilityState(chartsBarPage.tooltipText(), 'notExist');
94
+ });
95
+
96
+ it('When user clicks on a undo button, then the previously performed action should be reverted and redo button should be enabled', () => {
97
+ chartsBarPage.steps.selectControlOptionSelectChartTypeSection('Undo');
98
+ utilities.verifyElementCount(chartsBarPage.selectChartTypeBar(), 3);
99
+ utilities.verifyElementCount(chartsBarPage.specifyCorrectAnswerBar(), 3);
100
+ utilities.verifyElementNotDisabled(chartsBarPage.controlOptionsSelectChartType('Redo'));
101
+ });
102
+
103
+ it('When user hovers on the enabled redo button, then tooltip \'Redo\' should be displayed', () => {
104
+ chartsBarPage.controlOptionsSelectChartType('Redo')
105
+ .verifyTooltip('Redo');
106
+ });
107
+
108
+ it('CSS of the tooltip text', { tags: 'css' }, () => {
109
+ utilities.triggerMouseover(chartsBarPage.controlOptionsSelectChartType('Redo'));
110
+ utilities.verifyCSS(chartsBarPage.tooltipText(), {
111
+ 'color': css.color.whiteText,
112
+ 'font-size': css.fontSize.small,
113
+ 'font-weight': css.fontWeight.regular,
114
+ 'background-color': css.color.tooltipBg
115
+ });
116
+ utilities.triggerMouseout(chartsBarPage.controlOptionsSelectChartType('Redo'));
117
+ });
118
+
119
+ it('Accessibility of the tooltip text', { tags: 'a11y' }, () => {
120
+ utilities.triggerMouseover(chartsBarPage.controlOptionsSelectChartType('Redo'));
121
+ utilities.verifyElementVisibilityState(chartsBarPage.tooltipText(), 'visible');
122
+ cy.checkAccessibility(chartsBarPage.tooltipText().parents('[role="tooltip"]'));
123
+ utilities.triggerMouseout(chartsBarPage.controlOptionsSelectChartType('Redo'));
124
+ utilities.verifyElementVisibilityState(chartsBarPage.tooltipText(), 'notExist');
125
+ });
126
+
127
+ it('When the user clicks on redo button, then the last reverted action should be performed again and the button should be disabled and undo button should be enabled', () => {
128
+ chartsBarPage.steps.selectControlOptionSelectChartTypeSection('Redo');
129
+ utilities.verifyElementCount(chartsBarPage.selectChartTypeBar(), 4);
130
+ utilities.verifyElementCount(chartsBarPage.specifyCorrectAnswerBar(), 4);
131
+ });
132
+
133
+ it('When user performs multiple actions and clicks on undo button then undo button should remain enabled', () => {
134
+ chartsBarPage.steps.setBarValueInSelectChartTypeSection({ barIndex: 2, value: 3, range: 10 })
135
+ chartsBarPage.steps.editBarLabelInSelectChartTypeSection(2, 'Day 3');
136
+ });
137
+
138
+ it('When the user clicks on undo button until the graph reaches its initial state, then the undo button should be disabled and redo button should be enabled', () => {
139
+ for (var i = 0; i < 5; i++) {
140
+ chartsBarPage.steps.selectControlOptionSelectChartTypeSection('Undo');
141
+ }
142
+ utilities.verifyElementDisabled(chartsBarPage.controlOptionsSelectChartType('Undo'));
143
+ utilities.verifyElementNotDisabled(chartsBarPage.controlOptionsSelectChartType('Redo'));
144
+ });
145
+
146
+ it('When the user clicks on redo button until the graph reaches its latest state, then the redo button should be disabled and undo button should be enabled', () => {
147
+ for (var i = 0; i < 5; i++) {
148
+ chartsBarPage.steps.selectControlOptionSelectChartTypeSection('Redo');
149
+ }
150
+ utilities.verifyElementDisabled(chartsBarPage.controlOptionsSelectChartType('Redo'));
151
+ utilities.verifyElementNotDisabled(chartsBarPage.controlOptionsSelectChartType('Undo'));
152
+ });
153
+
154
+ //Reset button
155
+ it('When the user clicks on Reset button then reset popup should be displayed', () => {
156
+ chartsBarPage.steps.selectControlOptionSelectChartTypeSection('Reset');
157
+ utilities.verifyElementVisibilityState(chartsBarPage.dialogBox(), 'visible');
158
+ });
159
+
160
+ chartsBarPage.tests.verifyResetPopupContentWithCSSAndA11y('chart');
161
+
162
+ it('When user clicks on cancel button in reset popup, then reset popup should close and chart should not be reset', () => {
163
+ chartsBarPage.steps.cancelReset();
164
+ chartsBarPage.steps.verifyBarHeightInSelectChartType({ barIndex: 2, barValue: 3, range: 10 })
165
+ chartsBarPage.steps.verifyBarLabelSelectChartType(2, 'Day 3');
166
+ chartsBarPage.steps.verifyBarLabelSpecifyCorrectAnswer(2, 'Day 3');
167
+ });
168
+
169
+ it('When the user clicks on Reset button and confirms reset, then all the chart actions should be reverted and chart should be reverted to default state', () => {
170
+ chartsBarPage.steps.selectControlOptionSelectChartTypeSection('Reset');
171
+ chartsBarPage.steps.confirmReset();
172
+ utilities.verifyElementVisibilityState(chartsBarPage.controlOptionsSelectChartType('Undo'), 'visible');
173
+ utilities.verifyElementDisabled(chartsBarPage.controlOptionsSelectChartType('Undo'));
174
+ utilities.verifyElementVisibilityState(chartsBarPage.controlOptionsSelectChartType('Redo'), 'visible');
175
+ utilities.verifyElementDisabled(chartsBarPage.controlOptionsSelectChartType('Redo'));
176
+ utilities.verifyElementVisibilityState(chartsBarPage.controlOptionsSelectChartType('Reset'), 'visible');
177
+ utilities.verifyElementDisabled(chartsBarPage.controlOptionsSelectChartType('Reset'));
178
+ barLabels.forEach((label, index) => {
179
+ chartsBarPage.steps.verifyBarLabelSelectChartType(index, label);
180
+ });
181
+ utilities.verifyElementCount(chartsBarPage.selectChartTypeBar(), 3);
182
+ barLabels.forEach((label, index) => {
183
+ chartsBarPage.steps.verifyBarLabelSpecifyCorrectAnswer(index, label);
184
+ });
185
+ utilities.verifyElementCount(chartsBarPage.specifyCorrectAnswerBar(), 3);
186
+ chartsBarPage.steps.verifyBarHeightInSelectChartType({ barIndex: 0, barValue: 0, range: 10 });
187
+ chartsBarPage.steps.verifyBarHeightInSelectChartType({ barIndex: 1, barValue: 0, range: 10 });
188
+ chartsBarPage.steps.verifyBarHeightInSelectChartType({ barIndex: 2, barValue: 0, range: 10 });
189
+ });
190
+
191
+ it('CSS of control options in select chart type section', { tags: 'css' }, () => {
192
+ utilities.verifyCSS(chartsBarPage.selectChartTypeChartToolsAddBarOrPointButton(), {
193
+ 'fill': css.color.primaryBtnBg
194
+ });
195
+ utilities.verifyCSS(chartsBarPage.selectChartTypeChartToolsAddBarOrPointButton().find('g path'), {
196
+ 'fill': css.color.defaultBackground
197
+ });
198
+ utilities.verifyCSS(chartsBarPage.controlOptionsSelectChartType('Undo').find('svg'), {
199
+ 'fill': css.color.secondaryBtnDisabled
200
+ });
201
+ utilities.verifyCSS(chartsBarPage.controlOptionsSelectChartType('Redo').find('svg'), {
202
+ 'fill': css.color.secondaryBtnDisabled
203
+ });
204
+ utilities.verifyCSS(chartsBarPage.controlOptionsSelectChartType('Undo').find('svg'), {
205
+ 'fill': css.color.secondaryBtnDisabled
206
+ });
207
+ });
208
+ });
209
+
210
+ describe('Select chart type - Content', () => {
211
+ abortEarlySetup();
212
+ before(() => {
213
+ chartsBarPage.steps.navigateToCreateQuestion('charts');
214
+ cy.barsPreLoaderWait();
215
+ });
216
+
217
+ it('Graph title button should be displayed', () => {
218
+ utilities.verifyInnerText(chartsBarPage.selectChartTypeGraphTitleButton(), 'Graph title');
219
+ utilities.verifyElementVisibilityState(chartsBarPage.selectChartTypeGraphTitleButton(), 'visible');
220
+ });
221
+
222
+ it('Chart should be displayed in select chart type section', () => {
223
+ utilities.verifyElementVisibilityState(chartsBarPage.chartContainerSelectChartType(), 'visible');
224
+ });
225
+
226
+ it('Max Y label and input field should be displayed and by default input field should have prefilled value 10', () => {
227
+ utilities.verifyInnerText(chartsBarPage.selectChartTypeMaxXAndYLabel(), 'Max Y');
228
+ utilities.verifyElementVisibilityState(chartsBarPage.selectChartTypeMaxXAndYLabel(), 'visible');
229
+ chartsBarPage.steps.verifyMaxXAndYValue(10);
230
+ });
231
+
232
+ it('3 bar labels should be displayed on X axis for the bar chart', () => {
233
+ barLabels.forEach((label, index) => {
234
+ chartsBarPage.steps.verifyBarLabelSelectChartType(index, label);
235
+ });
236
+ utilities.verifyElementCount(chartsBarPage.selectChartTypeBar(), 3);
237
+ });
238
+
239
+ it('Y axis should have 0 to 10 labels on the chart', () => {
240
+ chartsBarPage.steps.verifyLabelsInSelectChartType(10, 1);
241
+ });
242
+
243
+ it('User should be able to set bars in specify correct answer section', () => {
244
+ chartsBarPage.steps.setBarValueInSelectChartTypeSection({ barIndex: 0, value: 1, range: 10 });
245
+ chartsBarPage.steps.setBarValueInSelectChartTypeSection({ barIndex: 1, value: 2, range: 10 });
246
+ chartsBarPage.steps.setBarValueInSelectChartTypeSection({ barIndex: 2, value: 3, range: 10 });
247
+ });
248
+
249
+ barBackgroundColor.forEach((color, index) => {
250
+ chartsBarPage.tests.verifyBarTooltipContentsCSSAndA11yInSelectChartType(index, color, barLabels[index]);
251
+ });
252
+ });
253
+
254
+ describe('Select chart type - Edit tab functionality', () => {
255
+ abortEarlySetup();
256
+ before(() => {
257
+ chartsBarPage.steps.navigateToCreateQuestion('charts');
258
+ cy.barsPreLoaderWait();
259
+ });
260
+
261
+ it('When user clicks on Graph title then popup should be displayed with title \'Graph title\' and \'Add title\' label with input field should be displayed along with \'Save\' and \'Cancel\' button', () => {
262
+ chartsBarPage.steps.clickOnGraphTitleButton();
263
+ utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'visible');
264
+ utilities.verifyInnerText(dialogBoxBase.dialogBoxTitle(), 'Graph title');
265
+ utilities.verifyInnerText(chartsBarPage.titlePopupAddLabelLabel(), 'Add title');
266
+ utilities.verifyElementVisibilityState(chartsBarPage.titlePopupAddLabelInputField(), 'visible');
267
+ utilities.verifyInnerText(chartsBarPage.titlePopupSaveButton(), 'Save');
268
+ utilities.verifyInnerText(chartsBarPage.titlePopupCancelButton(), 'Cancel');
269
+ });
270
+
271
+ it('The input field should be prefilled with \'Graph title\'', () => {
272
+ chartsBarPage.steps.verifyTextInTitlePopupAddLabelInputField('Graph title');
273
+ });
274
+
275
+ it('When the user edits the Graph title and clicks on \'Cancel\' button then the changes should not be displayed select chart type and specify correct answer section', () => {
276
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Days');
277
+ chartsBarPage.steps.clickOnTitlePopupCancelButton();
278
+ chartsBarPage.steps.verifyGraphTitleInSelectChartType('Graph title');
279
+ chartsBarPage.steps.verifyGraphTitleInSpecifyCorrectAnswer('Graph title');
280
+ });
281
+
282
+ it('When the user clicks on the \'Graph title\' then the original text should be displayed in the popup', () => {
283
+ chartsBarPage.steps.clickOnGraphTitleButton();
284
+ chartsBarPage.steps.verifyTextInTitlePopupAddLabelInputField('Graph title');
285
+ });
286
+
287
+ it('When the user clicks on \'Save\' after updating the input field the updated label should be displayed in the select chart type and specify correct answer section', () => {
288
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Days');
289
+ chartsBarPage.steps.clickOnTitlePopupSaveButton();
290
+ chartsBarPage.steps.verifyGraphTitleInSelectChartType('Days');
291
+ chartsBarPage.steps.verifyGraphTitleInSpecifyCorrectAnswer('Days');
292
+ });
293
+
294
+ it('When user updates Max Y value then it should be updated in select chart type section and specify correct answer section', () => {
295
+ chartsBarPage.steps.setMaxXAndYValue(20);
296
+ chartsBarPage.steps.verifyMaxValueOnYAxis(20);
297
+ chartsBarPage.steps.verifyMaxValueOnYAxisSpecifyCorrectAnswer(20);
298
+ });
299
+
300
+ it('When user set a bar and locks it then locked icon should be displayed on the bar in select chart type section and specify correct answer section', () => {
301
+ chartsBarPage.steps.setBarValueInSelectChartTypeSection({ barIndex: 0, value: 3, range: 20 });
302
+ chartsBarPage.steps.lockBar(0);
303
+ chartsBarPage.steps.verifyLockedBarInSpecifyCorrectAnswer({ barIndex: 0, barValue: 3, range: 20 });
304
+ chartsBarPage.steps.verifyLockedBarInSelectChartType({ barIndex: 0, barValue: 3, range: 20 });
305
+ });
306
+
307
+ it('When user has locked a bar then unlocked bar button in tooltip should change to Locked bar button and when user hovers over it then \'Locked bar\' tooltip should be displayed', () => {
308
+ utilities.triggerMouseover(utilities.getNthElement(chartsBarPage.selectChartTypeBar(), 0));
309
+ chartsBarPage.steps.verifyLockUnlockButtonIcon('Locked');
310
+ chartsBarPage.steps.verifyTooltipInnerText(chartsBarPage.barAndPointTooltipLockUnlockButton, 'Locked bar');
311
+ utilities.triggerMouseout(utilities.getNthElement(chartsBarPage.selectChartTypeBar(), 0));
312
+ });
313
+
314
+ it('User should not be able to update bar value in locked bar in select chart type section and specify correct answer section', () => {
315
+ chartsBarPage.steps.verifyLockedBarIsNotEditableInSpecifyCorrectAnswer(0);
316
+ chartsBarPage.steps.verifyLockedBarIsNotEditableInSelectChartType(0);
317
+ });
318
+
319
+ it('When user unlocks the locked bar then bar should be displayed in unlocked state in select chart type and specify correct answer section and locked bar button should change to unlocked bar button in tooltip', () => {
320
+ chartsBarPage.steps.unlockBar(0);
321
+ utilities.triggerMouseover(utilities.getNthElement(chartsBarPage.selectChartTypeBar(), 0));
322
+ chartsBarPage.steps.verifyLockUnlockButtonIcon('Unlocked');
323
+ utilities.triggerMouseout(utilities.getNthElement(chartsBarPage.selectChartTypeBar(), 0));
324
+ chartsBarPage.steps.verifyUnlockedBarInSelectChartType(0);
325
+ chartsBarPage.steps.verifyUnlockedBarInSpecifyCorrectAnswer(0);
326
+ });
327
+
328
+ it('When bar is at the topmost value and the user still tries to increase its value, then the bar value should not increase', () => {
329
+ for (var i = 0; i < 17; i++) {
330
+ chartsBarPage.steps.incrementBarValueUsingUpArrowSelectChartType(0);
331
+ }
332
+ chartsBarPage.steps.verifyBarHeightInSelectChartType({ barIndex: 0, barValue: 20, range: 20 });
333
+ });
334
+
335
+ it('When bar is at the bottommost value and the user still tries to decrease its value, then the bar value should not decrease', () => {
336
+ chartsBarPage.steps.decrementBarValueUsingDownArrowSelectChartType(2);
337
+ chartsBarPage.steps.decrementBarValueUsingDownArrowSelectChartType(2);
338
+ chartsBarPage.steps.verifyBarHeightInSelectChartType({ barIndex: 2, barValue: 0, range: 20 });
339
+ });
340
+
341
+ it('When user sets a bar and does not lock the bar then it should not be reflected in specify correct answer section', () => {
342
+ chartsBarPage.steps.setBarValueInSelectChartTypeSection({ barIndex: 2, value: 2, range: 20 });
343
+ chartsBarPage.steps.verifyBarHeightInSpecifyCorrectAnswer({ barIndex: 2, barValue: 0, range: 20 });
344
+ });
345
+
346
+ //Bar label
347
+ it('When user clicks on bar label button then popup should be displayed with title \'Bar label\' and \'Add label\' label with input field should be displayed along with \'Save\' and \'Cancel\' button', () => {
348
+ utilities.triggerMouseover(utilities.getNthElement(chartsBarPage.selectChartTypeBar(), 0));
349
+ chartsBarPage.steps.clickOnBarTooltipBarLabelButton();
350
+ utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'visible');
351
+ utilities.verifyInnerText(dialogBoxBase.dialogBoxTitle(), 'Bar label');
352
+ utilities.verifyInnerText(chartsBarPage.titlePopupAddLabelLabel(), 'Add label');
353
+ utilities.verifyElementVisibilityState(chartsBarPage.titlePopupAddLabelInputField(), 'visible');
354
+ utilities.verifyInnerText(chartsBarPage.titlePopupSaveButton(), 'Save');
355
+ utilities.verifyInnerText(chartsBarPage.titlePopupCancelButton(), 'Cancel');
356
+ });
357
+
358
+ it('The input field should be prefilled with \'Label\'', () => {
359
+ chartsBarPage.steps.verifyTextInTitlePopupAddLabelInputField('Bar 1');
360
+ });
361
+
362
+ it('When the user edits the Bar label and clicks on \'Cancel\' button then the changes should not be displayed select chart type and specify correct answer section', () => {
363
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Day 1');
364
+ chartsBarPage.steps.clickOnTitlePopupCancelButton();
365
+ chartsBarPage.steps.verifyBarLabelSelectChartType(0, 'Bar 1');
366
+ chartsBarPage.steps.verifyBarLabelSpecifyCorrectAnswer(0, 'Bar 1');
367
+ });
368
+
369
+ it('When the user clicks on the Bar label then the original text should be displayed in the popup', () => {
370
+ utilities.verifyInnerText(chartsBarPage.barAndPointTooltipLabelButton(), 'Bar 1');
371
+ chartsBarPage.steps.clickOnBarTooltipBarLabelButton();
372
+ chartsBarPage.steps.verifyTextInTitlePopupAddLabelInputField('Bar 1');
373
+ });
374
+
375
+ it('When the user clicks on \'Save\' after updating the input field the updated label should be displayed in the select chart type and specify correct answer section', () => {
376
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Day 1');
377
+ chartsBarPage.steps.clickOnTitlePopupSaveButton();
378
+ chartsBarPage.steps.verifyBarLabelSelectChartType(0, 'Day 1');
379
+ chartsBarPage.steps.verifyBarLabelSpecifyCorrectAnswer(0, 'Day 1');
380
+ });
381
+
382
+ //X axis label
383
+ it('When user clicks on x axis label then popup should be displayed with title \'X axis label\' and \'Add label\' label with input field should be displayed along with \'Save\' and \'Cancel\' button', () => {
384
+ chartsBarPage.steps.clickOnXAxisLabelButton();
385
+ utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'visible');
386
+ utilities.verifyInnerText(dialogBoxBase.dialogBoxTitle(), 'X axis label');
387
+ utilities.verifyInnerText(chartsBarPage.titlePopupAddLabelLabel(), 'Add label');
388
+ utilities.verifyElementVisibilityState(chartsBarPage.titlePopupAddLabelInputField(), 'visible');
389
+ utilities.verifyInnerText(chartsBarPage.titlePopupSaveButton(), 'Save');
390
+ utilities.verifyInnerText(chartsBarPage.titlePopupCancelButton(), 'Cancel');
391
+ });
392
+
393
+ it('The input field should be prefilled with \'Label\'', () => {
394
+ chartsBarPage.steps.verifyTextInTitlePopupAddLabelInputField('Label');
395
+ });
396
+
397
+ it('When the user edits the X axis label and clicks on \'Cancel\' button then the changes should not be displayed select chart type and specify correct answer section', () => {
398
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Days');
399
+ chartsBarPage.steps.clickOnTitlePopupCancelButton();
400
+ utilities.verifyInnerText(chartsBarPage.selectChartTypeXAxisLabelButton(), 'Label');
401
+ utilities.verifyInnerText(chartsBarPage.xAxisLabelSpecifyCorrectAnswer(), 'Label');
402
+ });
403
+
404
+ it('When the user clicks on the X axis label then the original text should be displayed in the popup', () => {
405
+ chartsBarPage.steps.clickOnXAxisLabelButton();
406
+ chartsBarPage.steps.verifyTextInTitlePopupAddLabelInputField('Label');
407
+ });
408
+
409
+ it('When the user clicks on \'Save\' after updating the input field the updated label should be displayed in the select chart type and specify correct answer section', () => {
410
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Days');
411
+ chartsBarPage.steps.clickOnTitlePopupSaveButton();
412
+ utilities.verifyInnerText(chartsBarPage.selectChartTypeXAxisLabelButton(), 'Days');
413
+ chartsBarPage.steps.verifyXAxisLabelInSpecifyCorrectAnswer('Days');
414
+ });
415
+
416
+ //Y axis label
417
+ it('When user clicks on Y axis label then popup should be displayed with title \'Y axis label\' and \'Add label\' label with input field should be displayed along with \'Save\' and \'Cancel\' button', () => {
418
+ chartsBarPage.steps.clickOnYAxisLabelButton();
419
+ utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'visible');
420
+ utilities.verifyInnerText(dialogBoxBase.dialogBoxTitle(), 'Y axis label');
421
+ utilities.verifyInnerText(chartsBarPage.titlePopupAddLabelLabel(), 'Add label');
422
+ utilities.verifyElementVisibilityState(chartsBarPage.titlePopupAddLabelInputField(), 'visible');
423
+ utilities.verifyInnerText(chartsBarPage.titlePopupSaveButton(), 'Save');
424
+ utilities.verifyInnerText(chartsBarPage.titlePopupCancelButton(), 'Cancel');
425
+ });
426
+
427
+ it('The input field should be prefilled with \'Label\'', () => {
428
+ chartsBarPage.steps.verifyTextInTitlePopupAddLabelInputField('Label');
429
+ });
430
+
431
+ it('When the user edits the Y axis label and clicks on \'Cancel\' button then the changes should not be displayed select chart type and specify correct answer section', () => {
432
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Profit in rupees');
433
+ chartsBarPage.steps.clickOnTitlePopupCancelButton();
434
+ utilities.verifyInnerText(chartsBarPage.selectChartTypeYAxisLabelButton(), 'Label');
435
+ utilities.verifyInnerText(chartsBarPage.yAxisLabelSpecifyCorrectAnswer(), 'Label');
436
+ });
437
+
438
+ it('When the user clicks on the Y axis label then the original text should be displayed in the popup', () => {
439
+ chartsBarPage.steps.clickOnYAxisLabelButton();
440
+ chartsBarPage.steps.verifyTextInTitlePopupAddLabelInputField('Label');
441
+ });
442
+
443
+ it('When the user clicks on \'Save\' after updating the input field the updated label should be displayed in the select chart type and specify correct answer section', () => {
444
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Profit in rupees');
445
+ chartsBarPage.steps.clickOnTitlePopupSaveButton();
446
+ utilities.verifyInnerText(chartsBarPage.selectChartTypeYAxisLabelButton(), 'Profit in rupees');
447
+ utilities.verifyInnerText(chartsBarPage.yAxisLabelSpecifyCorrectAnswer(), 'Profit in rupees');
448
+ });
449
+ });
450
+
451
+ describe('Select chart type - Preview tab functionality', () => {
452
+ abortEarlySetup();
453
+ before(() => {
454
+ chartsBarPage.steps.navigateToCreateQuestion('charts');
455
+ cy.barsPreLoaderWait();
456
+ });
457
+
458
+ it('When user adds a bar in select chart type section chart then added bar should be displayed in preview tab', () => {
459
+ chartsBarPage.steps.addBarOrPointInChartInSelectChartTypeSection();
460
+ chartsBarPage.steps.switchToPreviewTab();
461
+ utilities.verifyInnerText(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), 3), 'Bar 4');
462
+ utilities.verifyElementCount(chartsBarPage.specifyCorrectAnswerBar(), 4);
463
+ });
464
+
465
+ it('User should be able to set bar in preview tab', () => {
466
+ chartsBarPage.steps.setBarValueInPreviewTab({ barIndex: 3, value: 2, range: 10 });
467
+ });
468
+
469
+ it('When user deletes the previously added bar in select chart type section then bar should be deleted from preview tab charts', () => {
470
+ chartsBarPage.steps.switchToEditTab();
471
+ chartsBarPage.steps.setBarValueInSelectChartTypeSection({ barIndex: 3, value: 2, range: 10 });
472
+ chartsBarPage.steps.deleteBarInSelectChartType(3);
473
+ chartsBarPage.steps.switchToPreviewTab();
474
+ utilities.verifyElementCount(chartsBarPage.specifyCorrectAnswerBar(), 3);
475
+ });
476
+
477
+ it('When the user edits the Graph title and clicks on \'Cancel\' button then the changes should not be displayed in preview tab', () => {
478
+ chartsBarPage.steps.switchToEditTab();
479
+ chartsBarPage.steps.clickOnGraphTitleButton();
480
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Number of Days');
481
+ chartsBarPage.steps.clickOnTitlePopupCancelButton();
482
+ chartsBarPage.steps.switchToPreviewTab();
483
+ utilities.verifyInnerText(chartsBarPage.previewTabGraphTitle(), 'Graph title');
484
+ });
485
+
486
+ it('When the user clicks on \'Save\' after updating the input field the updated label should be displayed in preview tab', () => {
487
+ chartsBarPage.steps.switchToEditTab();
488
+ chartsBarPage.steps.clickOnGraphTitleButton();
489
+ chartsBarPage.steps.verifyTextInTitlePopupAddLabelInputField('Graph title');
490
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Number of days');
491
+ chartsBarPage.steps.clickOnTitlePopupSaveButton();
492
+ chartsBarPage.steps.switchToPreviewTab();
493
+ utilities.verifyInnerText(chartsBarPage.previewTabGraphTitle(), 'Number of days');
494
+ });
495
+
496
+ it('When user updates Max Y value then it should be updated in preview tab', () => {
497
+ chartsBarPage.steps.switchToEditTab();
498
+ chartsBarPage.steps.setMaxXAndYValue(20);
499
+ chartsBarPage.steps.switchToPreviewTab();
500
+ chartsBarPage.steps.verifyMaxValueOnYAxisPreviewTab(20);
501
+ });
502
+
503
+ it('When user set a bar and locks it then locked icon should be displayed on the bar in preview tab', () => {
504
+ chartsBarPage.steps.switchToEditTab();
505
+ chartsBarPage.steps.setBarValueInSelectChartTypeSection({ barIndex: 0, value: 3, range: 20 });
506
+ chartsBarPage.steps.lockBar(0);
507
+ chartsBarPage.steps.switchToPreviewTab();
508
+ chartsBarPage.steps.verifyBarIsLockedInPreviewTab(0);
509
+ });
510
+
511
+ it('User should not be able to update bar value in locked bar in preview tab', () => {
512
+ chartsBarPage.steps.verifyLockedBarIsUneditableInPreviewTab(0);
513
+ });
514
+
515
+ it('When user unlocks the locked bar then bar should be displayed in unlocked state in preview tab and locked bar button should change to unlocked bar button in tooltip', () => {
516
+ chartsBarPage.steps.switchToEditTab();
517
+ chartsBarPage.steps.unlockBar(0);
518
+ chartsBarPage.steps.switchToPreviewTab();
519
+ chartsBarPage.steps.verifyUnlockedBarInPreviewTab(0);
520
+ });
521
+
522
+ it('When bar is at the topmost value and the user still tries to increase its value, then the bar value should not increase', () => {
523
+ for (var i = 0; i < 17; i++) {
524
+ chartsBarPage.steps.increaseBarValueUsingUpArrowInPreviewTab(0);
525
+ }
526
+ chartsBarPage.steps.verifyBarHeightInPreviewTab({ barIndex: 0, barValue: 20, range: 20 });
527
+ });
528
+
529
+ it('When bar is at the bottommost value and the user still tries to decrease its value, then the bar value should not decrease', () => {
530
+ chartsBarPage.steps.decreaseBarValueUsingDownArrowInPreviewTab(2);
531
+ chartsBarPage.steps.decreaseBarValueUsingDownArrowInPreviewTab(2);
532
+ chartsBarPage.steps.verifyBarHeightInPreviewTab({ barIndex: 2, barValue: 0, range: 20 });
533
+ });
534
+
535
+ it('When user sets a bar and does not lock the bar then it should be reflected in preview tab', () => {
536
+ chartsBarPage.steps.switchToEditTab();
537
+ chartsBarPage.steps.setBarValueInSelectChartTypeSection({ barIndex: 2, value: 2, range: 20 });
538
+ chartsBarPage.steps.switchToPreviewTab();
539
+ chartsBarPage.steps.verifyBarHeightInPreviewTab({ barIndex: 2, barValue: 2, range: 20 });
540
+ });
541
+
542
+ //Bar label
543
+ it('When the user edits the Bar label and clicks on \'Cancel\' button then the changes should not be displayed in preview tab', () => {
544
+ chartsBarPage.steps.switchToEditTab();
545
+ utilities.triggerMouseover(utilities.getNthElement(chartsBarPage.selectChartTypeBar(), 0));
546
+ chartsBarPage.steps.clickOnBarTooltipBarLabelButton();
547
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Day 1');
548
+ chartsBarPage.steps.clickOnTitlePopupCancelButton();
549
+ chartsBarPage.steps.switchToPreviewTab();
550
+ utilities.verifyInnerText(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), 0), 'Bar 1');
551
+ });
552
+
553
+ it('When the user clicks on \'Save\' after updating the input field the updated label should be displayed in preview tab', () => {
554
+ chartsBarPage.steps.switchToEditTab();
555
+ utilities.triggerMouseover(utilities.getNthElement(chartsBarPage.selectChartTypeBar(), 0));
556
+ chartsBarPage.steps.clickOnBarTooltipBarLabelButton();
557
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Day 1');
558
+ chartsBarPage.steps.clickOnTitlePopupSaveButton();
559
+ chartsBarPage.steps.switchToPreviewTab();
560
+ utilities.verifyInnerText(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), 0), 'Day 1');
561
+ });
562
+
563
+ //X axis label
564
+ it('When the user edits the X axis label and clicks on \'Cancel\' button then the changes should not be displayed in preview tab', () => {
565
+ chartsBarPage.steps.switchToEditTab();
566
+ chartsBarPage.steps.clickOnXAxisLabelButton();
567
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Number of days');
568
+ chartsBarPage.steps.clickOnTitlePopupCancelButton();
569
+ chartsBarPage.steps.switchToPreviewTab();
570
+ utilities.verifyInnerText(chartsBarPage.previewTabXAxisLabelButton(), 'Label');
571
+ });
572
+
573
+ it('When the user clicks on \'Save\' after updating the input field the updated label should be displayed in preview tab', () => {
574
+ chartsBarPage.steps.switchToEditTab();
575
+ chartsBarPage.steps.clickOnXAxisLabelButton();
576
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Number of days');
577
+ chartsBarPage.steps.clickOnTitlePopupSaveButton();
578
+ chartsBarPage.steps.switchToPreviewTab();
579
+ utilities.verifyInnerText(chartsBarPage.previewTabXAxisLabelButton(), 'Number of days');
580
+ });
581
+
582
+ //Y axis label
583
+
584
+ it('When the user edits the Y axis label and clicks on \'Cancel\' button then the changes should not be displayed in preview tab', () => {
585
+ chartsBarPage.steps.switchToEditTab();
586
+ chartsBarPage.steps.clickOnYAxisLabelButton();
587
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Profit in rupees');
588
+ chartsBarPage.steps.clickOnTitlePopupCancelButton();
589
+ chartsBarPage.steps.switchToPreviewTab();
590
+ utilities.verifyInnerText(chartsBarPage.previewTabYAxisLabelButton(), 'Label');
591
+ });
592
+
593
+ it('When the user clicks on \'Save\' after updating the input field the updated label should be displayed in preview tab', () => {
594
+ chartsBarPage.steps.switchToEditTab();
595
+ chartsBarPage.steps.clickOnYAxisLabelButton();
596
+ chartsBarPage.steps.enterTextInTitlePopupAddLabelInputField('Profit in rupees');
597
+ chartsBarPage.steps.clickOnTitlePopupSaveButton();
598
+ chartsBarPage.steps.switchToPreviewTab();
599
+ utilities.verifyInnerText(chartsBarPage.previewTabYAxisLabelButton(), 'Profit in rupees');
600
+ });
601
+ });
602
+
603
+ describe('Add bar tool - Content and edit tab functionality', () => {
604
+ abortEarlySetup();
605
+ before(() => {
606
+ chartsBarPage.steps.navigateToCreateQuestion('charts');
607
+ cy.barsPreLoaderWait();
608
+ });
609
+
610
+ it('Tools label should be displayed', () => {
611
+ utilities.verifyInnerText(chartsBarPage.toolsLabel(), 'Tools');
612
+ utilities.verifyElementVisibilityState(chartsBarPage.toolsLabel(), 'visible');
613
+ });
614
+
615
+ it('Add bar label and button should be displayed and by default, button should be in unselected state', () => {
616
+ utilities.verifyInnerText(chartsBarPage.addBarOrPointOptionLabel(), 'Add bar');
617
+ utilities.verifyElementVisibilityState(chartsBarPage.addBarOrPointOptionLabel(), 'visible');
618
+ chartsBarPage.steps.verifyAddBarOrPointToolbarOptionButton();
619
+ chartsBarPage.steps.verifyAddBarOrPointToolbarOptionUnselected();
620
+ });
621
+
622
+ it('When user has not selected add tool button then Max bar count input field should be in disabled state', () => {
623
+ utilities.verifyElementDisabled(chartsBarPage.selectChartTypeMaxBarCountInputField());
624
+ });
625
+
626
+ it('When user has not selected add tool button then Add bar button should not be displayed in specify correct answer section', () => {
627
+ utilities.verifyElementVisibilityState(chartsBarPage.controlOptionsSpecifyCorrectAnswer('Add bar'), 'notExist');
628
+ });
629
+
630
+ it('User should be able to select Add bar tool button', () => {
631
+ chartsBarPage.steps.selectAddBarOrPointToolbarOption();
632
+ });
633
+
634
+ it('When user has selected Add bar tool button then Max bar count input field should be enabled', () => {
635
+ utilities.verifyElementNotDisabled(chartsBarPage.selectChartTypeMaxBarCountInputField());
636
+ });
637
+
638
+ it('When Add bar tool button is in selected state then Add bar button should be displayed in enabled state in the specify correct answer section', () => {
639
+ utilities.verifyElementVisibilityState(chartsBarPage.controlOptionsSpecifyCorrectAnswer('Add bar'), 'visible');
640
+ utilities.verifyElementNotDisabled(chartsBarPage.controlOptionsSpecifyCorrectAnswer('Add bar'));
641
+ });
642
+
643
+ it('When user hovers over Add bar button then Add bar tooltip should be displayed in specify correct answer section', () => {
644
+ chartsBarPage.controlOptionsSpecifyCorrectAnswer('Add bar')
645
+ .verifyTooltip('Add bar');
646
+ });
647
+
648
+ it('When user adds a bar then bar should be added and Add bar button should be in disabled state in specify correct answer section', () => {
649
+ chartsBarPage.steps.addBarOrPointInChartInSpecifyCorrectAnswerSection();
650
+ utilities.verifyElementCount(chartsBarPage.specifyCorrectAnswerBar(), 4);
651
+ chartsBarPage.steps.verifyBarLabelSpecifyCorrectAnswer(3, 'Bar 4');
652
+ utilities.verifyElementDisabled(chartsBarPage.controlOptionsSpecifyCorrectAnswer('Add bar'));
653
+ });
654
+
655
+ it('When user deletes the added bar then added bar should be deleted and Add bar button should be in enabled state', () => {
656
+ chartsBarPage.steps.setBarValueInSpecifyCorrectAnswerSection({ barIndex: 3, value: 2, range: 10 });
657
+ chartsBarPage.steps.deleteBarInSpecifyCorrectAnswer(3);
658
+ utilities.verifyElementCount(chartsBarPage.specifyCorrectAnswerBar(), 3);
659
+ utilities.verifyElementNotDisabled(chartsBarPage.controlOptionsSpecifyCorrectAnswer('Add bar'));
660
+ });
661
+
662
+ it('When user updates the Max bar count in select chart type then user should be able to add bars according to the updated value in specify correct answer section', () => {
663
+ chartsBarPage.steps.setMaxBarCountValue(3);
664
+ for (var i = 0; i < 3; i++) {
665
+ chartsBarPage.steps.addBarOrPointInChartInSpecifyCorrectAnswerSection();
666
+ }
667
+ utilities.verifyElementCount(chartsBarPage.specifyCorrectAnswerBar(), 6);
668
+ for (var i = 1; i < 7; i++) {
669
+ chartsBarPage.steps.verifyBarLabelSpecifyCorrectAnswer(i - 1, `Bar ${i}`);
670
+ }
671
+ utilities.verifyElementDisabled(chartsBarPage.controlOptionsSpecifyCorrectAnswer('Add bar'));
672
+ });
673
+
674
+ it('When user unselects the Add bar tool button then Add bar button should not be displayed and added bar should still remain in specify correct answer', () => {
675
+ chartsBarPage.steps.unselectAddBarOrPointToolbarOption();
676
+ utilities.verifyElementVisibilityState(chartsBarPage.controlOptionsSpecifyCorrectAnswer('Add bar'), 'notExist');
677
+ utilities.verifyElementCount(chartsBarPage.specifyCorrectAnswerBar(), 6);
678
+ });
679
+
680
+ it('When user has unselected the Add bar tool button then Max bar count input field should be displayed in disabled state with the updated value', () => {
681
+ utilities.verifyElementDisabled(chartsBarPage.selectChartTypeMaxBarCountInputField());
682
+ chartsBarPage.steps.verifyMaxBarCountValue(3);
683
+ });
684
+ });
685
+
686
+ describe('Add bar tool - Preview tab functionality', () => {
687
+ abortEarlySetup();
688
+ before(() => {
689
+ chartsBarPage.steps.navigateToCreateQuestion('charts');
690
+ cy.barsPreLoaderWait();
691
+ });
692
+
693
+ it('When Add bar tool button is in unselected state then Add bar button should not be displayed in preview tab', () => {
694
+ chartsBarPage.steps.verifyAddBarOrPointToolbarOptionUnselected();
695
+ chartsBarPage.steps.switchToPreviewTab();
696
+ utilities.verifyElementVisibilityState(chartsBarPage.previewTabToolsAddBarOrPointButton('Add bar'), 'notExist');
697
+ });
698
+
699
+ it('When Add bar tool button is in selected state then Add bar button should be displayed in preview tab', () => {
700
+ chartsBarPage.steps.switchToEditTab();
701
+ chartsBarPage.steps.selectAddBarOrPointToolbarOption();
702
+ chartsBarPage.steps.switchToPreviewTab();
703
+ utilities.verifyElementVisibilityState(chartsBarPage.previewTabToolsAddBarOrPointButton('Add bar'), 'visible');
704
+ utilities.verifyElementNotDisabled(chartsBarPage.previewTabToolsAddBarOrPointButton('Add bar'));
705
+ });
706
+
707
+ it('When user hovers over Add bar button then Add bar tooltip should be displayed in preview tab', () => {
708
+ chartsBarPage.previewTabToolsAddBarOrPointButton('Add bar')
709
+ .verifyTooltip('Add bar');
710
+ });
711
+
712
+ it('When user adds a bar then then new bar should be added and Add bar button should be in disabled state', () => {
713
+ chartsBarPage.steps.addBarOrPointInChartInPreviewTab('Add bar');
714
+ utilities.verifyElementCount(chartsBarPage.previewTabBar(), 4);
715
+ utilities.verifyInnerText(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), 3), 'Bar 4');
716
+ utilities.verifyElementDisabled(chartsBarPage.previewTabToolsAddBarOrPointButton('Add bar'));
717
+ });
718
+
719
+ it('When user deletes the added bar then Add bar button should be in enabled state', () => {
720
+ chartsBarPage.steps.setBarValueInPreviewTab({ barIndex: 3, value: 3, range: 10 });
721
+ chartsBarPage.steps.deleteBarInPreviewTab(3);
722
+ utilities.verifyElementCount(chartsBarPage.previewTabBar(), 3);
723
+ utilities.verifyElementNotDisabled(chartsBarPage.previewTabToolsAddBarOrPointButton('Add bar'));
724
+ });
725
+
726
+ it('When user updates the Max bar count in select chart type then user should be able to add bars according to the updated value preview tab', () => {
727
+ chartsBarPage.steps.switchToEditTab();
728
+ chartsBarPage.steps.setMaxBarCountValue(3);
729
+ chartsBarPage.steps.switchToPreviewTab();
730
+ for (var i = 0; i < 3; i++) {
731
+ chartsBarPage.steps.addBarOrPointInChartInPreviewTab('Add bar');
732
+ }
733
+ utilities.verifyElementCount(chartsBarPage.previewTabBar(), 6);
734
+ for (var i = 1; i < 7; i++) {
735
+ utilities.verifyInnerText(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), i - 1), `Bar ${i}`);
736
+ }
737
+ utilities.verifyElementDisabled(chartsBarPage.previewTabToolsAddBarOrPointButton('Add bar'));
738
+ });
739
+
740
+ it('When user unselects the Add bar tool button then Add bar button should not be displayed in preview tab', () => {
741
+ chartsBarPage.steps.switchToEditTab();
742
+ chartsBarPage.steps.unselectAddBarOrPointToolbarOption();
743
+ chartsBarPage.steps.switchToPreviewTab();
744
+ utilities.verifyElementVisibilityState(chartsBarPage.previewTabToolsAddBarOrPointButton('Add bar'), 'notExist');
745
+ });
746
+ });
747
+ });