itemengine-cypress-automation 1.0.131-updateILCrepo6March-02c78d1.0 → 1.0.132

package/cypress/pages/components/responseAreaSettingsPopupComponent.js

@@ -0,0 +1,74 @@
+const selectors = {
+    responseAreaSettingsWidthLabel: () => cy.get('[class*="InputNumberFieldstyle__NumberFieldWrapper"] .input-label-fields').eq(0),
+    responseAreaSettingsWidthInputField: () => cy.get('[class*="InputNumberFieldstyle__NumberFieldWrapper"] input').eq(0),
+    responseAreaSettingsHeightLabel: () => cy.get('[class*="InputNumberFieldstyle__NumberFieldWrapper"] .input-label-fields').eq(1),
+    responseAreaSettingsHeightInputField: () => cy.get('[class*="InputNumberFieldstyle__NumberFieldWrapper"] input').eq(1),
+    responseAreaSettingsCancelButton: () => cy.get('[class*="ResponseSettingsPopupstyles__PopupActionButtons"] button').eq(0),
+    responseAreaSettingsOkButton: () => cy.get('[class*="ResponseSettingsPopupstyles__PopupActionButtons"] button').eq(1),
+}
+
+const steps = {
+    /**
+     * Verify response area settings width input field value
+     * @param {number} width Value of width input field in response area settings popup
+     */
+    verifyResponseAreaSettingsWidthInputFieldValue: (width) => {
+        responseAreaSettingsPopupComponent.responseAreaSettingsWidthInputField()
+            .should('have.value', width);
+    },
+
+    verifyMinimumValueOfWidthAndHeightInputFields: () => {
+        responseAreaSettingsPopupComponent.responseAreaSettingsWidthInputField()
+            .parent()
+            .should('have.attr', 'minallowed', '80');
+        responseAreaSettingsPopupComponent.responseAreaSettingsHeightInputField()
+            .parent()
+            .should('have.attr', 'minallowed', '32');
+    },
+
+    /**
+     * Verify response area settings height input field value
+     * @param {number} height Value of height input field in response area settings popup
+     */
+    verifyResponseAreaSettingsHeightInputFieldValue: (height) => {
+        responseAreaSettingsPopupComponent.responseAreaSettingsHeightInputField()
+            .should('have.value', height)
+    },
+
+    clickOnResponseAreaSettingsCancelButton: () => {
+        responseAreaSettingsPopupComponent.responseAreaSettingsCancelButton()
+            .click();
+    },
+
+    clickOnResponseAreaSettingsOkButton: () => {
+        responseAreaSettingsPopupComponent.responseAreaSettingsOkButton()
+            .click();
+    },
+
+    /**
+    * @description Add input to width input field
+    * @param {number} width Input to be given to width input field
+    */
+    addInputToWidthInputField: (width) => {
+        responseAreaSettingsPopupComponent.responseAreaSettingsWidthInputField()
+            .clear()
+            .type(width)
+            .blur();
+    },
+
+    /**
+    * @description Add input to height input field
+    * @param {number} height Input to be given to height input field
+    */
+    addInputToHeightInputField: (height) => {
+        responseAreaSettingsPopupComponent.responseAreaSettingsHeightInputField()
+            .clear()
+            .type(height)
+            .blur();
+    },
+}
+
+export const responseAreaSettingsPopupComponent = {
+    ...selectors,
+    steps
+}

package/cypress/pages/drawingResponsePage.js

@@ -356,7 +356,7 @@ const steps = {
     verifySelectedColorLabelAndSelectedColorBlock: () => {
         utilities.verifyInnerText(drawingResponsePage.colorPalleteSelectedColorLabel(), 'Selected color');
         utilities.verifyElementVisibilityState(drawingResponsePage.colorPalleteSelectedColorLabel(), 'visible');
-        utilities.verifyElementVisibilityState(drawingResponsePage.colorPalleteSelectedColorBlock(), 'visible');
+        utilities.verifyElementVisibilityState(drawingResponsePage.colorPalleteSelectedColorBlock(), 'exist');
     },
 
     /**

package/cypress/pages/fillInTheGapsDragAndDropPage.js

@@ -1,7 +1,7 @@
 import constants from "../fixtures/constants";
 import utilities from "../support/helpers/utilities";
 const css = Cypress.env('css');
-import { createQuestionBasePage, optionsWrapperComponent, autoScoredScoringPreviewTab, scoringSectionBaseEditTab, questionInputFieldComponent, fillInTheGapsDragAndDropCommonComponents, correctIncorrectAnswerLabelComponent, questionInstructionsComponent, autoScoredStudentViewSettings, ckEditorToolbar, equationEditorFlyout, draggableOptionContainer, autoScoredScoringSectionMultiResponseType, autoScoredSpecifyCorrectAnswerSection, commonComponents, draggableOptionsSectionComponent } from "./components"
+import { createQuestionBasePage, optionsWrapperComponent, autoScoredScoringPreviewTab, scoringSectionBaseEditTab, questionInputFieldComponent, fillInTheGapsDragAndDropCommonComponents, correctIncorrectAnswerLabelComponent, questionInstructionsComponent, autoScoredStudentViewSettings, ckEditorToolbar, equationEditorFlyout, draggableOptionContainer, autoScoredScoringSectionMultiResponseType, autoScoredSpecifyCorrectAnswerSection, commonComponents, draggableOptionsSectionComponent, studentViewSettingsLabelComponent, randomizeOptionsComponent, enableOuterBorderComponent, allowMultipleInstancesOfSameDraggableOptionComponent, additionalSettingsPanel, responseAreaSettingsPopupComponent } from "./components"
 
 //TODO update option container selectors when https://redmine.zeuslearning.com/issues/563159 is resolved
 const selectors = {
@@ -16,23 +16,39 @@ const selectors = {
     ...commonComponents,
     ...autoScoredScoringPreviewTab,
     ...correctIncorrectAnswerLabelComponent,
-
+    ...randomizeOptionsComponent,
+    ...enableOuterBorderComponent,
+    ...responseAreaSettingsPopupComponent,
+    ...additionalSettingsPanel,
+    //Dropzone settings popup
+    dropzoneSettingsWordWrapLabel: () => cy.get('[data-ngie-testid="word-wrap-checkbox"] [class*="label"]'),
+    dropzoneSettingsWordWrapCheckbox: () => cy.get('[data-ngie-testid="word-wrap-checkbox"] input'),
+    dropzoneSettingsSetForAllDropzoneLabel: () => cy.get('[data-ngie-testid="set-for-all-dropzones-checkbox"] [class*="label"]'),
+    dropzoneSettingsSetForAllDropzoneCheckbox: () => cy.get('[data-ngie-testid="set-for-all-dropzones-checkbox"] input'),
     //Specify correct answer section
     dropzoneSpecifyCorrectAnswerSection: () => cy.get('[class="droppable-area"] [role="button"]'),
     optionContainerOptionsSpecifyCorrectAnswerSection: () => cy.get('.draggable-selected-item'),
     optionsContainerSpecifyCorrectAnswerSection: () => cy.get('.draggable-wrapper'), addAlternateButtonSpecifyCorrectAnswer: () => cy.get('.alternate-option-btn-wrapper button'),
+    selectedAlternateAnswerCountSpecifyCorrectAnswer: () => cy.get('.selected-option-wrapper'),
     alternateAnswerPopup: () => cy.get('.alternate-option-popup-wrapper'),
-    alternateAnswerPopupOptionContainer: () => cy.get('.option-container'),
-    alternateAnswerPopupSaveButton: () => cy.get('[class*="AlternateOptionstyle__ButtonWrapper"] .ngie-button').eq(1),
-
+    alternateAnswerPopupTitle: () => cy.get('.alternate-option-title-wrapper div').eq(0),
+    alternateAnswerPopupHelpText: () => cy.get('.alternate-option-title-wrapper div').eq(1),
+    alternateAnswerPopupOptions: () => cy.get('.option-container'),
+    alternateAnswerPopupCancelButton: () => cy.get('[class*="AlternateOptionstyle__ButtonWrapper"] button').eq(0),
+    alternateAnswerPopupSaveButton: () => cy.get('[class*="AlternateOptionstyle__ButtonWrapper"] button').eq(1),
     //Preview tab
+    questionBorderPreviewTab: () => cy.get('[class*="ClozeWithDragAndDropstyles__WrapperDiv"]'),
     optionPreviewTab: () => cy.get('.draggable-selected-item'),
     questionContainerPreviewTab: () => cy.get('.question-item-container'),
     dropzonePreviewTab: () => cy.get('[class*="DroppableHotspotstyle__DroppableHotspotWrapper"]'),
     dropzoneContainerPreviewTab: () => cy.get('.answer-status-response-preview-wrapper'),
     optionContainerOptionsPreviewTab: () => cy.get('.no-split-pane-wrapper .draggable-selected-item'),
     dropzoneWrapperPreviewTab: () => cy.get('.label-image-with-dnd-canvas-wrapper .cell'),
-    dropzoneNumeration: () => cy.get('[class*="DroppableHotspotstyle__NumerationDiv"]')
+    dropzoneNumeration: () => cy.get('[class*="DroppableHotspotstyle__NumerationDiv"]'),
+    //Additional settings
+    accessibilityLabel: () => cy.get('[class*="Accessibilitystyles__AccessibilityLabelWrapper"]'),
+    flagNonAccessibleCheckbox: () => cy.get('[data-ngie-testid="response-option-checkbox"] input'),
+    flagNonAccessibleLabel: () => cy.get('[data-ngie-testid="response-option-checkbox"] .MuiFormControlLabel-label')
 }
 
 const steps = {
@@ -52,7 +68,11 @@ const steps = {
     ...draggableOptionsSectionComponent.steps,
     ...draggableOptionContainer.steps,
     ...commonComponents.steps,
-
+    ...randomizeOptionsComponent.steps,
+    ...enableOuterBorderComponent.steps,
+    ...allowMultipleInstancesOfSameDraggableOptionComponent.steps,
+    ...additionalSettingsPanel.steps,
+    ...responseAreaSettingsPopupComponent.steps,
     /**
      * Sets options in dropzone in the Preview Tab based on the provided optionsObject.
      * @param {Object} optionsObject - An object where keys are option texts and values are dropzone indices.
@@ -239,23 +259,6 @@ const steps = {
             .click();
     },
 
-    setGroupedOptions: () => {
-        let flowers = [['Flower', 'Petals', 'Seed', 'Pollen'],
-        ['Leaflet', 'Leaves', 'Leaf', 'Green'],
-        ['Stem', 'Branch', 'Trunk', 'Tree'],
-        ['Rose', 'Lily', 'Orchid', 'Petals']
-        ];
-        let groupTitles = ['Group A', 'Group B', 'Group C', 'Group D'];
-        draggableOptionsSectionComponent.steps.expandDraggableOptionsLayoutDropdown()
-        draggableOptionsSectionComponent.steps.selectOptionFromDraggableOptionsLayoutDropdown('Grouped')
-        draggableOptionsSectionComponent.steps.addGroupTitle(groupTitles[0]);
-        optionsWrapperComponent.steps.addMultipleOptionFields(2);
-        optionsWrapperComponent.steps.addInputToOptionsInputField(flowers[0]);
-        draggableOptionsSectionComponent.steps.addGroupWithTitleAndOptionsInDraggableOptionsSection(groupTitles[1], flowers[1]);
-        draggableOptionsSectionComponent.steps.addGroupWithTitleAndOptionsInDraggableOptionsSection(groupTitles[2], flowers[2]);
-        draggableOptionsSectionComponent.steps.addGroupWithTitleAndOptionsInDraggableOptionsSection(groupTitles[3], flowers[3]);
-    },
-
     /**
   * Sets options in dropzone in the Preview Tab based on the provided optionsObject.
   * @param {Object[]} responses - An array of objects containing the responseIndex, responseText and dropzone index
@@ -287,6 +290,83 @@ const steps = {
             .click();
     },
 
+    /**
+    * @description Verify alternate button for a dropzone in specify correct answer section
+    * @param {number} dropzoneIndex Index of dropzone
+    */
+    verifyDefaultAddAlternateAnswerButtonIsDisplayed: (dropzoneIndex) => {
+        utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzoneSpecifyCorrectAnswerSection(), dropzoneIndex)
+            .parents('.authoring-response-wrapper')
+            .within(() => {
+                utilities.verifyElementVisibilityState(fillInTheGapsDragAndDropPage.addAlternateButtonSpecifyCorrectAnswer(), 'visible');
+                utilities.verifyElementDisabled(fillInTheGapsDragAndDropPage.addAlternateButtonSpecifyCorrectAnswer());
+            });
+    },
+
+    /**
+    * @description Verify dropzone's alternate answer popup options
+    * @param {string[]} optionsArray Array of options in dropzone's alternate answer popup
+    */
+    verifyDropzoneAlternateAnswerPopupOptions: (optionsArray) => {
+        optionsArray.forEach((option, index) => {
+            utilities.verifyInnerText(utilities.getNthElement(fillInTheGapsDragAndDropPage.alternateAnswerPopupOptions(), index), option);
+        });
+    },
+
+    /**     
+    * @description select alternate answers for a dropzone in its alternate answer popup
+    * @param {string[]} alternateAnswerArray Array of options to be selected as alternate answer
+    */
+    selectAlternateAnswerInAlternateAnswerPopup: (alternateAnswerArray) => {
+        alternateAnswerArray.forEach((alternateAnswer) => {
+            fillInTheGapsDragAndDropPage.alternateAnswerPopupOptions()
+                .contains(alternateAnswer)
+                .click();
+            fillInTheGapsDragAndDropPage.alternateAnswerPopupOptions()
+                .contains(alternateAnswer)
+                .parent()
+                .should('have.class', 'selected');
+        });
+    },
+
+    /**     
+    * @description deselect alternate answers for a dropzone in its alternate answer popup
+    * @param {string[]} alternateAnswerArray Array of options to be deselected
+    */
+    deselectAlternateAnswerInAlternateAnswerPopup: (alternateAnswerArray) => {
+        alternateAnswerArray.forEach((alternateAnswer) => {
+            fillInTheGapsDragAndDropPage.alternateAnswerPopupOptions()
+                .contains(alternateAnswer)
+                .click();
+            fillInTheGapsDragAndDropPage.alternateAnswerPopupOptions()
+                .contains(alternateAnswer)
+                .parent()
+                .should('not.have.class', 'selected');
+        });
+    },
+
+    saveSelectedAlternateAnswers: () => {
+        fillInTheGapsDragAndDropPage.alternateAnswerPopupSaveButton()
+            .click();
+    },
+
+    CancelDropzoneAlternateAnswersPopup: () => {
+        fillInTheGapsDragAndDropPage.alternateAnswerPopupCancelButton()
+            .click();
+    },
+
+    /**
+     * @description Set alternate answers for a dropzone
+     * @param {number} dropzoneIndex Index of dropzone
+     * @param {string[]} alternateAnswerArray Array of options to be selected as alternate answer
+     */
+    setResponseLevelAlternateAnswer: (dropzoneIndex, alternateAnswerArray) => {
+        fillInTheGapsDragAndDropPage.steps.clickOnAddAlternateButton(dropzoneIndex);
+        fillInTheGapsDragAndDropPage.steps.selectAlternateAnswerInAlternateAnswerPopup(alternateAnswerArray);
+        fillInTheGapsDragAndDropPage.steps.saveSelectedAlternateAnswers();
+        utilities.verifyElementVisibilityState(fillInTheGapsDragAndDropPage.alternateAnswerPopup(), 'notExist');
+    },
+
     /**
     * @description Verifies the text content of a specific preview tab dropzone element.
     * @param {number} count - The index of the preview tab dropzone element to verify (zero-based).
@@ -310,7 +390,8 @@ const steps = {
             .eq(dropzoneIndex)
             .within(() => {
                 responseArray.forEach((response, count) => {
-                    draggableOptionContainer.draggableOption()
+                    cy.get('.item-content-container')
+                        // draggableOptionContainer.draggableOption()
                         .eq(count)
                         .verifyInnerText(response);
                 });
@@ -318,8 +399,8 @@ const steps = {
     },
 
     /**
-   * @param {number} responseAreaIndex Index of the stem response area in set correct answer section
-   * @description Verify drag handle is not visible in filled category cell in preview tab
+   * @param {number} responseAreaIndex Index of the dropzone in specify correct answer section
+   * @description Verify drag handle is not visible in filled category cell in specify correct answer section
    */
     verifyDragHandleNotVisibleInFilledDropzoneOfSpecifyCorrectAnswerSection: (responseAreaIndex) => {
         fillInTheGapsDragAndDropPage.dropzoneSpecifyCorrectAnswerSection()
@@ -368,13 +449,13 @@ const steps = {
             .eq(dropzoneIndex)
             .within(() => {
                 responseArray.forEach((response, count) => {
-                    utilities.verifyInnerText(utilities.getNthElement(draggableOptionContainer.draggableOption(), count), response);
+                    utilities.verifyInnerText(utilities.getNthElement(cy.get('.item-content-container'), count), response);
                 });
             });
     },
 
     /**
-    * @param {number} responseAreaIndex Index of the stem response area in set correct answer section
+    * @param {number} responseAreaIndex Index of the dropzone in preview tab
     * @description Verify drag handle is not visible in filled category cell in preview tab
     */
     verifyDragHandleNotVisibleInFilledDropzoneOfPreviewTab: (responseAreaIndex) => {
@@ -425,6 +506,205 @@ const steps = {
                 });
             });
     },
+
+    verifyQuestionBorderNotExist: () => {
+        fillInTheGapsDragAndDropPage.questionBorderPreviewTab()
+            .should('have.css', 'border')
+            .and('match', /0px none/);
+    },
+
+    clickAndDropOptionInOptionsContainerInPreviewTab: (optionText) => {
+        fillInTheGapsDragAndDropPage.dropzonePreviewTab()
+            .contains(optionText)
+            .click();
+        fillInTheGapsDragAndDropPage.optionsContainerPreviewTab()
+            .click({ force: true });
+    },
+
+    verifyWordWrapCheckboxUnchecked: () => {
+        fillInTheGapsDragAndDropPage.dropzoneSettingsWordWrapCheckbox()
+            .should('not.be.checked');
+    },
+
+    verifyWordWrapCheckboxChecked: () => {
+        fillInTheGapsDragAndDropPage.dropzoneSettingsWordWrapCheckbox()
+            .should('be.checked');
+    },
+
+    verifySetForAllDropzoneCheckboxChecked: () => {
+        fillInTheGapsDragAndDropPage.dropzoneSettingsSetForAllDropzoneCheckbox()
+            .should('be.checked');
+    },
+
+    verifySetForAllDropzoneCheckboxUnchecked: () => {
+        fillInTheGapsDragAndDropPage.dropzoneSettingsSetForAllDropzoneCheckbox()
+            .should('not.be.checked');
+    },
+
+    checkWordWrappedCheckbox: () => {
+        fillInTheGapsDragAndDropPage.dropzoneSettingsWordWrapCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    uncheckWordWrappedCheckbox: () => {
+        fillInTheGapsDragAndDropPage.dropzoneSettingsWordWrapCheckbox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    uncheckSetForAllDropzoneCheckbox: () => {
+        fillInTheGapsDragAndDropPage.dropzoneSettingsSetForAllDropzoneCheckbox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    checkSetForAllDropzoneCheckbox: () => {
+        fillInTheGapsDragAndDropPage.dropzoneSettingsSetForAllDropzoneCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    /**
+     * @description Verify width of dropzone in specify correct answer section
+     * @param {number} dropzoneIndex index of dropzone
+     * @param {string} width Width of dropzone in px
+     */
+    verifyDropzoneWidthSpecifyCorrectAnswerSection: (dropzoneIndex, width) => {
+        utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzoneSpecifyCorrectAnswerSection(), dropzoneIndex)
+            .should('have.css', 'width', width);
+    },
+
+    /**
+     * @description Verify height of dropzone in specify correct answer section
+     * @param {number} dropzoneIndex index of dropzone
+     * @param {string} height Height of dropzone in px
+     */
+    verifyDropzoneHeightSpecifyCorrectAnswerSection: (dropzoneIndex, height) => {
+        utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzoneSpecifyCorrectAnswerSection(), dropzoneIndex)
+            .should('have.css', 'height', height);
+    },
+
+    /**
+     * @description Verify width of dropzone in preview tab
+     * @param {number} dropzoneIndex index of dropzone
+     * @param {string} width Width of dropzone in px
+     */
+    verifyDropzoneWidthPreviewTab: (dropzoneIndex, width) => {
+        utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzonePreviewTab(), dropzoneIndex)
+            .should('have.css', 'width', width);
+    },
+
+    /**
+     * @description Verify height of dropzone in preview tab
+     * @param {number} dropzoneIndex index of dropzone
+     * @param {string} height Height of dropzone in px
+     */
+    verifyDropzoneHeightPreviewTab: (dropzoneIndex, height) => {
+        utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzonePreviewTab(), dropzoneIndex)
+            .should('have.css', 'height', height);
+    },
+
+    /**
+     * @description Verify dropped option is not word-wrapped in dropzone specify correct answer section
+     * @param {number} dropzoneIndex Index of dropzone in specify correct answer section
+     */
+    verifyOptionTextNotWordWrappedInDropzoneSpecifyCorrectAnswerSection: (dropzoneIndex) => {
+        utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzoneSpecifyCorrectAnswerSection(), dropzoneIndex)
+            .find('.item-content-container')
+            .should('not.have.class', 'word-wrap');
+    },
+
+    /**
+     * @description Verify dropped option is word-wrapped in dropzone specify correct answer section
+     * @param {number} dropzoneIndex Index of dropzone in specify correct answer section
+     */
+    verifyOptionTextIsWordWrappedInDropzoneSpecifyCorrectAnswerSection: (dropzoneIndex) => {
+        utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzoneSpecifyCorrectAnswerSection(), dropzoneIndex)
+            .find('.item-content-container')
+            .should('have.class', 'word-wrap');
+    },
+
+    verifyDropzoneHeightWhenLongTextIsDroppedInSpecifyCorrectAnswerSection: () => {
+        let originalDropzoneHeight
+        utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzoneSpecifyCorrectAnswerSection(), 1)
+            .then(($originalDropzoneHeight) => {
+                originalDropzoneHeight = $originalDropzoneHeight.height(); //Storing original dropzone width
+            });
+        fillInTheGapsDragAndDropPage.steps.clickAndDropOptionInDropzoneSpecifyCorrectAnswerSection({ 'Leaves grow on the branches of a plant which in turn grow on the stem': 1 });
+        utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzoneSpecifyCorrectAnswerSection(), 1)
+            .then(($modifiedDropzoneHeight) => {
+                let modifiedDropzoneHeight = $modifiedDropzoneHeight.height(); //Storing modified dropzone width
+                expect(modifiedDropzoneHeight).to.be.gt(originalDropzoneHeight);
+            });
+    },
+
+    /**
+     * @description Verify dropped option is not word-wrapped in dropzone preview tab
+     * @param {number} dropzoneIndex Index of dropzone in preview tab
+     */
+    verifyOptionTextNotWordWrappedInDropzonePreviewTab: (dropzoneIndex) => {
+        utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzonePreviewTab(), dropzoneIndex)
+            .find('.item-content-container')
+            .should('not.have.class', 'word-wrap');
+    },
+
+    /**
+     * @description Verify dropped option is word-wrapped in dropzone preview tab
+     * @param {number} dropzoneIndex Index of dropzone in preview tab
+     */
+    verifyOptionTextIsWordWrappedInDropzonePreviewTab: (dropzoneIndex) => {
+        utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzonePreviewTab(), dropzoneIndex)
+            .find('.item-content-container')
+            .should('have.class', 'word-wrap');
+    },
+
+    verifyDropzoneHeightWhenLongTextIsDroppedInPreviewTab: () => {
+        let originalDropzoneHeight
+        utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzonePreviewTab(), 1)
+            .then(($originalDropzoneHeight) => {
+                originalDropzoneHeight = $originalDropzoneHeight.height(); //Storing original dropzone width
+            });
+        fillInTheGapsDragAndDropPage.steps.clickAndDropOptionInDropzonePreviewTab({ 'Leaves grow on the branches of a plant which in turn grow on the stem': 1 });
+        utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzonePreviewTab(), 1)
+            .then(($modifiedDropzoneHeight) => {
+                let modifiedDropzoneHeight = $modifiedDropzoneHeight.height(); //Storing modified dropzone width
+                expect(modifiedDropzoneHeight).to.be.gt(originalDropzoneHeight);
+            });
+    },
+
+    verifyFlagThisItemNonAccessibleCheckboxIsUnchecked: () => {
+        fillInTheGapsDragAndDropPage.flagNonAccessibleCheckbox()
+            .should('not.be.checked');
+    },
+
+    checkFlagThisItemNonAccessibleCheckbox: () => {
+        fillInTheGapsDragAndDropPage.flagNonAccessibleCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    /**
+     * @description Verify tooltip text in dropzone option specify correct answer section
+     * @param {number} dropzoneIndex Index of dropzone in specify correct answer section
+     * @param {string} tooltip Tooltip text
+     */
+    verifyDropzoneOptionTooltipSpecifyCorrectAnswerSection: (dropzoneIndex, tooltip) => {
+        utilities.hoverOverElement(utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzoneSpecifyCorrectAnswerSection, dropzoneIndex));
+        utilities.verifyTextContent(fillInTheGapsDragAndDropPage.dropzoneOptionTooltip(), tooltip);
+        utilities.hoverAwayFromElement();
+    },
+
+    /**
+     * @description Verify tooltip text in dropzone option preview tab
+     * @param {number} dropzoneIndex Index of dropzone in preview tab
+     * @param {string} tooltip Tooltip text
+     */
+    verifyDropzoneOptionTooltipPreviewTab: (dropzoneIndex, tooltip) => {
+        utilities.hoverOverElement(utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzonePreviewTab, dropzoneIndex));
+        utilities.verifyTextContent(fillInTheGapsDragAndDropPage.dropzoneOptionTooltip(), tooltip);
+        utilities.hoverAwayFromElement();
+    }
 }
 
 const tests = {
@@ -436,6 +716,15 @@ const tests = {
     ...draggableOptionContainer.tests,
     ...commonComponents.tests,
     ...autoScoredScoringPreviewTab.tests,
+    ...createQuestionBasePage.tests,
+    ...studentViewSettingsLabelComponent.tests,
+    ...randomizeOptionsComponent.tests,
+    ...enableOuterBorderComponent.tests,
+    ...allowMultipleInstancesOfSameDraggableOptionComponent.tests,
+    ...autoScoredStudentViewSettings.tests,
+    ...questionInstructionsComponent.tests,
+    ...questionInputFieldComponent.tests,
+    ...additionalSettingsPanel.tests,
 
     verifyContentsOfSpecifyCorrectAnswerSection: () => {
         it('When user selects a scoring type then in the \'Correct\' accordion, all the contents should be displayed', () => {
@@ -516,39 +805,6 @@ const tests = {
         it('Accessibility of \'Correct\' accordion contents', { tags: 'a11y' }, () => {
             cy.checkAccessibility(fillInTheGapsDragAndDropPage.dropzoneLabelSpecifyCorrectAnswerSection().parents('.preview-content-wrapper'))
         });
-    },
-
-    /**     
-    * @description select alternate answers for a dropzone in its alternate answer popup
-    * @param {string[]} alternateAnswerArray Array of options to be selected as alternate answer
-    */
-    selectAlternateAnswerInAlternateAnswerPopup: (alternateAnswerArray) => {
-        alternateAnswerArray.forEach((alternateAnswer) => {
-            fillInTheGapsDragAndDropPage.alternateAnswerPopupOptionContainer()
-                .contains(alternateAnswer)
-                .click();
-            fillInTheGapsDragAndDropPage.alternateAnswerPopupOptionContainer()
-                .contains(alternateAnswer)
-                .parent()
-                .should('have.class', 'selected');
-        });
-    },
-
-    saveSelectedAlternateAnswers: () => {
-        fillInTheGapsDragAndDropPage.alternateAnswerPopupSaveButton()
-            .click();
-    },
-
-    /**
-     * @description Set alternate answers for a dropzone
-     * @param {number} dropzoneIndex Index of dropzone
-     * @param {string[]} alternateAnswerArray Array of options to be selected as alternate answer
-     */
-    setResponseLevelAlternateAnswer: (dropzoneIndex, alternateAnswerArray) => {
-        fillInTheGapsDragAndDropPage.steps.clickOnAddAlternateButton(dropzoneIndex);
-        fillInTheGapsDragAndDropPage.steps.selectAlternateAnswerInAlternateAnswerPopup(alternateAnswerArray);
-        fillInTheGapsDragAndDropPage.steps.saveSelectedAlternateAnswers();
-        utilities.verifyElementVisibilityState(fillInTheGapsDragAndDropPage.alternateAnswerPopup(), 'notExist');
     }
 }
 

package/cypress/pages/fillInTheGapsOverImageDragAndDropPage.js

@@ -48,6 +48,7 @@ const selectors = {
     textAreaPreviewTab: () => cy.get('.drag-and-drop-layout-wrapper textarea'),
     dropzonePointerInPreviewTab: () => cy.get('.preview-content-wrapper [class*="PointerWrapper"]'),
     canvasInPreviewTab: () => cy.get('[class*="PreviewTabstyles__ContentWrapper"] [class*="Canvasstyle__DragAndDropCanvas"]'),
+    tickIconWrapper: () => cy.get('.tick-icon-wrapper g[id*="Rectangle"]')
 }
 
 const steps = {
@@ -320,31 +321,6 @@ const steps = {
             .click({ force: true });
     },
 
-    setGroupedOptions: () => {
-        let flowers = [['Flower', 'Petals', 'Seed', 'Pollen'],
-        ['Leaflet', 'Leaves', 'Leaf', 'Green'],
-        ['Stem', 'Branch', 'Trunk', 'Tree'],
-        ['Rose', 'Lily', 'Orchid', 'Petals']
-        ];
-        let groupTitles = ['Group A', 'Group B', 'Group C', 'Group D'];
-        draggableOptionsSectionComponent.steps.expandDraggableOptionsLayoutDropdown()
-        draggableOptionsSectionComponent.steps.selectOptionFromDraggableOptionsLayoutDropdown('Grouped')
-        draggableOptionsSectionComponent.steps.addGroupTitle(groupTitles[0]);
-        optionsWrapperComponent.steps.addMultipleOptionFields(2);
-        optionsWrapperComponent.steps.addInputToOptionsInputField(flowers[0]);
-        draggableOptionsSectionComponent.steps.addGroupWithTitleAndOptionsInDraggableOptionsSection(groupTitles[1], flowers[1]);
-        draggableOptionsSectionComponent.steps.addGroupWithTitleAndOptionsInDraggableOptionsSection(groupTitles[2], flowers[2]);
-        draggableOptionsSectionComponent.steps.addGroupWithTitleAndOptionsInDraggableOptionsSection(groupTitles[3], flowers[3]);
-    },
-
-    /**
-    * @description verify the displayed penalty points for each incorrect dropzone
-    * @param {number} penaltyPoints displayed penalty points 
-    */
-    verifyPenaltyPointsForEachIncorrectDropzone: (penaltyPoints) => {
-        utilities.verifyInnerText(autoScoredScoringSectionMultiResponseType.penaltyPointsDetailsSectionAllottedPointsLabel(), `Penalty points for each incorrect dropzone: ${penaltyPoints}`);
-    },
-
     verifyInactiveStateOfAllDropzoneInSpecifyCorrectAnswerSection: () => {
         fillInTheGapsOverImageDragAndDropPage.dropzoneWrapperSpecifyCorrectAnswerSection()
             .should('not.have.class', 'dragging-over');
@@ -585,7 +561,7 @@ const tests = {
         it('When user selects a scoring type then in the \'Correct\' accordion, all the contents should be displayed', () => {
             utilities.verifyElementCount(fillInTheGapsOverImageDragAndDropPage.dropzoneSpecifyCorrectAnswerSection(), 3);
             for (let index = 0; index < 3; index++) {
-                utilities.verifyInnerText(utilities.getNthElement(fillInTheGapsOverImageDragAndDropPage.dropzoneLabelSpecifyCorrectAnswerSection(), index), `Dropzone ${index+1}`);
+                utilities.verifyInnerText(utilities.getNthElement(fillInTheGapsOverImageDragAndDropPage.dropzoneLabelSpecifyCorrectAnswerSection(), index), `Dropzone ${index + 1}`);
             }
         });
     },

package/cypress/pages/fillInTheGapsOverImageDropdownPage.js

@@ -17,6 +17,7 @@ const selectors = {
     dropdownWrapperPreviewTab: () => cy.get('[class*="question-preview-wrapper"] [class="Canvasstyle__DropzoneWrapper"]'),
     correctAnswerResponseWrapper: () => cy.get('[class*="LabelImageWithDropdownPreviewstyles__AnswerCell"]'),
     correctAnswerResponse: () => cy.get('[class*="LabelImageWithDropdownPreviewstyles__AnswerWrapper"]'),
+    correctAnswerSectionWrapper: () => cy.get('.dnd-correct-answer-wrapper'),
 }
 
 const steps = {
@@ -154,7 +155,29 @@ const steps = {
     verifyCanvasHeightInPreviewTab: (height) => {
         fillInTheGapsOverImageDropdownPage.canvasImageInPreviewTab()
             .should('have.css', 'height', `${height}px`);
-    }
+    },
+
+    /**
+     * Verify correct answer responses in the correct answer section and count.
+     * @param {string[]} correctAnswerArray - An array containing the expected correct answer responses.
+     * @example verifyCorrectAnswerResponsesInCorrectAnswerSectionAndCount(['Flower', 'Petals', 'Stem']);
+     */
+    verifyCorrectAnswerResponsesInCorrectAnswerSectionAndCount: (correctAnswerArray) => {
+        utilities.verifyElementCount(fillInTheGapsOverImageDropdownPage.correctAnswerResponseWrapper(), correctAnswerArray.length);
+        correctAnswerArray.forEach((correctAnswer, index) => {
+            fillInTheGapsOverImageDropdownPage.correctAnswerResponseWrapper()
+                .eq(index)
+                .within(() => {
+                    utilities.verifyInnerText(fillInTheGapsDropdownCommonComponent.correctAnswerResponseNumeration(), `${index + 1}`);
+                    fillInTheGapsOverImageDropdownPage.correctAnswerResponse()
+                        .should('have.text', correctAnswer);
+                });
+        });
+    },
+
+    verifyCorrectAnswerSectionNotExists: () => {
+        utilities.verifyElementVisibilityState(fillInTheGapsDropdownPage.correctAnswerSectionWrapper(), 'notExist');
+    },
 }
 
 const tests = {