itemengine-cypress-automation 1.0.154 → 1.0.155

package/cypress/pages/components/fillInTheGapsTextCommonComponent.js

@@ -1,4 +1,5 @@
 import utilities from "../../support/helpers/utilities";
+import { dialogBoxBase } from "../dialogBoxBase";
 import { acceptedStudentInputComponent } from "./acceptedStudentInputComponent";
 import { autoScoredScoringSectionMultiResponseType } from "./autoScoredScoringSectionMultiResponseType";
 import { autoScoredSpecifyCorrectAnswerSection } from "./autoScoredSpecifyCorrectAnswerSection";
@@ -343,7 +344,8 @@ const steps = {
      */
     addTextInAnswerInputFieldsPreviewTab: (responseIndex, responseText) => {
         utilities.getNthElement(fillInTheGapsTextCommonComponent.answerInputFieldPreviewTab(), responseIndex)
-            .type(responseText);
+            .type(responseText)
+            .blur();
     },
 
     verifyEnableSpecialCharactersCheckboxUnchecked: () => {
@@ -392,6 +394,34 @@ const steps = {
             .click();
     },
 
+    /**
+    * Verify custom special characters displayed in special characters popup in preview tab
+    * @param {string[]} customSpecialCharacters Array of custom special characters
+    */
+    verifyCustomSpecialCharactersInSpecialCharactersPopupPreviewTab: (customSpecialCharacters) => {
+        dialogBoxBase.dialogBox()
+            .within(() => {
+                customSpecialCharacters.forEach((customSpecialCharacter, index) => {
+                    utilities.verifyInnerText(fillInTheGapsTextCommonComponent.specialCharactersCustomSymbolsPreviewTab().eq(index), `${customSpecialCharacter}`);
+                    utilities.verifyElementVisibilityState(fillInTheGapsTextCommonComponent.specialCharactersCustomSymbolsPreviewTab().eq(index), 'visible');
+                });
+                utilities.verifyElementCount(fillInTheGapsTextCommonComponent.specialCharactersCustomSymbolsPreviewTab(), `${customSpecialCharacters.length}`);
+            });
+    },
+
+    /**
+     * Click on custom special character symbol in special characters popup in preview tab
+     * @param {string} customSpecialCharacterSymbol custom special character symbol
+     */
+    clickOnCustomSpecialCharacterSymbolInSpecialCharactersPopupPreviewTab: (customSpecialCharacterSymbol) => {
+        dialogBoxBase.dialogBox()
+            .within(() => {
+                fillInTheGapsTextCommonComponent.specialCharactersCustomSymbolsPreviewTab()
+                    .contains(customSpecialCharacterSymbol)
+                    .click();
+            });
+    },
+
     /**
      * @description Verify response accordion is collapsed in specify correct answer section
      * @param {number} responseIndex index of response accordion
@@ -987,7 +1017,7 @@ const tests = {
 
     verifyMaximumCharacterLimitWarningConditionsSpecifyCorrectAnswerSection: () => {
         it('When the user reaches the character limit, then the warning message \'Maximum 10 characters have been entered\' should be displayed', () => {
-            fillInTheGapsTextCommonComponent.steps.enterTextInAnswerInputFieldsSpecifyCorrectAnswerSection([{ responseIndex: 0, responseText: 'pots' }]);
+            fillInTheGapsTextCommonComponent.steps.enterTextInAnswerInputFieldsSpecifyCorrectAnswerSection([{ responseIndex: 0, responseText: 'Flowerpots' }]);
             fillInTheGapsTextCommonComponent.steps.verifyTextInResponseAccordionAnswerInputField([{ responseIndex: 0, responseText: 'Flowerpots' }])
             fillInTheGapsTextCommonComponent.steps.verifyLimitReachedWarningMessageExist('Maximum 10 characters have been entered.');
         });
@@ -1089,7 +1119,7 @@ const tests = {
         });
 
         it('The user should not be able to enter characters more than the maximum character limit and warning message should persist', () => {
-            fillInTheGapsTextCommonComponent.steps.addTextInAnswerInputFieldsPreviewTab([{ responseIndex: 0, responseText: 'From' }]);
+            fillInTheGapsTextCommonComponent.steps.addTextInAnswerInputFieldsPreviewTab(0, 'From');
             fillInTheGapsTextCommonComponent.steps.verifyTextInAnswerInputFieldsPreviewTab([{ responseIndex: 0, responseText: 'Flowerpots' }])
             fillInTheGapsTextCommonComponent.steps.verifyLimitReachedWarningMessageExist('Maximum 10 characters have been entered.');
         });
@@ -1101,8 +1131,8 @@ const tests = {
         });
 
         it('When the user reaches the maximum character limit, then the warning message \'Maximum 10 characters have been entered\' should be displayed and on focusing out of the answer input field, the warning message should disappear', () => {
-            fillInTheGapsTextCommonComponent.steps.addTextInAnswerInputFieldsPreviewTab('s');
-            fillInTheGapsTextCommonComponent.steps.verifyTextInResponseAccordionAnswerInputField([{ responseIndex: 0, responseText: 'Flowerpots' }])
+            fillInTheGapsTextCommonComponent.steps.addTextInAnswerInputFieldsPreviewTab(0, 's');
+            fillInTheGapsTextCommonComponent.steps.verifyTextInAnswerInputFieldsPreviewTab([{ responseIndex: 0, responseText: 'Flowerpots' }])
             fillInTheGapsTextCommonComponent.steps.verifyLimitReachedWarningMessageExist('Maximum 10 characters have been entered.');
             fillInTheGapsTextCommonComponent.steps.focusOutOfResponseAnswerInputFieldPreviewTab(0);
             fillInTheGapsTextCommonComponent.steps.verifyLimitReachedWarningMessageNotExist();
@@ -1111,7 +1141,7 @@ const tests = {
 
     verifyMinimumCharacterLimitWarningConditionsPreviewTab: () => {
         it('When the minimum character limit is set as 0, then on focusing out of the answer input field, no warning message should be displayed', () => {
-            fillInTheGapsTextCommonComponent.steps.focusInAndFocusOutOfResponseAnswerInputFieldPreviewTab();
+            fillInTheGapsTextCommonComponent.steps.focusInAndFocusOutOfResponseAnswerInputFieldPreviewTab(0);
             fillInTheGapsTextCommonComponent.steps.verifyLimitReachedWarningMessageNotExist();
         });
 
@@ -1174,6 +1204,8 @@ const tests = {
             commonComponents.steps.verifyErrorMessageIsNotDisplayed();
         });
 
+        autoScoredSpecifyCorrectAnswerSection.tests.verifyAutoScoredPointsErrorMessageWhenPointsFieldIsEmpty(accordionName);
+
         it('\'Accepted student input\' label, menu and its options - \'Text\', \'Number\', \'Integer\' should be displayed and \'Text\' option should be active', () => {
             utilities.verifyInnerText(acceptedStudentInputComponent.acceptedStudentInputLabel(), 'Accepted student input');
             utilities.verifyElementVisibilityState(acceptedStudentInputComponent.acceptedStudentInputLabel(), 'visible');
@@ -1185,8 +1217,6 @@ const tests = {
             fillInTheGapsTextCommonComponent.steps.collapseResponseAccordionSpecifyCorrectAnswer(0);
         });
 
-        autoScoredSpecifyCorrectAnswerSection.tests.verifyAutoScoredPointsErrorMessageWhenPointsFieldIsEmpty(accordionName);
-
         it(`CSS of ${accordionName} accordion contents`, { tags: 'css' }, () => {
             utilities.verifyCSS(utilities.getNthElement(fillInTheGapsTextCommonComponent.responseAccordionLabel(), 0), {
                 'color': css.color.text,
@@ -1426,8 +1456,10 @@ const tests = {
             fillInTheGapsTextCommonComponent.steps.verifyTextInResponseAccordionAnswerInputField([{ responseIndex: 0, responseText: 'Hi23(^^)' }]);
         });
 
-        it('When user selects \'Number\' in accepted student input, then text inside the answer input field should only include numbers part from the previously entered input', () => {
+        it('When user selects \'Number\' in accepted student input, then text inside the answer input field should be removed and user should be able to include numbers in the input field', () => {
             acceptedStudentInputComponent.steps.selectAcceptedStudentInputType(0, 'Number');
+            fillInTheGapsTextCommonComponent.steps.verifyTextInResponseAccordionAnswerInputField([{ responseIndex: 0, responseText: '' }]);
+            fillInTheGapsTextCommonComponent.steps.enterTextInAnswerInputFieldsSpecifyCorrectAnswerSection([{ responseIndex: 0, responseText: '23' }]);
             fillInTheGapsTextCommonComponent.steps.verifyTextInResponseAccordionAnswerInputField([{ responseIndex: 0, responseText: '23' }]);
         });
 
@@ -1451,8 +1483,10 @@ const tests = {
             fillInTheGapsTextCommonComponent.steps.verifyTextInResponseAccordionAnswerInputField([{ responseIndex: 0, responseText: '29.54' }]);
         });
 
-        it('When user selects \'Integer\' in accepted student input, then text inside the answer input field should only include whole numbers part from the previously entered input', () => {
+        it('When user selects \'Integer\' in accepted student input, then text inside the answer input field should be removed and user should be able to include numbers', () => {
             acceptedStudentInputComponent.steps.selectAcceptedStudentInputType(0, 'Integer');
+            fillInTheGapsTextCommonComponent.steps.verifyTextInResponseAccordionAnswerInputField([{ responseIndex: 0, responseText: '' }]);
+            fillInTheGapsTextCommonComponent.steps.enterTextInAnswerInputFieldsSpecifyCorrectAnswerSection([{ responseIndex: 0, responseText: '2954' }]);
             fillInTheGapsTextCommonComponent.steps.verifyTextInResponseAccordionAnswerInputField([{ responseIndex: 0, responseText: '2954' }]);
         });
 
@@ -1471,9 +1505,10 @@ const tests = {
             fillInTheGapsTextCommonComponent.steps.verifyTextInResponseAccordionAnswerInputField([{ responseIndex: 0, responseText: '44' }]);
         });
 
-        it('When user selects \'Text\' in accepted student input again, then answer input field should contain text from previously added input', () => {
+        it('When user selects \'Text\' in accepted student input again, then answer input field should be removed and user should be able to enter text in input field', () => {
             acceptedStudentInputComponent.steps.selectAcceptedStudentInputType(0, 'Text');
-            fillInTheGapsTextCommonComponent.steps.verifyTextInResponseAccordionAnswerInputField([{ responseIndex: 0, responseText: '44' }]);
+            fillInTheGapsTextCommonComponent.steps.verifyTextInResponseAccordionAnswerInputField([{ responseIndex: 0, responseText: '' }]);
+            fillInTheGapsTextCommonComponent.steps.enterTextInAnswerInputFieldsSpecifyCorrectAnswerSection([{ responseIndex: 0, responseText: 'Text' }]);
         });
 
         it('When user adds alternate answer input field, then accepted student input should be applied on both the response answer input fields in the response accordion', () => {

package/cypress/pages/components/gridQuestionCommonComponent.js

@@ -677,87 +677,6 @@ const tests = {
 
         });
     },
-
-    /**
-     * Verifies the contents and functionality of the 'Specify correct answer' accordion for multiple selection questions.
-     * @param {{'Correct' | 'Alternative'}} accordionName - The name of the accordion to be used in the validation.
-     * @example - verifySpecifyCorrectAnswerAccordionContentsAndFunctionality('Correct');
-     */
-    verifySpecifyCorrectAnswerAccordionContentsAndFunctionality: (accordionName) => {
-        it(`The user should be able to check an option in the ${accordionName} accordion`, () => {
-            gridQuestionCommonComponent.steps.setAnswerInSpecifyCorrectAnswerSection({ row: 1, column: 0 });
-        });
-
-        it(`When the user has unchecked all the options in the ${accordionName} accordion, \'Error: Please set a correct answer.\' error message should be thrown along with an error icon on the \'${accordionName}\' accordion`, () => {
-            gridQuestionCommonComponent.steps.uncheckOptionInSpecifyCorrectAnswerSection({ row: 1, column: 0 });
-            utilities.verifyElementVisibilityState(commonComponents.errorMessage(), 'visible')
-            utilities.verifyInnerText(commonComponents.errorMessage(), 'Error: Please set a correct answer.');
-            if (accordionName == 'Correct') {
-                autoScoredSpecifyCorrectAnswerSection.correctAnswerAccordion()
-                    .within(() => {
-                        utilities.verifyElementVisibilityState(autoScoredSpecifyCorrectAnswerSection.specifyCorrectAnswerErrorIcon(), 'visible');
-                    });
-            } else {
-                autoScoredSpecifyCorrectAnswerSection.alternativeAnswerAccordion()
-                    .within(() => {
-                        utilities.verifyElementVisibilityState(autoScoredSpecifyCorrectAnswerSection.specifyCorrectAnswerErrorIcon(), 'visible');
-                    });
-            };
-        });
-
-        autoScoredSpecifyCorrectAnswerSection.tests.verifyAutoScoredCorrectAnswerErrorMessageCSSAndA11y();
-
-        it('When the user checks an option in the question grid, the error message should disappear', () => {
-            gridQuestionCommonComponent.steps.setAnswersForAllQuestionStemsInSpecifyCorrectAnswerSection([{ row: 1, column: 0 }, { row: 2, column: 1 }, { row: 3, column: 0 }, { row: 4, column: 1 }]);
-            commonComponents.steps.verifyErrorMessageIsNotDisplayed();
-        });
-
-        autoScoredSpecifyCorrectAnswerSection.tests.verifyAutoScoredPointsErrorMessageWhenPointsFieldIsEmpty(accordionName);
-
-        it('CSS of \'Correct\' accordion contents', { tags: 'css' }, () => {
-            gridQuestionCommonComponent.gridSpecifyCorrectAnswerSection()
-                .within(() => {
-                    utilities.verifyCSS(utilities.getNthElement(gridQuestionCommonComponent.tableCell().parent(), 1), {
-                        'background-color': css.color.matrixHeadingCellBg,
-                        'border-color': `${css.color.matrixCellBorder}`
-                    });
-                    utilities.verifyCSS(utilities.getNthElement(gridQuestionCommonComponent.tableCell().parent(), 6), {
-                        'background-color': css.color.matrixSubheadingCellBg,
-                        'border-color': `${css.color.matrixCellBorder}`
-                    });
-                    utilities.verifyCSS(utilities.getNthElement(gridQuestionCommonComponent.tableCell().parent(), 9), {
-                        'background-color': css.color.defaultBackground,
-                        'border-color': `${css.color.matrixCellBorder}`
-                    });
-                    utilities.verifyCSS(utilities.getNthElement(gridQuestionCommonComponent.optionsButton, 0), {
-                        'background-color': css.color.matrixHeadingCellBg,
-                        'color': `${css.color.matrixCellBorder}`
-                    });
-                    utilities.verifyCSS(utilities.getNthElement(gridQuestionCommonComponent.optionsButton, 0).find('svg'), {
-                        'color': css.color.activeButtons
-                    });
-                    utilities.verifyCSS(utilities.getNthElement(gridQuestionCommonComponent.tableCell(), 1).find('.question-text-wrapper'), {
-                        'color': css.color.text,
-                        'font-size': css.fontSize.heading,
-                        'font-weight': css.fontWeight.bold
-                    });
-                    utilities.verifyCSS(utilities.getNthElement(gridQuestionCommonComponent.tableCell(), 6).find('.question-text-wrapper'), {
-                        'color': css.color.text,
-                        'font-size': css.fontSize.default,
-                        'font-weight': css.fontWeight.bold
-                    });
-                    utilities.verifyCSS(utilities.getNthElement(gridQuestionCommonComponent.tableCell(), 9).find('.question-text-wrapper'), {
-                        'color': css.color.text,
-                        'font-size': css.fontSize.default,
-                        'font-weight': css.fontWeight.regular
-                    });
-                });
-        });
-
-        it('Accessibility of \'Correct\' accordion contents', { tags: 'a11y' }, () => {
-            cy.checkAccessibility(gridQuestionCommonComponent.tableCell().parents('.correct-answer-accordion'));
-        });
-    },
 }
 
 export const gridQuestionCommonComponent = {

package/cypress/pages/components/imageCanvasComponent.js

@@ -43,9 +43,9 @@ const selectors = {
     fillImageToCanvasLabel: () => cy.get('[data-ngie-testid="fill-image-to-canvas-checkbox"] .MuiFormControlLabel-label'),
     fillImageToCanvasCheckbox: () => cy.get('[data-ngie-testid="fill-image-to-canvas-checkbox"] input'),
     imageAlignmentLabel: () => cy.get('.image-alignment-wrapper [class*="OptionsContainerstyles__LabelWrapper"]'),
-    topLeftAlignmentButton: () => cy.get('[data-ngie-testid="top-left-toggle-button"], [data-testid="top-left-toggle-button"]'),
-    centerAlignmentButton: () => cy.get('[data-ngie-testid="center-toggle-button"], [data-testid="center-toggle-button"]'),
-    topRightAlignmentButton: () => cy.get('[data-ngie-testid="top-right-toggle-button"], [data-testid="top-right-toggle-button"]'),
+    topLeftAlignmentButton: () => cy.get('.image-alignment-wrapper [data-ngie-testid="top-left-toggle-button"], [data-testid="top-left-toggle-button"]'),
+    centerAlignmentButton: () => cy.get('.image-alignment-wrapper [data-ngie-testid="center-toggle-button"], [data-testid="center-toggle-button"]'),
+    topRightAlignmentButton: () => cy.get('.image-alignment-wrapper [data-ngie-testid="top-right-toggle-button"], [data-testid="top-right-toggle-button"]'),
     canvasWidthLabel: () => cy.get('.common-text-wrapper .additional-settings-label').eq(0),
     canvasWidthInputField: () => cy.get('.common-text-wrapper .text-field').eq(0),
     canvasHeightLabel: () => cy.get('.common-text-wrapper .additional-settings-label').eq(1),
@@ -385,7 +385,7 @@ const steps = {
             .click();
     },
 
-    clearAll: () => {
+    clearAllCanvas: () => {
         imageCanvasComponent.clearAllButton()
             .click();
     },
@@ -435,7 +435,7 @@ const steps = {
         const getPosition = (option) => {
             switch (option) {
                 case 'bottom':
-                    return { top: '-31.5px', left: '-37.5px' };
+                    return { top: '-31px', left: '-35px' };
                 case 'bottom right':
                     return { top: '-25px', left: '-40px' };
                 case 'right':
@@ -450,6 +450,8 @@ const steps = {
                     return { bottom: '-20px', left: '-27px' };
                 case 'bottom left':
                     return { bottom: '-18px', left: '-32px' };
+                default:
+                    return { top: '0', left: '0' };
             }
         }
         const expectedPosition = getPosition(style);
@@ -736,7 +738,7 @@ const tests = {
         });
 
         it(`When user clicks on \'Clear all\' button, then all response container should be deleted and error message 'Error: Please insert a ${response}.' should be displayed`, () => {
-            imageCanvasComponent.steps.clearAll();
+            imageCanvasComponent.steps.clearAllCanvas();
             utilities.verifyElementVisibilityState(imageCanvasComponent.responseAreaWrapper(), 'notExist');
             utilities.verifyInnerText(commonComponents.errorMessage(), `Error: Please insert a ${response}.`);
             utilities.verifyElementVisibilityState(commonComponents.errorMessage(), 'visible');
@@ -977,7 +979,7 @@ const tests = {
 
         it('When user clears text in the \'Alternative text\' input field, then default alternative text should be displayed for canvas image', () => {
             imageCanvasComponent.steps.clearImageAlternativeTextInputFieldText();
-            imageCanvasComponent.steps.verifyDefaultImageAlternativeTextPresentInEditTab();
+            imageCanvasComponent.steps.verifyNoImageAlternativeTextPresentInPreviewTab();
         });
     },
 
@@ -1039,7 +1041,7 @@ const tests = {
             imageCanvasComponent.steps.switchToEditTab();
             imageCanvasComponent.steps.clearImageAlternativeTextInputFieldText();
             imageCanvasComponent.steps.switchToPreviewTab();
-            imageCanvasComponent.steps.verifyDefaultImageAlternativeTextPresentInPreviewTab();
+            imageCanvasComponent.steps.verifyNoImageAlternativeTextPresentInPreviewTab();
         });
     },
 

package/cypress/pages/components/listSortingAndOrderingBase.js

@@ -362,7 +362,7 @@ const tests = {
             utilities.verifyElementVisibilityState(listSortingAndOrderingBase.randomizeOptionsCheckbox(), 'notExist');
             utilities.verifyElementVisibilityState(listSortingAndOrderingBase.hideDragHandleCheckbox(), 'notExist');
             scoringSectionBase.steps.verifyDefaultMinimumScoreIfAttemptedLabelAndPointsField()
-            additionalSettingsPanel.steps.expandAdditonalSettings()
+            additionalSettingsPanel.steps.expandAdditionalSettings()
             utilities.verifyElementVisibilityState(autoScoredAdditionalSettings.checkAnswerLabel(), 'notExist');
             utilities.verifyElementVisibilityState(autoScoredAdditionalSettings.allowStudentsToCheckAnswerLabel(), 'notExist');
         });

package/cypress/pages/components/questionInputFieldComponent.js

@@ -138,7 +138,7 @@ const tests = {
             questionInputFieldComponent.steps.clearQuestionInputField();
             questionInputFieldComponent.steps.verifyQuestionInputFieldPlaceholder();
             questionInputFieldComponent.steps.addInputToQuestionInputField('Lorem Ipsum');
-            utilities.verifyInnerText(questionInputFieldComponent.questionInputField(), '​​​​​​​Lorem Ipsum');
+            utilities.verifyInnerText(questionInputFieldComponent.questionInputField(), 'Lorem Ipsum');
             questionInputFieldComponent.steps.verifyQuestionInputFieldPlaceholderNotDisplayed();
         });
     },

package/cypress/pages/components/questionInstructionsComponent.js

@@ -6,7 +6,7 @@ const css = Cypress.env('css');
 const selectors = {
     questionInstructionsLabelEditTab: () => cy.get('.edit-question-instruction-label'),
     questionInstructionsInputField: () => cy.get('[title="Question Instructions"]'),
-    questionInstructionsText: () => cy.get('.question-instruction'),
+    questionInstructionsText: () => cy.get('.question-instruction:visible'),
     questionInstructionsWrapper: () => cy.get('.edit-question-instruction-wrapper')
 }
 

package/cypress/pages/dragAndDropIntoCategoriesPage.js

@@ -1245,7 +1245,7 @@ const steps = {
         let animals = [['Bat', 'Platypus', 'Panda', 'Zebra'],
         ['Peacock', 'Falcon', 'Eagle', 'Tiger'],
         ['Parrot', 'Lion', 'Whale', 'Elephant'],
-        ['Giraffe', 'Kangaroo', 'Ostrich', 'Flying squirrel']
+        ['Giraffe', 'Bat', 'Ostrich', 'Flying squirrel']
         ];
         let groupTitles = ['Group A', 'Group B', 'Group C', 'Group D'];
         draggableOptionsSectionComponent.steps.expandDraggableOptionsLayoutDropdown()

package/cypress/pages/essayResponsePage.js

@@ -86,12 +86,12 @@ const tableDialogBox = {
     previewInputFieldTable: () => cy.get('.ngcke_custom_table'),
     //Edit Table Dialog Box
     editTableDialogBox: () => cy.get('.cke_dialog_body'),
-    editTableDialogBoxTitle: () => cy.get('.cke_dialog_title').eq(1),
-    editTableDialogBoxAddRowHeaderLabel: () => cy.get('.chk_box_add_header_row label').eq(1),
+    editTableDialogBoxTitle: () => cy.get('.cke_dialog_title'),
+    editTableDialogBoxAddRowHeaderLabel: () => cy.get('.chk_box_add_header_row label'),
     editTableDialogBoxHighlightFirstColumnLabel: () => cy.get('.chk_box_highlight_first_column label'),
-    editTableDialogBoxAddRowHeaderCheckbox: () => cy.get('.chk_box_add_header_row input').eq(1),
+    editTableDialogBoxAddRowHeaderCheckbox: () => cy.get('.chk_box_add_header_row input'),
     editTableDialogBoxHighlightFirstColumnCheckbox: () => cy.get('.chk_box_highlight_first_column input'),
-    editTableDialogBoxColumnsLabel: () => essayResponsePage.editTableDialogBox().find('.cke_dialog_ui_labeled_label').eq(0),
+    editTableDialogBoxColumnsLabel: () => essayResponsePage.editTableDialogBox().find('.cke_dialog_ui_labeled_label'),
     editTableDialogBoxRowsLabel: () => essayResponsePage.editTableDialogBox().find('.cke_dialog_ui_labeled_label').eq(1),
     editTableDialogBoxInsertBeforeButton: () => cy.get('[title="Insert Before"]'),
     editTableDialogBoxInsertAfterButton: () => cy.get('[title="Insert After"]'),

package/cypress/pages/fillInTheGapsDragAndDropPage.js

@@ -36,6 +36,9 @@ const selectors = {
     alternateAnswerPopupOptions: () => cy.get('.option-container'),
     alternateAnswerPopupCancelButton: () => cy.get('[class*="AlternateOptionstyle__ButtonWrapper"] button').eq(0),
     alternateAnswerPopupSaveButton: () => cy.get('[class*="AlternateOptionstyle__ButtonWrapper"] button').eq(1),
+    dropzoneOptionSpecifyCorrectAnswerSection: () => cy.get('.item-content-container'),
+    partialEqualWeightsPointsPerResponseScore: () => cy.get('.alternate-points-points-per-value-span'),
+    pointsLabel: () => cy.get('.cloze-with-dropdown-partial-points-per-response-label'),
     //Preview tab
     questionBorderPreviewTab: () => cy.get('[class*="ClozeWithDragAndDropstyles__WrapperDiv"]'),
     optionPreviewTab: () => cy.get('.draggable-selected-item'),
@@ -393,7 +396,7 @@ const steps = {
 
     verifyInactiveStateOfAllDropzoneInSpecifyCorrectAnswerSection: () => {
         fillInTheGapsDragAndDropPage.dropzoneSpecifyCorrectAnswerSection()
-            .should('not.have.class', 'isActiveForDrop');
+            .should('not.have.attr', 'aria-describedby');
     },
 
     /**
@@ -405,8 +408,7 @@ const steps = {
             .eq(dropzoneIndex)
             .within(() => {
                 responseArray.forEach((response, count) => {
-                    cy.get('.item-content-container')
-                        // draggableOptionContainer.draggableOption()
+                    fillInTheGapsDragAndDropPage.dropzoneOptionSpecifyCorrectAnswerSection()
                         .eq(count)
                         .verifyInnerText(response);
                 });
@@ -414,14 +416,14 @@ const steps = {
     },
 
     /**
-   * @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
-   */
+    * @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()
             .eq(responseAreaIndex)
             .within(() => {
-                utilities.verifyElementVisibilityState(draggableOptionContainer.draggableOptionDragIcon(), 'hidden')
+                utilities.verifyElementVisibilityState(draggableOptionContainer.draggableOptionDragIcon(), 'notExist')
             });
     },
 
@@ -434,7 +436,7 @@ const steps = {
         fillInTheGapsDragAndDropPage.dropzoneSpecifyCorrectAnswerSection()
             .eq(dropzoneIndex)
             .within(() => {
-                draggableOptionContainer.draggableOption()
+                fillInTheGapsDragAndDropPage.dropzoneOptionSpecifyCorrectAnswerSection()
                     .contains(optionName)
                     .click();
             });
@@ -452,7 +454,7 @@ const steps = {
 
     verifyInactiveStateOfAllDropzoneInPreviewTab: () => {
         fillInTheGapsDragAndDropPage.dropzonePreviewTab()
-            .should('not.have.class', 'isActiveForDrop');
+            .should('not.have.attr', 'aria-describedby');
     },
 
     /**
@@ -477,7 +479,7 @@ const steps = {
         fillInTheGapsDragAndDropPage.dropzonePreviewTab()
             .eq(responseAreaIndex)
             .within(() => {
-                utilities.verifyElementVisibilityState(draggableOptionContainer.draggableOptionDragIcon(), 'hidden')
+                utilities.verifyElementVisibilityState(draggableOptionContainer.draggableOptionDragIcon(), 'notExist')
             });
     },
 
@@ -490,7 +492,7 @@ const steps = {
         fillInTheGapsDragAndDropPage.dropzonePreviewTab()
             .eq(dropzoneIndex)
             .within(() => {
-                draggableOptionContainer.draggableOption()
+                fillInTheGapsDragAndDropPage.dropzoneOptionSpecifyCorrectAnswerSection()
                     .contains(optionName)
                     .click();
             });
@@ -641,16 +643,19 @@ const steps = {
     },
 
     verifyDropzoneHeightWhenLongTextIsDroppedInSpecifyCorrectAnswerSection: () => {
-        let originalDropzoneHeight
+        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);
+                originalDropzoneHeight = $originalDropzoneHeight[0].offsetHeight; //Storing original dropzone height
+            }).then(() => {
+                fillInTheGapsDragAndDropPage.steps.clickAndDropOptionInDropzoneSpecifyCorrectAnswerSection({ 'Leaves grow on the branches of a plant which in turn grow on the stem': 1 });
+            })
+            .then(() => {
+                utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzoneSpecifyCorrectAnswerSection(), 1)
+                    .then(($modifiedDropzoneHeight) => {
+                        const modifiedDropzoneHeight = $modifiedDropzoneHeight[0].offsetHeight; //Storing modified dropzone height
+                        expect(modifiedDropzoneHeight).to.be.gt(originalDropzoneHeight);
+                    });
             });
     },
 
@@ -705,7 +710,9 @@ const steps = {
      * @param {string} tooltip Tooltip text
      */
     verifyDropzoneOptionTooltipSpecifyCorrectAnswerSection: (dropzoneIndex, tooltip) => {
-        utilities.hoverOverElement(utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzoneSpecifyCorrectAnswerSection, dropzoneIndex));
+        fillInTheGapsDragAndDropPage.dropzoneSpecifyCorrectAnswerSection()
+            .eq(dropzoneIndex)
+            .trigger('mouseover')
         utilities.verifyTextContent(fillInTheGapsDragAndDropPage.dropzoneOptionTooltip(), tooltip);
         utilities.hoverAwayFromElement();
     },
@@ -716,10 +723,15 @@ const steps = {
      * @param {string} tooltip Tooltip text
      */
     verifyDropzoneOptionTooltipPreviewTab: (dropzoneIndex, tooltip) => {
-        utilities.hoverOverElement(utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzonePreviewTab, dropzoneIndex));
+        utilities.hoverOverElement(utilities.getNthElement(fillInTheGapsDragAndDropPage.dropzonePreviewTab(), dropzoneIndex));
         utilities.verifyTextContent(fillInTheGapsDragAndDropPage.dropzoneOptionTooltip(), tooltip);
         utilities.hoverAwayFromElement();
-    }
+    },
+
+    verifyPartialEqualWeightsPointsPerResponseScore: (pointsPerResponse) => {
+        fillInTheGapsDragAndDropPage.partialEqualWeightsPointsPerResponseScore()
+            .should('have.text', pointsPerResponse);
+    },
 }
 
 const tests = {
@@ -771,7 +783,6 @@ const tests = {
                     });
             } else {
                 autoScoredSpecifyCorrectAnswerSection.alternativeAnswerAccordion()
-                    .eq(1)
                     .within(() => {
                         utilities.verifyElementVisibilityState(autoScoredSpecifyCorrectAnswerSection.specifyCorrectAnswerErrorIcon(), 'visible');
                     });

package/cypress/pages/fillInTheGapsOverImageDragAndDropPage.js

@@ -589,7 +589,6 @@ const tests = {
                     });
             } else {
                 autoScoredSpecifyCorrectAnswerSection.alternativeAnswerAccordion()
-                    .eq(1)
                     .within(() => {
                         utilities.verifyElementVisibilityState(autoScoredSpecifyCorrectAnswerSection.specifyCorrectAnswerErrorIcon(), 'visible');
                     });

package/cypress/pages/fillInTheGapsOverImageDropdownPage.js

@@ -2,8 +2,6 @@ import utilities from "../support/helpers/utilities";
 import { imageCanvasComponent, autoScoredScoringPreviewTab, createQuestionBasePage, backgroundImageUploadComponent, scoringSectionBaseEditTab, questionInstructionsComponent, correctIncorrectAnswerLabelComponent, autoScoredStudentViewSettings, autoScoredSpecifyCorrectAnswerSection, autoScoredScoringSectionMultiResponseType, fillInTheGapsDropdownCommonComponent, randomizeOptionsComponent, optionsWrapperComponent, studentViewSettingsLabelComponent, additionalSettingsPanel, placeholderTextSectionComponent, gradingViewEnumerationComponent, ariaLabelSectionComponent, commonComponents, additionalSettingsAccessibilitySectionComponent } from "./components";
 const css = Cypress.env('css');
 
-const optionsForDropdown = ['Flower', 'Petal', 'Stem', 'Branch'];
-
 const selectors = {
     ...questionInstructionsComponent,
     ...imageCanvasComponent,
@@ -19,6 +17,11 @@ const selectors = {
     ...ariaLabelSectionComponent,
     ...commonComponents,
     ...additionalSettingsPanel,
+    ...autoScoredSpecifyCorrectAnswerSection,
+
+    optionsInputField: () => cy.get('[class*="TextFieldWrapper"] input'),
+    optionNumeration: () => cy.get('.MuiInputAdornment-positionStart'),
+    pointsLabel: () => cy.get('.cloze-with-text-partial-points-per-response-label'),
     dropdownWrapperPreviewTab: () => cy.get('[class*="Canvasstyle__DropzoneWrapper"]'),
     correctAnswerResponseWrapper: () => cy.get('[class*="LabelImageWithDropdownPreviewstyles__AnswerCell"]'),
     correctAnswerResponse: () => cy.get('[class*="LabelImageWithDropdownPreviewstyles__AnswerWrapper"]'),
@@ -111,7 +114,7 @@ const steps = {
         const getPosition = (option) => {
             switch (option) {
                 case 'bottom':
-                    return { top: '-31.5px', left: '-37.5px' };
+                    return { top: '-31px', left: '-35px' };
                 case 'bottom right':
                     return { top: '-25px', left: '-40px' };
                 case 'right':
@@ -222,7 +225,7 @@ const steps = {
                 });
         });
     },
-    
+
     /**
      * Verifies the dropdown enumeration in the preview tab.
      * @param {string[]} enumerationArray - An array of enumeration values to verify.
@@ -239,6 +242,25 @@ const steps = {
                 });
         });
     },
+
+    /**
+    * @param {number} index of the option
+    * @description verify the enter option input field, drag handle, delete button and option numeration
+    */
+    verifyOptionsContents: (index) => {
+        optionsWrapperComponent.optionWrapper()
+            .eq(index)
+            .within(() => {
+                fillInTheGapsOverImageDropdownPage.optionsInputField()
+                    .should('have.attr', 'placeholder', 'Enter option');
+                commonComponents.dragHandleButton()
+                    .should('exist');
+                commonComponents.deleteButton()
+                    .should('be.visible');
+                fillInTheGapsOverImageDropdownPage.optionNumeration()
+                    .should('have.text', index + 1);
+            });
+    },
 }
 
 const tests = {

package/cypress/pages/fillInTheGapsOverImageTextPage.js

@@ -90,35 +90,6 @@ const steps = {
             });
     },
 
-    /**
-   * Verify custom special characters displayed in special characters popup in preview tab
-   * @param {string[]} customSpecialCharacters Array of custom special characters
-   */
-    verifyCustomSpecialCharactersInSpecialCharactersPopupPreviewTab: (customSpecialCharacters) => {
-        dialogBoxBase.dialogBox()
-            .within(() => {
-                customSpecialCharacters.forEach((customSpecialCharacter, index) => {
-                    utilities.verifyInnerText(fillInTheGapsOverImageTextPage.specialCharactersCustomSymbolsPreviewTab().eq(index), `${customSpecialCharacter}`);
-                    utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.specialCharactersCustomSymbolsPreviewTab().eq(index), 'visible');
-                });
-                utilities.verifyElementCount(fillInTheGapsOverImageTextPage.specialCharactersCustomSymbolsPreviewTab(), `${customSpecialCharacters.length}`);
-            });
-    },
-
-    /**
-     * Click on custom special character symbol in special characters popup in preview tab
-     * @param {string} customSpecialCharacterSymbol custom special character symbol
-     */
-    clickOnCustomSpecialCharacterSymbolInSpecialCharactersPopupPreviewTab: (customSpecialCharacterSymbol) => {
-        dialogBoxBase.dialogBox()
-            .within(() => {
-                fillInTheGapsOverImageTextPage.specialCharactersCustomSymbolsPreviewTab()
-                    .contains(customSpecialCharacterSymbol)
-                    .click();
-            });
-    },
-
-
     /**
      *@description Verify text in the answer input fields of the specify correct answer section.
      * @param {Object[]} responses - An array of objects containing the responseIndex and responseText.