itemengine-cypress-automation 1.0.189-e2e-execution-crash-83cdbd4.0 → 1.0.189

package/cypress/e2e/ILC/AudioResponseNew/studentViewSettings.js

@@ -33,10 +33,7 @@ describe('Create item page - Audio response: Student view settings', () => {
             utilities.verifyInnerText(audioResponsePage.audioIndicatorsVolumeMeterButtonLabel(), 'Volume meter');
         });
 
-        it('"Limit number of retake" label and checkbox should be displayed. By default the checkbox should be unchecked', () => {
-            utilities.verifyInnerText(audioResponsePage.limitNumberOfRetakeCheckboxLabel(), 'Limit number of retake');
-            audioResponsePage.steps.limitNumberOfRetakeCheckboxUncheckedState();
-        });
+        audioResponsePage.tests.verifyLimitNumberOfRetakeCheckboxDefaultState();
 
         it('CSS of \'Audio indicators\' section', { tags: 'css' }, () => {
             utilities.verifyCSS(audioResponsePage.audioIndicatorsLabel(), {
@@ -79,13 +76,7 @@ describe('Create item page - Audio response: Student view settings', () => {
             });
         });
 
-        it('When the user checks the "Limit number of retake" checkbox, "Show students the retake limits on tooltip" label and checkbox, "Retake limit" label and input field should be displayed. By default, "Show students the retake limits on tooltip" checkbox should be unchecked and the "Retake limit" input field should be empty', () => {
-            audioResponsePage.steps.checkLimitNumberOfRetakeCheckbox();
-            utilities.verifyInnerText(audioResponsePage.showStudentsTheRetakeLimitsOnTooltipCheckboxLabel(), 'Show students the retake limits on tooltip');
-            audioResponsePage.steps.verifyShowStudentsTheRetakeLimitsOnTooltipCheckboxUncheckedState();
-            utilities.verifyInnerText(audioResponsePage.retakeLimitLabel(), 'Retake limit');
-            audioResponsePage.steps.verifyRetakeLimitInputFieldValue('');
-        });
+        audioResponsePage.tests.verifyLimitNumberOfRetakeCheckboxCheckedState();
     });
 
     describe('Audio indicators : Timer', () => {

package/cypress/e2e/ILC/ChartsBar/previewContentsForAllViews.smoke.js

@@ -0,0 +1,359 @@
+import { chartsBarPage, itemPreviewPage } from "../../../pages";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+const css = Cypress.env('css');
+
+const previewContentViews = ['Question preview', 'Item view', 'Item preview', 'Student view'];
+const views = utilities.getViews(previewContentViews);
+var itemReferenceID = "";
+const barBackgroundColor = ['rgb(46, 169, 89)', 'rgb(6, 117, 244)', 'rgb(219, 124, 0)', 'rgb(156, 105, 39)', 'rgb(219, 60, 0)'];
+
+describe('Create item page: Charts - Bar - Preview contents in all views', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    views.forEach((view) => {
+        describe(`Preview tab contents - ${view}`, { tags: 'smoke' }, () => {
+            abortEarlySetup();
+            before(() => {
+                switch (view) {
+                    case 'Question preview':
+                        chartsBarPage.steps.navigateToCreateQuestion('charts');
+                        cy.barsPreLoaderWait();
+                        chartsBarPage.steps.addTextInQuestionInstructionsInputField('Set the bar on the chart for the profits of the years');
+                        chartsBarPage.steps.selectAddBarOrPointToolbarOption();
+                        chartsBarPage.steps.addBarOrPointInChartInSelectChartTypeSection();
+                        chartsBarPage.steps.setGraphTitle('Graph of profits');
+                        chartsBarPage.steps.setYAxisLabel('Profit');
+                        chartsBarPage.steps.setXAxisLabel('Year');
+                        chartsBarPage.steps.setMaxYValue(20);
+                        chartsBarPage.steps.setBarValueInSelectChartTypeSection({ barIndex: 0, value: 1, range: 20 });
+                        chartsBarPage.steps.setBarValueInSelectChartTypeSection({ barIndex: 1, value: 2, range: 20 });
+                        chartsBarPage.steps.setBarValueInSelectChartTypeSection({ barIndex: 2, value: 3, range: 20 });
+                        chartsBarPage.steps.setBarValueInSelectChartTypeSection({ barIndex: 3, value: 4, range: 20 });
+                        chartsBarPage.steps.lockBar(1);
+                        chartsBarPage.steps.allotPoints(10);
+                        chartsBarPage.steps.setBarValueInSpecifyCorrectAnswerSection({ barIndex: 0, value: 2, range: 20 });
+                        chartsBarPage.steps.setBarValueInSpecifyCorrectAnswerSection({ barIndex: 2, value: 5, range: 20 });
+                        chartsBarPage.steps.setBarValueInSpecifyCorrectAnswerSection({ barIndex: 3, value: 1, range: 20 });
+                        chartsBarPage.steps.addBarOrPointInChartInSpecifyCorrectAnswerSection();
+                        chartsBarPage.steps.setBarValueInSpecifyCorrectAnswerSection({ barIndex: 4, value: 8, range: 20 });
+                        chartsBarPage.steps.switchToPreviewTab();
+                        break;
+                    case 'Item view':
+                        cy.visit(`/item-engine/demo/edit-item/${utilities.base64Encoding(itemReferenceID)}`);
+                        break;
+                    case 'Item preview':
+                        cy.visit(`/item-engine/demo/edit-item/${utilities.base64Encoding(itemReferenceID)}`);
+                        chartsBarPage.steps.switchToPreviewTab();
+                        break;
+                    case 'Student view':
+                        cy.visit(`/item-engine/demo/render-item/student-view/${utilities.base64Encoding(itemReferenceID)}`);
+                        break;
+                    default:
+                        throw new Error('Invalid view');
+                }
+            });
+
+            after(() => {
+                if (view === 'Question preview') {
+                    chartsBarPage.steps.clickOnSaveQuestionButton();
+                    utilities.verifyElementVisibilityState(itemPreviewPage.referenceID(), 'visible');
+                    itemReferenceID = itemPreviewPage.steps.getItemReferenceID();
+                }
+            });
+
+            it('Question instructions should be visible', () => {
+                utilities.verifyInnerText(chartsBarPage.questionInstructionsText(), 'Set the bar on the chart for the profits of the years');
+                utilities.verifyElementVisibilityState(chartsBarPage.questionInstructionsText(), 'visible');
+            });
+
+            it('The toolbar options - Add bar, Undo, Redo and Reset should be displayed in the preview tab and only Add bar button should be enabled', () => {
+                utilities.verifyElementVisibilityState(chartsBarPage.previewTabToolsAddBarOrPointButton(), 'visible');
+                utilities.verifyElementNotDisabled(chartsBarPage.previewTabToolsAddBarOrPointButton());
+                utilities.verifyElementVisibilityState(chartsBarPage.previewTabToolsUndoButton(), 'visible');
+                utilities.verifyElementDisabled(chartsBarPage.previewTabToolsUndoButton());
+                utilities.verifyElementVisibilityState(chartsBarPage.previewTabToolsRedoButton(), 'visible');
+                utilities.verifyElementDisabled(chartsBarPage.previewTabToolsRedoButton());
+                utilities.verifyElementVisibilityState(chartsBarPage.previewTabToolsResetButton(), 'visible');
+                utilities.verifyElementDisabled(chartsBarPage.previewTabToolsResetButton());
+            });
+
+            it('When user hovers on the enabled add bar button, then tooltip \'Add bar\' should be displayed', () => {
+                chartsBarPage.previewTabToolsAddBarOrPointButton()
+                    .verifyTooltip('Add bar');
+            });
+
+            it('CSS of the tooltip text', { tags: 'css' }, () => {
+                utilities.triggerMouseover(chartsBarPage.previewTabToolsAddBarOrPointButton());
+                utilities.verifyCSS(chartsBarPage.tooltipText(), {
+                    'color': css.color.whiteText,
+                    'font-size': css.fontSize.normal,
+                    'font-weight': css.fontWeight.regular,
+                    'background-color': css.color.tooltipBg
+                });
+                utilities.triggerMouseout(chartsBarPage.previewTabToolsAddBarOrPointButton());
+            });
+
+            it('Accessibility of the tooltip text', { tags: 'a11y' }, () => {
+                utilities.triggerMouseover(chartsBarPage.previewTabToolsAddBarOrPointButton());
+                utilities.verifyElementVisibilityState(chartsBarPage.tooltipText(), 'visible');
+                cy.checkAccessibility(chartsBarPage.tooltipText());
+                utilities.triggerMouseout(chartsBarPage.previewTabToolsAddBarOrPointButton());
+                utilities.verifyElementVisibilityState(chartsBarPage.tooltipText(), 'notExist');
+            });
+
+            it('The graph title, Y axis label, X axis label and bar labels should be displayed', () => {
+                utilities.verifyInnerText(chartsBarPage.previewTabGraphTitle(), 'Graph of profits');
+                utilities.verifyElementVisibilityState(chartsBarPage.previewTabGraphTitle(), 'visible');
+                utilities.verifyInnerText(chartsBarPage.previewTabYAxisLabelButton(), 'Profit');
+                utilities.verifyElementVisibilityState(chartsBarPage.previewTabYAxisLabelButton(), 'visible');
+                utilities.verifyInnerText(chartsBarPage.previewTabXAxisLabelButton(), 'Year');
+                utilities.verifyElementVisibilityState(chartsBarPage.previewTabXAxisLabelButton(), 'visible');
+                utilities.verifyInnerText(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), 0), 'Bar 1');
+                utilities.verifyInnerText(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), 1), 'Bar 2');
+                utilities.verifyInnerText(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), 2), 'Bar 3');
+                utilities.verifyInnerText(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), 3), 'Bar 4');
+            });
+
+            it('The graph max value should be as set in the Max Y input field and it should affect the chart division', () => {
+                utilities.verifyTextContent(utilities.getNthElement(chartsBarPage.previewTabYAxisCoordinate(), 0), 20);
+                utilities.verifyElementCount(chartsBarPage.previewTabChartRowHeaderContainer(), 11); //Chart has 10 rows but checking 11 as table also contains bar labels
+            });
+
+            it('User should be able to edit the Y axis and X axis labels in preview tab', () => {
+                chartsBarPage.steps.editYAxisLabelInPreviewTab('Edited Y axis label');
+                utilities.verifyInnerText(chartsBarPage.previewTabYAxisLabelButton(), 'Edited Y axis label');
+                chartsBarPage.steps.editXAxisLabelInPreviewTab('Edited X axis label');
+                utilities.verifyInnerText(chartsBarPage.previewTabXAxisLabelButton(), 'Edited X axis label');
+            });
+
+            it('The charts and graphs should be visible as set by the user in select chart type section', () => {
+                chartsBarPage.steps.verifyBarHeightInPreviewTab({ barIndex: 0, barValue: 1, range: 20 });
+                chartsBarPage.steps.verifyBarHeightInPreviewTab({ barIndex: 1, barValue: 2, range: 20 });
+                chartsBarPage.steps.verifyBarHeightInPreviewTab({ barIndex: 2, barValue: 3, range: 20 });
+                chartsBarPage.steps.verifyBarHeightInPreviewTab({ barIndex: 3, barValue: 4, range: 20 });
+            });
+
+            it('The locked bar should be displayed in the locked state in preview tab and it should not have a drag handle', () => {
+                chartsBarPage.steps.verifyBarIsLockedInPreviewTab(1);
+            });
+
+            it('User should be able to increase the bar height in preview tab', () => {
+                chartsBarPage.steps.setBarValueInPreviewTab({ barIndex: 0, value: 20, range: 20 });
+            });
+
+            it('When user has perform an action on the bar chart, then the undo and reset button should be displayed in enabled state', () => {
+                utilities.verifyElementNotDisabled(chartsBarPage.previewTabToolsUndoButton());
+                utilities.verifyElementNotDisabled(chartsBarPage.previewTabToolsResetButton());
+            });
+
+            it('When user hovers on the enabled undo and reset button, then tooltips \'Undo\' and \'Reset\' should be displayed', () => {
+                chartsBarPage.previewTabToolsUndoButton()
+                    .verifyTooltip('Undo');
+                chartsBarPage.previewTabToolsResetButton()
+                    .verifyTooltip('Reset');
+            });
+
+            it('CSS of the tooltip text', { tags: 'css' }, () => {
+                utilities.triggerMouseover(chartsBarPage.previewTabToolsUndoButton());
+                utilities.verifyCSS(chartsBarPage.tooltipText(), {
+                    'color': css.color.whiteText,
+                    'font-size': css.fontSize.normal,
+                    'font-weight': css.fontWeight.regular,
+                    'background-color': css.color.tooltipBg
+                });
+                utilities.triggerMouseout(chartsBarPage.previewTabToolsUndoButton());
+                utilities.triggerMouseover(chartsBarPage.previewTabToolsResetButton());
+                utilities.verifyCSS(chartsBarPage.tooltipText(), {
+                    'color': css.color.whiteText,
+                    'font-size': css.fontSize.normal,
+                    'font-weight': css.fontWeight.regular,
+                    'background-color': css.color.tooltipBg
+                });
+                utilities.triggerMouseout(chartsBarPage.previewTabToolsResetButton());
+            });
+
+            it('Accessibility of the tooltip text', { tags: 'a11y' }, () => {
+                utilities.triggerMouseover(chartsBarPage.previewTabToolsUndoButton());
+                utilities.verifyElementVisibilityState(chartsBarPage.tooltipText(), 'visible');
+                cy.checkAccessibility(chartsBarPage.tooltipText());
+                utilities.triggerMouseout(chartsBarPage.previewTabToolsUndoButton());
+                utilities.verifyElementVisibilityState(chartsBarPage.tooltipText(), 'notExist');
+                utilities.triggerMouseover(chartsBarPage.previewTabToolsResetButton());
+                utilities.verifyElementVisibilityState(chartsBarPage.tooltipText(), 'visible');
+                cy.checkAccessibility(chartsBarPage.tooltipText());
+                utilities.triggerMouseout(chartsBarPage.previewTabToolsResetButton());
+                utilities.verifyElementVisibilityState(chartsBarPage.tooltipText(), 'notExist');
+            });
+
+            it('User should be able to decrease the height of the bar in preview tab', () => {
+                chartsBarPage.steps.setBarValueInPreviewTab({ barIndex: 2, value: 0, range: 20 });
+            });
+
+            it('User should be able to add a bar in chart and the added bar should be displayed at 0 height with the label \'Bar 5\'', () => {
+                chartsBarPage.steps.addBarOrPointInChartInPreviewTab();
+                utilities.verifyElementCount(chartsBarPage.previewTabBar(), 5);
+                chartsBarPage.steps.verifyBarHeightInPreviewTab({ barIndex: 4, barValue: 0, range: 20 });
+                utilities.verifyInnerText(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), 4), 'Bar 5');
+            });
+
+            it('CSS of newly added bar in preview tab', { tags: 'css' }, () => {
+                utilities.verifyCSS(chartsBarPage.previewTabBar().eq(4), {
+                    'background-color': barBackgroundColor[4]
+                });
+            });
+
+            it('Accessibility of newly added bar in preview tab', { tags: 'a11y' }, () => {
+                cy.checkAccessibility(chartsBarPage.previewTabGraphTitle().parents('[class*="ChartsPreviewstyles__PreviewWrapper"]'));
+            });
+
+            it('When add bar limit is set to 1 and user has added a bar, then the add bar toolbar button should be disabled', () => {
+                utilities.verifyElementDisabled(chartsBarPage.previewTabToolsAddBarOrPointButton());
+            });
+
+            it('User should be able to increase and decrease the height of the newly added bar', () => {
+                chartsBarPage.steps.setBarValueInPreviewTab({ barIndex: 4, value: 8, range: 20 });
+                chartsBarPage.steps.setBarValueInPreviewTab({ barIndex: 4, value: 3, range: 20 });
+            });
+
+            it('User should be able to edit the label a bar', () => {
+                chartsBarPage.steps.editBarLabelInPreviewTab(0, '2000');
+                chartsBarPage.steps.editBarLabelInPreviewTab(1, '2001');
+            });
+
+            it('When user clicks on the undo button, then the last performed action should be reverted', () => {
+                chartsBarPage.steps.clickOnUndoButtonPreviewTab();
+                chartsBarPage.steps.editBarLabelInPreviewTab(1, 'Bar 2');
+            });
+
+            it('When user has clicked on undo button, then the redo button should be enabled', () => {
+                utilities.verifyElementNotDisabled(chartsBarPage.previewTabToolsRedoButton());
+            });
+
+            it('When user hovers on the enabled redo button, then tooltip \'Redo\' should be displayed', () => {
+                chartsBarPage.previewTabToolsRedoButton()
+                    .verifyTooltip('Redo');
+            });
+
+            it('CSS of the tooltip text', { tags: 'css' }, () => {
+                utilities.triggerMouseover(chartsBarPage.previewTabToolsRedoButton());
+                utilities.verifyCSS(chartsBarPage.tooltipText(), {
+                    'color': css.color.whiteText,
+                    'font-size': css.fontSize.normal,
+                    'font-weight': css.fontWeight.regular,
+                    'background-color': css.color.tooltipBg
+                });
+                utilities.triggerMouseout(chartsBarPage.previewTabToolsRedoButton());
+            });
+
+            it('Accessibility of the tooltip text', { tags: 'a11y' }, () => {
+                utilities.triggerMouseover(chartsBarPage.previewTabToolsRedoButton());
+                utilities.verifyElementVisibilityState(chartsBarPage.tooltipText(), 'visible');
+                cy.checkAccessibility(chartsBarPage.tooltipText());
+                utilities.triggerMouseout(chartsBarPage.previewTabToolsRedoButton());
+                utilities.verifyElementVisibilityState(chartsBarPage.tooltipText(), 'notExist');
+            });
+
+            it('When the user clicks on redo button, then the last last reverted action should be performed and the button should be disabled again', () => {
+                chartsBarPage.steps.clickOnRedoButtonPreviewTab();
+                utilities.verifyInnerText(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), 1), '2001');
+                utilities.verifyElementDisabled(chartsBarPage.previewTabToolsRedoButton());
+            });
+
+            it('When user deletes a bar, then that bar should be deleted and the add bar button should be enabled again', () => {
+                chartsBarPage.steps.deleteBarInPreviewTab(4);
+                utilities.verifyElementCount(chartsBarPage.previewTabBar(), 4);
+                utilities.verifyElementVisibilityState(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), 4), 'notExist');
+                utilities.verifyElementNotDisabled(chartsBarPage.previewTabToolsAddBarOrPointButton());
+            });
+
+            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', () => {
+                chartsBarPage.steps.clickOnResetButtonPreviewTab();
+                chartsBarPage.steps.confirmReset();
+                utilities.verifyElementNotDisabled(chartsBarPage.previewTabToolsAddBarOrPointButton());
+                utilities.verifyElementVisibilityState(chartsBarPage.previewTabToolsUndoButton(), 'visible');
+                utilities.verifyElementDisabled(chartsBarPage.previewTabToolsUndoButton());
+                utilities.verifyElementVisibilityState(chartsBarPage.previewTabToolsRedoButton(), 'visible');
+                utilities.verifyElementDisabled(chartsBarPage.previewTabToolsRedoButton());
+                utilities.verifyElementVisibilityState(chartsBarPage.previewTabToolsResetButton(), 'visible');
+                utilities.verifyElementDisabled(chartsBarPage.previewTabToolsResetButton());
+                utilities.verifyInnerText(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), 0), 'Bar 1');
+                utilities.verifyInnerText(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), 1), 'Bar 2');
+                utilities.verifyInnerText(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), 2), 'Bar 3');
+                utilities.verifyInnerText(utilities.getNthElement(chartsBarPage.previewTabBarLabel(), 3), 'Bar 4');
+                chartsBarPage.steps.verifyBarHeightInPreviewTab({ barIndex: 0, barValue: 1, range: 20 });
+                chartsBarPage.steps.verifyBarHeightInPreviewTab({ barIndex: 1, barValue: 2, range: 20 });
+                chartsBarPage.steps.verifyBarHeightInPreviewTab({ barIndex: 2, barValue: 3, range: 20 });
+                chartsBarPage.steps.verifyBarHeightInPreviewTab({ barIndex: 3, barValue: 4, range: 20 });
+                chartsBarPage.steps.verifyBarIsLockedInPreviewTab(1);
+            });
+
+            it('CSS of preview tab contents', { tags: 'css' }, () => {
+                utilities.verifyCSS(chartsBarPage.previewTabToolsAddBarOrPointButton(), {
+                    'background-color': css.color.activeButtons
+                });
+                utilities.verifyCSS(chartsBarPage.previewTabToolsUndoButton().find('svg'), {
+                    'fill': css.color.secondaryBtnDisabled
+                });
+                utilities.verifyCSS(chartsBarPage.previewTabToolsRedoButton().find('svg'), {
+                    'fill': css.color.secondaryBtnDisabled
+                });
+                utilities.verifyCSS(chartsBarPage.previewTabToolsUndoButton().find('svg'), {
+                    'fill': css.color.secondaryBtnDisabled
+                });
+                utilities.verifyCSS(chartsBarPage.previewTabGraphTitle(), {
+                    'color': css.color.text,
+                    'font-size': css.fontSize.default,
+                    'font-weight': css.fontWeight.bold
+                });
+                utilities.verifyCSS(chartsBarPage.previewTabYAxisLabelButton(), {
+                    'color': css.color.activeButtons,
+                    'font-size': css.fontSize.default,
+                    'font-weight': css.fontWeight.bold
+                });
+                utilities.verifyCSS(chartsBarPage.previewTabXAxisLabelButton(), {
+                    'color': css.color.activeButtons,
+                    'font-size': css.fontSize.default,
+                    'font-weight': css.fontWeight.bold
+                });
+                utilities.verifyCSS(chartsBarPage.previewTabBarLabel(), {
+                    'color': css.color.text,
+                    'font-size': css.fontSize.default,
+                    'font-weight': css.fontWeight.semibold
+                });
+                utilities.verifyCSS(chartsBarPage.previewTabYAxisCoordinate(), {
+                    'color': css.color.text,
+                    'font-size': css.fontSize.normal,
+                    'font-weight': css.fontWeight.semibold
+                });
+                utilities.verifyCSS(chartsBarPage.previewTabBarDragHandle().find('svg'), {
+                    'background-color': css.color.defaultBackground
+                });
+                utilities.verifyCSS(chartsBarPage.previewTabBarDragHandle().find('path').eq(1), {
+                    'fill': css.color.secondaryBtn
+                });
+                utilities.verifyCSS(chartsBarPage.previewTabBar().eq(0), {
+                    'background-color': barBackgroundColor[0]
+                });
+                utilities.verifyCSS(chartsBarPage.previewTabBar().eq(1), {
+                    'background-color': barBackgroundColor[1]
+                });
+                utilities.verifyCSS(chartsBarPage.previewTabBar().eq(2), {
+                    'background-color': barBackgroundColor[2]
+                });
+                utilities.verifyCSS(chartsBarPage.previewTabBar().eq(3), {
+                    'background-color': barBackgroundColor[3]
+                });
+                utilities.verifyCSS(chartsBarPage.barLockIcon(), {
+                    'background-color': css.color.defaultBackground,
+                });
+            });
+
+            it('Accessibility of preview tab contents', { tags: 'a11y' }, () => {
+                cy.checkAccessibility(chartsBarPage.previewTabGraphTitle().parents('[class*="ChartsPreviewstyles__PreviewWrapper"]'));
+            });
+        });
+    });
+});

package/cypress/e2e/ILC/DragAndDropIntoCategoriesNew/clickAndDrop.js

@@ -327,7 +327,7 @@ describe('Create Item Page: Drag and drop into categories: Click and drop cases
 
         it('When the user selects a filled option and clicks in the options container, the selected option should get back in the options container', () => {
             dragAndDropIntoCategoriesPage.steps.clickAndDropOptionFromDropzoneToOptionContainerPreviewTab('Eagle', 0);
-            dragAndDropIntoCategoriesPage.steps.verifyDraggableOptionsInOptionsContainerPreviewTab(['Whale', 'Platypus', 'Eagle']);
+            dragAndDropIntoCategoriesPage.steps.verifyDraggableOptionsInOptionsContainerPreviewTab(['Parrot', 'Whale', 'Eagle']);
         });
     });
 

package/cypress/e2e/ILC/DrawingResponse/drawingResponseGradingViewAndCorrectAnswerViewContents.smoke.js

@@ -36,10 +36,9 @@ describe('Create item page - Drawing response: Grading view, Correct answer view
                     .then(($refID) => {
                         itemReferenceID = $refID;
                         cy.visit(`/item-engine/demo/render-item/student-view/${utilities.base64Encoding(itemReferenceID)}`);
-                        drawingResponsePage.steps.selectStudentViewToolbarOption('text');
+                        utilities.verifyElementVisibilityState(drawingResponsePage.studentAndGradingViewDrawingToolbarOption(), 'visible');
+                        drawingResponsePage.steps.selectStudentViewToolbarOption('Curved line');
                         drawingResponsePage.steps.clickOnStudentViewUpperCanvas();
-                        drawingResponsePage.steps.selectPreviewTabSecondaryToolbarOption('Special characters');
-                        drawingResponsePage.steps.selectCustomSpecialCharacter();
                         studentViewPage.steps.submitResponse();
                         studentViewPage.steps.clickOnGoToGradingViewButton();
                     });
@@ -51,11 +50,10 @@ describe('Create item page - Drawing response: Grading view, Correct answer view
                 utilities.verifyElementVisibilityState(drawingResponsePage.questionInstructionsText(), 'visible');
             });
 
-            it('A preview of the canvas along with the selected tools and controls should be displayed. All contents inside the canvas should be in disabled state', () => {
-                for (let index = 0; index < defaultToolbarAndControlOptions.length; index++) {
-                    utilities.verifyElementVisibilityState(drawingResponsePage.studentAndGradingViewDrawingToolbarOption(defaultToolbarAndControlOptions[index]), 'visible');
-                }
-                utilities.verifyElementDisabledClass(drawingResponsePage.drawingToolWrapper())
+            it('A preview of the canvas along with the play button should be displayed and user should be able to click on the play button', () => {
+                utilities.verifyElementVisibilityState(drawingResponsePage.gradingViewPlayFeatureButton(), 'visible');
+                utilities.verifyElementVisibilityState(drawingResponsePage.previewTabLowerCanvas(), 'visible');
+                drawingResponsePage.steps.clickOnPlayButtonInGradingView();
             });
 
             it('Empty score input field and total score should be displayed', () => {