itemengine-cypress-automation 1.0.119 → 1.0.121

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

@@ -0,0 +1,213 @@
+import { fillInTheGapsOverImageDropdownPage } from "../../../pages";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+const css = Cypress.env('css');
+
+const optionsForDropdown = ['Flower', 'Petal', 'Stem', 'Branch'];
+
+describe('Create Item page - Fill in the gaps over image - dropdown: Student view settings', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Randomize options : Edit tab', () => {
+        abortEarlySetup();
+        before(() => {
+            fillInTheGapsOverImageDropdownPage.steps.navigateToCreateQuestion('fill in the gaps over image - dropdown');
+            cy.barsPreLoaderWait();
+            fillInTheGapsOverImageDropdownPage.steps.uploadFile('highlightImage.jpg');
+            fillInTheGapsOverImageDropdownPage.steps.verifyImageIsUploaded();
+            fillInTheGapsOverImageDropdownPage.steps.insertResponseArea(10);
+            fillInTheGapsOverImageDropdownPage.steps.addInputToDropdownOptionFields(0, optionsForDropdown);
+        });
+
+        fillInTheGapsOverImageDropdownPage.tests.verifyStudentViewSettingsLabelAndCSS();
+
+        it('\'Randomize options\' checkbox and label should be displayed and by default it should be unchecked', () => {
+            utilities.verifyInnerText(fillInTheGapsOverImageDropdownPage.randomizeOptionsLabel(), 'Randomize options');
+            utilities.verifyElementVisibilityState(fillInTheGapsOverImageDropdownPage.randomizeOptionsCheckbox(), 'exist');
+            fillInTheGapsOverImageDropdownPage.steps.verifyRandomizeOptionsCheckboxUnchecked();
+        });
+
+        fillInTheGapsOverImageDropdownPage.tests.verifyRandomizeOptionsCheckboxAndLabelUncheckedCSS();
+
+        it('When the \'Randomize options\' functionality is disabled, the options in the specify correct answer section dropdown should be displayed in the order in which the user has set them in the \'Dropdown options\' section', () => {
+            fillInTheGapsOverImageDropdownPage.steps.verifyRandomizeOptionsCheckboxUnchecked();
+            fillInTheGapsOverImageDropdownPage.steps.expandDropdownInSpecifyCorrectAnswerSection(0);
+            fillInTheGapsOverImageDropdownPage.steps.verifyDropdownOptionsSpecifyCorrectAnswer(optionsForDropdown);
+            cy.log('Selecting an option to collapse the dropdown');
+            fillInTheGapsOverImageDropdownPage.steps.selectOptionFromDropdownList(optionsForDropdown[0]);
+        });
+
+        it('When the user enables the \'Randomize options\' functionality, then the options in the specify correct answer section dropdown should be displayed in the order in which the user has set them in the \'Dropdown options\' section', () => {
+            fillInTheGapsOverImageDropdownPage.steps.checkRandomizeOptionsCheckbox();
+            fillInTheGapsOverImageDropdownPage.steps.expandDropdownInSpecifyCorrectAnswerSection(0);
+            fillInTheGapsOverImageDropdownPage.steps.verifyDropdownOptionsSpecifyCorrectAnswer(optionsForDropdown);
+            cy.log('Selecting an option to collapse the dropdown');
+            fillInTheGapsOverImageDropdownPage.steps.selectOptionFromDropdownList(optionsForDropdown[0]);
+        });
+
+        fillInTheGapsOverImageDropdownPage.tests.verifyRandomizeOptionsCheckboxCheckedCSSAndA11y();
+    });
+
+    describe('Randomize options - Functionality: Preview tab', () => {
+        let randomizedOptionsString = '';
+        abortEarlySetup();
+        before(() => {
+            fillInTheGapsOverImageDropdownPage.steps.navigateToCreateQuestion('fill in the gaps over image - dropdown');
+            cy.barsPreLoaderWait();
+            fillInTheGapsOverImageDropdownPage.steps.uploadFile('highlightImage.jpg');
+            fillInTheGapsOverImageDropdownPage.steps.verifyImageIsUploaded();
+            fillInTheGapsOverImageDropdownPage.steps.insertResponseArea(10);
+            fillInTheGapsOverImageDropdownPage.steps.addInputToDropdownOptionFields(0, optionsForDropdown);
+        });
+
+        it('When the \'Randomize options\' functionality is disabled, then the options displayed in the preview tab dropdown should be in the order in which the user has set them in the \'Dropdown options\' section', () => {
+            fillInTheGapsOverImageDropdownPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageDropdownPage.steps.expandDropdownInPreviewTab(0);
+            fillInTheGapsOverImageDropdownPage.steps.verifyDropdownOptionsPreviewTab(optionsForDropdown);
+            cy.log('Selecting an option to collapse the dropdown');
+            fillInTheGapsOverImageDropdownPage.steps.selectOptionFromDropdownList(optionsForDropdown[0]);
+        });
+
+        it('When the user enables the \'Randomize options\' functionality, then the options should be displayed in a random order in the preview tab dropdown', () => {
+            fillInTheGapsOverImageDropdownPage.steps.switchToEditTab();
+            fillInTheGapsOverImageDropdownPage.steps.checkRandomizeOptionsCheckbox();
+            fillInTheGapsOverImageDropdownPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageDropdownPage.steps.expandDropdownInPreviewTab(0);
+            fillInTheGapsOverImageDropdownPage.steps.verifyRandomizeOptionOrder(optionsForDropdown);
+            randomizedOptionsString = fillInTheGapsOverImageDropdownPage.steps.getDropdownOptionsArray();
+            cy.log('Selecting an option to collapse the dropdown');
+            fillInTheGapsOverImageDropdownPage.steps.selectOptionFromDropdownList(optionsForDropdown[0]);
+        });
+
+        it('When the user switches to Edit tab and does not modify any question properties, then the order of the options should not change in the preview tab dropdown', () => {
+            fillInTheGapsOverImageDropdownPage.steps.switchToEditTab();
+            fillInTheGapsOverImageDropdownPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageDropdownPage.steps.expandDropdownInPreviewTab(0);
+            fillInTheGapsOverImageDropdownPage.steps.verifyDropdownOptionsPreviewTab(randomizedOptionsString);
+            cy.log('Selecting an option to collapse the dropdown');
+            fillInTheGapsOverImageDropdownPage.steps.selectOptionFromDropdownList(optionsForDropdown[0]);
+        });
+
+        it('When the user switches to Edit tab and modifies any of question properties, then the order of the options should change in the preview tab dropdown', () => {
+            fillInTheGapsOverImageDropdownPage.steps.switchToEditTab();
+            fillInTheGapsOverImageDropdownPage.steps.allotPoints(5);
+            cy.log('Added wait here to prevent cypress from switching to preview tab just after modifying the question');
+            cy.wait(1000);
+            fillInTheGapsOverImageDropdownPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageDropdownPage.steps.expandDropdownInPreviewTab(0);
+            fillInTheGapsOverImageDropdownPage.steps.verifyRandomizeOptionOrder(optionsForDropdown);
+            fillInTheGapsOverImageDropdownPage.steps.verifyRerandomizedOptionsOrder(randomizedOptionsString);
+            cy.log('Selecting an option to collapse the dropdown');
+            fillInTheGapsOverImageDropdownPage.steps.selectOptionFromDropdownList(optionsForDropdown[0]);
+        });
+
+        it('When the user disables the \'Randomize options\' functionality, then the options should be displayed in the order in which the user has set them in the \'Dropdown options\' section in the preview tab dropdown', () => {
+            fillInTheGapsOverImageDropdownPage.steps.switchToEditTab();
+            fillInTheGapsOverImageDropdownPage.steps.uncheckRandomizeOptionsCheckbox();
+            fillInTheGapsOverImageDropdownPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageDropdownPage.steps.expandDropdownInPreviewTab(0);
+            fillInTheGapsOverImageDropdownPage.steps.verifyDropdownOptionsPreviewTab(optionsForDropdown);
+        });
+    });
+
+    describe('Allow students to check answer: Edit tab', () => {
+        abortEarlySetup();
+        before(() => {
+            fillInTheGapsOverImageDropdownPage.steps.navigateToCreateQuestion('fill in the gaps over image - dropdown');
+            cy.barsPreLoaderWait();
+            fillInTheGapsOverImageDropdownPage.steps.uploadFile('highlightImage.jpg');
+            fillInTheGapsOverImageDropdownPage.steps.verifyImageIsUploaded();
+        });
+
+        fillInTheGapsOverImageDropdownPage.tests.verifyAllowStudentsToCheckAnswerLabelAndCheckboxCSS();
+
+        fillInTheGapsOverImageDropdownPage.tests.verifyMaximumAttemptsDropdownDisplayedWhenAllowStudentsToCheckAnswerIsChecked();
+
+        fillInTheGapsOverImageDropdownPage.tests.verifyMaxCheckAnswerAttemptsDropdown();
+
+        fillInTheGapsOverImageDropdownPage.tests.verifyAllowStudentsToCheckAnswerContentsCSSAndA11y();
+    });
+
+    describe('Allow students to check answer: Preview tab', () => {
+        abortEarlySetup();
+        before(() => {
+            fillInTheGapsOverImageDropdownPage.steps.navigateToCreateQuestion('fill in the gaps over image - dropdown');
+            cy.barsPreLoaderWait();
+            fillInTheGapsOverImageDropdownPage.steps.uploadFile('highlightImage.jpg');
+            fillInTheGapsOverImageDropdownPage.steps.verifyImageIsUploaded();
+            fillInTheGapsOverImageDropdownPage.steps.insertResponseArea(10);
+            fillInTheGapsOverImageDropdownPage.steps.addInputToDropdownOptionFields(0, optionsForDropdown);
+            fillInTheGapsOverImageDropdownPage.steps.selectResponseFromDropdownSpecifyCorrectAnswerSection(0, optionsForDropdown[0]);
+        });
+
+        it('When the user has added options and specified correct answer and points then on checking the \'Allow students to check answer\' checkbox the Check answer button should be displayed in the preview tab', () => {
+            fillInTheGapsOverImageDropdownPage.steps.checkAllowStudentToCheckAnswerCheckbox();
+            fillInTheGapsOverImageDropdownPage.steps.switchToPreviewTab();
+            utilities.verifyInnerText(fillInTheGapsOverImageDropdownPage.checkAnswerButton(), 'Check answer');
+        });
+
+        it('When the user selects an answer in the dropdown and checks the answer then an icon should be displayed beside the selected option and the check answer button should be in enabled state', () => {
+            fillInTheGapsOverImageDropdownPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageDropdownPage.steps.selectResponseFromDropdownInPreviewTab([{ dropdownIndex: 0, dropdownOption: optionsForDropdown[0] }]);
+            fillInTheGapsOverImageDropdownPage.steps.checkAnswer();
+            fillInTheGapsOverImageDropdownPage.steps.verifyCorrectOptionIcon(0);
+            fillInTheGapsOverImageDropdownPage.steps.verifyCheckAnswerButtonEnabled();
+        });
+
+        it('When the user selects an option from the Maximum check answer attempts dropdown then the user should be able to check answer only those many times in the preview tab', () => {
+            fillInTheGapsOverImageDropdownPage.steps.switchToEditTab();
+            fillInTheGapsOverImageDropdownPage.steps.expandMaxCheckAnswerAttemptsDropdown();
+            fillInTheGapsOverImageDropdownPage.steps.selectMaxCheckAnswerAttemptsDropdownListOption('1');
+            fillInTheGapsOverImageDropdownPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageDropdownPage.steps.selectResponseFromDropdownInPreviewTab([{ dropdownIndex: 0, dropdownOption: optionsForDropdown[0] }]);
+            fillInTheGapsOverImageDropdownPage.steps.checkAnswer();
+            fillInTheGapsOverImageDropdownPage.steps.verifyCheckAnswerButtonDisabled();
+        });
+
+        it('When the user reaches maximum check answer attempts, then the \'Check Answer\' button should become disabled', () => {
+            utilities.verifyElementDisabled(fillInTheGapsOverImageDropdownPage.checkAnswerButton());
+        });
+
+        it('CSS of disabled \'Check Answer\' button', { tags: 'css' }, () => {
+            utilities.verifyCSS(fillInTheGapsOverImageDropdownPage.checkAnswerButton(), {
+                'color': css.color.primaryBtnDisabled,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.semibold
+            });
+        });
+
+        it('Accessibility of disabled Check Answer button', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(fillInTheGapsOverImageDropdownPage.checkAnswerButton().parents('.check-answer-and-status-wrapper'));
+        });
+
+        it('When the user updates the value of \'Maximum check answer attempts\' dropdown, it should get reflected on the Preview tab', () => {
+            fillInTheGapsOverImageDropdownPage.steps.switchToEditTab();
+            fillInTheGapsOverImageDropdownPage.steps.expandMaxCheckAnswerAttemptsDropdown();
+            fillInTheGapsOverImageDropdownPage.steps.selectMaxCheckAnswerAttemptsDropdownListOption('3');
+            fillInTheGapsOverImageDropdownPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageDropdownPage.steps.verifyCheckAnswerButtonEnabled();
+            fillInTheGapsOverImageDropdownPage.steps.selectResponseFromDropdownInPreviewTab([{ dropdownIndex: 0, dropdownOption: optionsForDropdown[0] }]);
+            fillInTheGapsOverImageDropdownPage.steps.checkAnswer();
+            fillInTheGapsOverImageDropdownPage.steps.verifyCheckAnswerButtonEnabled();
+        });
+
+        it('When the user selects \'No limit\' option from the dropdown then user should be able to check answer multiple times', () => {
+            fillInTheGapsOverImageDropdownPage.steps.switchToEditTab();
+            fillInTheGapsOverImageDropdownPage.steps.expandMaxCheckAnswerAttemptsDropdown();
+            fillInTheGapsOverImageDropdownPage.steps.selectMaxCheckAnswerAttemptsDropdownListOption('no limit');
+            fillInTheGapsOverImageDropdownPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageDropdownPage.steps.verifyCheckAnswerButtonEnabled();
+            fillInTheGapsOverImageDropdownPage.steps.selectResponseFromDropdownInPreviewTab([{ dropdownIndex: 0, dropdownOption: optionsForDropdown[0] }]);
+            fillInTheGapsOverImageDropdownPage.steps.checkAnswer();
+            fillInTheGapsOverImageDropdownPage.steps.verifyCheckAnswerButtonEnabled();
+            fillInTheGapsOverImageDropdownPage.steps.selectResponseFromDropdownInPreviewTab([{ dropdownIndex: 0, dropdownOption: optionsForDropdown[1] }]);
+            fillInTheGapsOverImageDropdownPage.steps.checkAnswer();
+            fillInTheGapsOverImageDropdownPage.steps.verifyCheckAnswerButtonEnabled();
+            fillInTheGapsOverImageDropdownPage.steps.selectResponseFromDropdownInPreviewTab([{ dropdownIndex: 0, dropdownOption: optionsForDropdown[2] }]);
+            fillInTheGapsOverImageDropdownPage.steps.checkAnswer();
+            fillInTheGapsOverImageDropdownPage.steps.verifyCheckAnswerButtonEnabled();
+        });
+    });
+});

package/cypress/e2e/ILC/FillInTheGapsOverImageTextNew/HeaderSection.js

@@ -59,7 +59,7 @@ describe('Create item page - Fill in the gaps over image - text: Header section
                 fillInTheGapsOverImageTextPage.steps.addTextInQuestionInstructionsInputField('Question instruction');
                 fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
                 fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
-                fillInTheGapsOverImageTextPage.steps.insertResponseArea(30);
+                fillInTheGapsOverImageTextPage.steps.insertResponseArea(10);
                 fillInTheGapsOverImageTextPage.steps.enterAndVerifyImageAlternativeTextInInputField('Image alternative text');
                 fillInTheGapsOverImageTextPage.steps.allotPoints(10);
                 fillInTheGapsOverImageTextPage.steps.verifyErrorMessageIsNotDisplayed();

package/cypress/e2e/ILC/FillInTheGapsOverImageTextNew/Scoring/partialDifferentWeightsBasic.js

@@ -98,7 +98,7 @@ describe('Create item page - Fill in the gaps over image - text: Partial differe
             cy.barsPreLoaderWait();
             fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
             fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
-            fillInTheGapsOverImageTextPage.steps.insertResponseArea(30);
+            fillInTheGapsOverImageTextPage.steps.insertResponseArea(10);
             fillInTheGapsOverImageTextPage.steps.insertResponseArea(40);
             fillInTheGapsOverImageTextPage.steps.insertResponseArea(80);
             fillInTheGapsOverImageTextPage.steps.enterTextInAnswerInputFieldsSpecifyCorrectAnswerSection([{ responseIndex: 0, responseText: 'Flower' }, { responseIndex: 1, responseText: 'Leaf' }, { responseIndex: 2, responseText: 'Stem' }]);
@@ -161,7 +161,7 @@ describe('Create item page - Fill in the gaps over image - text: Partial differe
             cy.barsPreLoaderWait();
             fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
             fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
-            fillInTheGapsOverImageTextPage.steps.insertResponseArea(30);
+            fillInTheGapsOverImageTextPage.steps.insertResponseArea(10);
             fillInTheGapsOverImageTextPage.steps.insertResponseArea(40);
             fillInTheGapsOverImageTextPage.steps.insertResponseArea(60);
             fillInTheGapsOverImageTextPage.steps.insertResponseArea(80);

package/cypress/e2e/ILC/FillInTheGapsOverImageTextNew/Scoring/partialEqualWeightsBasic.js

@@ -99,7 +99,7 @@ describe('Create item page - Fill in the gaps over image with text: Partial equa
             cy.barsPreLoaderWait();
             fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
             fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
-            fillInTheGapsOverImageTextPage.steps.insertResponseArea(30);
+            fillInTheGapsOverImageTextPage.steps.insertResponseArea(10);
             fillInTheGapsOverImageTextPage.steps.insertResponseArea(40);
             fillInTheGapsOverImageTextPage.steps.insertResponseArea(80);
             fillInTheGapsOverImageTextPage.steps.enterTextInAnswerInputFieldsSpecifyCorrectAnswerSection([{ responseIndex: 0, responseText: 'Flower' }, { responseIndex: 1, responseText: 'Leaf' }, { responseIndex: 2, responseText: 'Stem' }]);

package/cypress/e2e/ILC/FillInTheGapsOverImageTextNew/allOrNothingForAllViews.smoke.js

@@ -19,7 +19,7 @@ describe('Create item page - Fill in the gaps over image - text: All or nothing
                 cy.barsPreLoaderWait();
                 fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
                 fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
-                fillInTheGapsOverImageTextPage.steps.insertResponseArea(30);
+                fillInTheGapsOverImageTextPage.steps.insertResponseArea(10);
                 fillInTheGapsOverImageTextPage.steps.insertResponseArea(40);
                 fillInTheGapsOverImageTextPage.steps.insertResponseArea(80);
                 fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
@@ -186,7 +186,7 @@ describe('Create item page - Fill in the gaps over image - text: All or nothing
                 cy.barsPreLoaderWait();
                 fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
                 fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
-                fillInTheGapsOverImageTextPage.steps.insertResponseArea(30);
+                fillInTheGapsOverImageTextPage.steps.insertResponseArea(10);
                 fillInTheGapsOverImageTextPage.steps.insertResponseArea(40);
                 fillInTheGapsOverImageTextPage.steps.insertResponseArea(80);
                 fillInTheGapsOverImageTextPage.steps.allotPoints(20);

package/cypress/e2e/ILC/FillInTheGapsOverImageTextNew/backgroundImageAndCanvasProperties.js

@@ -3,7 +3,7 @@ import utilities from "../../../support/helpers/utilities";
 import abortEarlySetup from "../../../support/helpers/abortEarly";
 const css = Cypress.env('css');
 
-const textContainerPointerStyles = ['None', 'Bottom', 'Bottom right', 'Right', 'Top right', 'Top', 'Top left', 'Left', 'Bottom left'];
+const dropzonePointerStyles = ['none', 'bottom', 'bottom right', 'right', 'top right', 'top', 'top left', 'left', 'bottom left'];
 
 describe('Create item page - Fill in the gaps: Question instructions, Options section', () => {
     before(() => {
@@ -128,6 +128,63 @@ describe('Create item page - Fill in the gaps: Question instructions, Options se
         });
     });
 
+    describe('Canvas : Select text container, Insert text container, Insert text, Undo, Redo and Clear all - Preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image with text');
+            cy.barsPreLoaderWait();
+            fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
+            fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
+        });
+
+        it('When user insert text container in edit tab, then text container should be visible in preview tab', () => {
+            fillInTheGapsOverImageTextPage.steps.insertResponseArea(20);
+            fillInTheGapsOverImageTextPage.steps.insertResponseArea(90);
+            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
+            utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.answerInputFieldPreviewTab(), 'visible');
+        });
+
+        it('When user selects a text container and changes text container pointer style in edit tab, then changes in text container pointer should be reflected in preview tab', () => {
+            fillInTheGapsOverImageTextPage.steps.switchToEditTab();
+            fillInTheGapsOverImageTextPage.steps.selectResponseArea(0);
+            fillInTheGapsOverImageTextPage.steps.selectResponseAreaPointerStyle(textContainerPointerStyles[1]);
+            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageTextPage.steps.verifyTextContainerPointerStyleInPreviewTab(textContainerPointerStyles[1], 0);
+            fillInTheGapsOverImageTextPage.steps.verifyTextContainerPointerStyleInPreviewTab(textContainerPointerStyles[8], 1);
+        });
+
+        it('When user insert text and changes color for text in edit tab, then inserted text should be displayed in canvas in preview tab', () => {
+            fillInTheGapsOverImageTextPage.steps.switchToEditTab();
+            fillInTheGapsOverImageTextPage.steps.insertTextArea(60, 'Inserted text');
+            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageTextPage.steps.verifyTextBoxExistInPreviewTab();
+            fillInTheGapsOverImageTextPage.steps.verifyTextColorOfTextBoxInPreviewTab('rgb(0, 0, 46)');
+            fillInTheGapsOverImageTextPage.steps.verifyTextOfTextBoxInPreviewTab('Inserted text');
+        });
+
+        it('When the user clicks on the undo button in edit tab, then previous action should be reversed and same should reflect in preview tab', () => {
+            fillInTheGapsOverImageTextPage.steps.switchToEditTab();
+            fillInTheGapsOverImageTextPage.steps.undoAction();
+            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageTextPage.steps.verifyTextOfTextBoxInPreviewTab('');
+        });
+
+        it('When the user clicks on the redo button in edit tab, then previous action should be reinstated and same should reflect in preview tab', () => {
+            fillInTheGapsOverImageTextPage.steps.switchToEditTab();
+            fillInTheGapsOverImageTextPage.steps.redoAction();
+            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageTextPage.steps.verifyTextBoxExistInPreviewTab();
+        });
+
+        it('When user clicks on \'Clear all\' button, then all text containers should be deleted in preview tab', () => {
+            fillInTheGapsOverImageTextPage.steps.switchToEditTab();
+            fillInTheGapsOverImageTextPage.steps.clearAll();
+            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageTextPage.steps.verifyTextBoxNotExistInPreviewTab();
+            fillInTheGapsOverImageTextPage.steps.verifyTextContainerNotExistInPreviewTab();
+        });
+    });
+
     describe('Canvas : Select text container -  Edit tab canvas section functionality', () => {
         abortEarlySetup();
         before(() => {
@@ -244,63 +301,6 @@ describe('Create item page - Fill in the gaps: Question instructions, Options se
         });
     });
 
-    describe('Canvas : Select text container, Insert text container, Insert text, Undo, Redo and Clear all - Preview tab functionality', () => {
-        abortEarlySetup();
-        before(() => {
-            fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image with text');
-            cy.barsPreLoaderWait();
-            fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
-            fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
-        });
-
-        it('When user insert text container in edit tab, then text container should be visible in preview tab', () => {
-            fillInTheGapsOverImageTextPage.steps.insertResponseArea(20);
-            fillInTheGapsOverImageTextPage.steps.insertResponseArea(90);
-            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
-            utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.answerInputFieldPreviewTab(), 'visible');
-        });
-
-        it('When user selects a text container and changes text container pointer style in edit tab, then changes in text container pointer should be reflected in preview tab', () => {
-            fillInTheGapsOverImageTextPage.steps.switchToEditTab();
-            fillInTheGapsOverImageTextPage.steps.selectResponseArea(0);
-            fillInTheGapsOverImageTextPage.steps.selectResponseAreaPointerStyle(textContainerPointerStyles[1]);
-            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
-            fillInTheGapsOverImageTextPage.steps.verifyTextContainerPointerStyleInPreviewTab(textContainerPointerStyles[1], 0);
-            fillInTheGapsOverImageTextPage.steps.verifyTextContainerPointerStyleInPreviewTab(textContainerPointerStyles[8], 1);
-        });
-
-        it('When user insert text and changes color for text in edit tab, then inserted text should be displayed in canvas in preview tab', () => {
-            fillInTheGapsOverImageTextPage.steps.switchToEditTab();
-            fillInTheGapsOverImageTextPage.steps.insertTextArea(60, 'Inserted text');
-            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
-            fillInTheGapsOverImageTextPage.steps.verifyTextBoxExistInPreviewTab();
-            fillInTheGapsOverImageTextPage.steps.verifyTextColorOfTextBoxInPreviewTab('rgb(0, 0, 46)');
-            fillInTheGapsOverImageTextPage.steps.verifyTextOfTextBoxInPreviewTab('Inserted text');
-        });
-
-        it('When the user clicks on the undo button in edit tab, then previous action should be reversed and same should reflect in preview tab', () => {
-            fillInTheGapsOverImageTextPage.steps.switchToEditTab();
-            fillInTheGapsOverImageTextPage.steps.undoAction();
-            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
-            fillInTheGapsOverImageTextPage.steps.verifyTextOfTextBoxInPreviewTab('');
-        });
-
-        it('When the user clicks on the redo button in edit tab, then previous action should be reinstated and same should reflect in preview tab', () => {
-            fillInTheGapsOverImageTextPage.steps.switchToEditTab();
-            fillInTheGapsOverImageTextPage.steps.redoAction();
-            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
-            fillInTheGapsOverImageTextPage.steps.verifyTextBoxExistInPreviewTab();
-        });
-
-        it('When user clicks on \'Clear all\' button, then all text containers should be deleted in preview tab', () => {
-            fillInTheGapsOverImageTextPage.steps.switchToEditTab();
-            fillInTheGapsOverImageTextPage.steps.clearAll();
-            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
-            fillInTheGapsOverImageTextPage.steps.verifyTextBoxNotExistInPreviewTab();
-            fillInTheGapsOverImageTextPage.steps.verifyTextContainerNotExistInPreviewTab();
-        });
-    });
-
     describe('Image properties section - Edit tab', () => {
         abortEarlySetup();
         before(() => {
@@ -331,7 +331,7 @@ describe('Create item page - Fill in the gaps: Question instructions, Options se
         fillInTheGapsOverImageTextPage.tests.verifyFillImageToCanvasEditTabFunctionality();
     });
 
-    describe('Canvas width, Canvas height, Image alternative text -  Edit tab canvas section functionality', () => {
+    describe('Image properties, Image alignment, Opacity section - Preview tab functionality', () => {
         abortEarlySetup();
         before(() => {
             fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image with text');
@@ -341,12 +341,15 @@ describe('Create item page - Fill in the gaps: Question instructions, Options se
             fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
         });
 
-        fillInTheGapsOverImageTextPage.tests.verifyAspectRatioAndResetDimensionsButtonFunctionality();
+        fillInTheGapsOverImageTextPage.tests.verifyImageAlignmentPreviewTabFunctionality();
 
-        fillInTheGapsOverImageTextPage.tests.verifyImageAlternativeTextEditTabFunctionality();
-    });
+        fillInTheGapsOverImageTextPage.tests.verifyImageOpacityPreviewTabFunctionality();
 
-    describe('Image properties, Image alignment, Opacity section - Preview tab functionality', () => {
+        //failed due to https://redmine.zeuslearning.com/issues/560585
+        fillInTheGapsOverImageTextPage.tests.verifyFillImageToCanvasPreviewTabFunctionality();
+    });
+    
+    describe('Canvas width, Canvas height, Image alternative text -  Edit tab canvas section functionality', () => {
         abortEarlySetup();
         before(() => {
             fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image with text');
@@ -356,12 +359,9 @@ describe('Create item page - Fill in the gaps: Question instructions, Options se
             fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
         });
 
-        fillInTheGapsOverImageTextPage.tests.verifyImageAlignmentPreviewTabFunctionality();
-
-        fillInTheGapsOverImageTextPage.tests.verifyImageOpacityPreviewTabFunctionality();
+        fillInTheGapsOverImageTextPage.tests.verifyAspectRatioAndResetDimensionsButtonFunctionality();
 
-        //failed due to https://redmine.zeuslearning.com/issues/560585
-        fillInTheGapsOverImageTextPage.tests.verifyFillImageToCanvasPreviewTabFunctionality();
+        fillInTheGapsOverImageTextPage.tests.verifyImageAlternativeTextEditTabFunctionality();
     });
 
     describe('Canvas width, Canvas height, Image alternative text - Preview tab functionality', () => {

package/cypress/e2e/ILC/FillInTheGapsOverImageTextNew/editTabScoringSection.js

@@ -41,7 +41,7 @@ describe('Create item page - Fill in the gaps over image: Scoring section', () =
             cy.barsPreLoaderWait();
             fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
             fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
-            fillInTheGapsOverImageTextPage.steps.insertResponseArea(30);
+            fillInTheGapsOverImageTextPage.steps.insertResponseArea(10);
             fillInTheGapsOverImageTextPage.steps.insertResponseArea(40);
         });
 
@@ -57,7 +57,7 @@ describe('Create item page - Fill in the gaps over image: Scoring section', () =
             cy.barsPreLoaderWait();
             fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
             fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
-            fillInTheGapsOverImageTextPage.steps.insertResponseArea(30);
+            fillInTheGapsOverImageTextPage.steps.insertResponseArea(10);
             fillInTheGapsOverImageTextPage.steps.insertResponseArea(40);
         });
 
@@ -80,7 +80,7 @@ describe('Create item page - Fill in the gaps over image: Scoring section', () =
             cy.barsPreLoaderWait();
             fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
             fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
-            fillInTheGapsOverImageTextPage.steps.insertResponseArea(30);
+            fillInTheGapsOverImageTextPage.steps.insertResponseArea(10);
             fillInTheGapsOverImageTextPage.steps.insertResponseArea(40);
             fillInTheGapsOverImageTextPage.steps.selectAutoScoredScoringSubtype('Partial equal weights');
         });
@@ -151,7 +151,7 @@ describe('Create item page - Fill in the gaps over image: Scoring section', () =
             cy.barsPreLoaderWait();
             fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
             fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
-            fillInTheGapsOverImageTextPage.steps.insertResponseArea(30);
+            fillInTheGapsOverImageTextPage.steps.insertResponseArea(10);
             fillInTheGapsOverImageTextPage.steps.insertResponseArea(40);
         });
 
@@ -174,7 +174,7 @@ describe('Create item page - Fill in the gaps over image: Scoring section', () =
             cy.barsPreLoaderWait();
             fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
             fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
-            fillInTheGapsOverImageTextPage.steps.insertResponseArea(30);
+            fillInTheGapsOverImageTextPage.steps.insertResponseArea(10);
             fillInTheGapsOverImageTextPage.steps.insertResponseArea(40);
             fillInTheGapsOverImageTextPage.steps.selectAutoScoredScoringSubtype('Partial different weights');
         });
@@ -268,7 +268,7 @@ describe('Create item page - Fill in the gaps over image: Scoring section', () =
             cy.barsPreLoaderWait();
             fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
             fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
-            fillInTheGapsOverImageTextPage.steps.insertResponseArea(30);
+            fillInTheGapsOverImageTextPage.steps.insertResponseArea(10);
             fillInTheGapsOverImageTextPage.steps.insertResponseArea(40);
             fillInTheGapsOverImageTextPage.steps.expandScoringTypeDropdown();
             fillInTheGapsOverImageTextPage.steps.selectOptionFromScoringTypeDropdown('Non scored');

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

@@ -21,7 +21,7 @@ describe('Create item page - Fill in the gaps over image - text - Preview conten
                         fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
                         fillInTheGapsOverImageTextPage.steps.allotPoints(10);
                         fillInTheGapsOverImageTextPage.steps.verifyImageIsUploaded();
-                        fillInTheGapsOverImageTextPage.steps.insertResponseArea(30);
+                        fillInTheGapsOverImageTextPage.steps.insertResponseArea(10);
                         fillInTheGapsOverImageTextPage.steps.insertResponseArea(60);
                         fillInTheGapsOverImageTextPage.steps.insertResponseArea(80);
                         fillInTheGapsOverImageTextPage.steps.selectAcceptedStudentInputType(1, 'Number');