itemengine-cypress-automation 1.0.78 → 1.0.80

package/cypress/pages/fillInTheGapsOverImageTextPage.js

@@ -1,135 +1,342 @@
-import { questionInstructionsComponent, scoringSectionBase, createQuestionBasePage, additionalSettingsPanel, commonComponents, autoScoredPreviewBase, autoScoredAdditionalSettings, autoScoredSetCorrectAnswerSection, autoScoredScoringSectionMultipleResponsesType, autoScoredScoringSection, specialCharactersFlyoutComponent, specialAndCustomSpecialCharactersComponent, previewScoringAndShowCorrectAnswerComponent, figOverImageCommonComponent, uploadImageSectionComponent, fillInTheGapsTextCommonComponent, studentResponseAndLayoutComponent } from "./components";
-import { answerNumerationComponent } from "./components/answerNumerationComponent";
+import utilities from "../support/helpers/utilities";
+import { questionInstructionsComponent, scoringSectionBaseEditTab, createQuestionBasePage, commonComponents, autoScoredScoringPreviewTab, autoScoredSpecifyCorrectAnswerSection, autoScoredScoringSectionMultiResponseType, backgroundImageUploadComponent, optionsWrapperComponent, figOverImageCanvasComponent, correctIncorrectAnswerLabelComponent, autoScoredStudentViewSettings, acceptedStudentInputComponent } from "./components";
+const css = Cypress.env('css');
 
 const selectors = {
-    ...scoringSectionBase,
-    ...createQuestionBasePage,
-    ...additionalSettingsPanel,
     ...questionInstructionsComponent,
+    ...figOverImageCanvasComponent,
     ...commonComponents,
-    ...autoScoredSetCorrectAnswerSection,
-    ...autoScoredAdditionalSettings,
-    ...autoScoredPreviewBase,
-    ...autoScoredScoringSectionMultipleResponsesType,
-    ...specialCharactersFlyoutComponent,
-    ...specialAndCustomSpecialCharactersComponent,
-    ...previewScoringAndShowCorrectAnswerComponent,
-    ...answerNumerationComponent,
-    ...figOverImageCommonComponent,
-    ...uploadImageSectionComponent,
-    ...fillInTheGapsTextCommonComponent,
+    ...correctIncorrectAnswerLabelComponent,
+    ...autoScoredScoringSectionMultiResponseType,
+    ...autoScoredSpecifyCorrectAnswerSection,
+
+    //TODO: Update below selectors after https://redmine.zeuslearning.com/issues/557945 is resolved
+    //response accordion
+    responseAccordion: () => cy.get('.response-text-accordion'),
+    responseAccordionLabel: () => cy.get('[class*="ResponseComponentstyles__Label"]'),
+    responseAccordionAnswerInputField: () => cy.get('.label-image-text-answer-label input'),
+    responseAccordionPointsWrapper: () => cy.get('[class*="ResponseComponentstyles__PointsDiv"]'),
+    responseAccordionPointsLabel: () => cy.get('[class*="ResponseComponentstyles__PointsLabel"]'),
+    responseAccordionPointsScore: () => cy.get('[class*="ResponseComponentstyles__Points-"]'),
+    responseAccordionPointsInputFieldWrapper: () => cy.get('[class*="ResponseComponentstyles__PointsWrapper"]'),
+    responseAccordionAddAlternateButton: () => cy.get('.add-alternate-btn'),
+
+    answerInputFieldSpecifyCorrectAnswerSection: () => cy.get('.label-image-text-inline-text-field input'),
+    answerInputFieldPreviewTab: () => cy.get('[class*="question-preview-wrapper"] .response-input-field input'),
+    correctAnswerSectionWrapper: () => cy.get('.cloze-with-text-correct-answer-wrapper'),
+    correctAnswersLabel: () => cy.get('.correct-answers-label'),
+    responseStatusWrapper: () => cy.get('.cloze-with-text-answer-status-response-preview-wrapper'),
+    tickIconWrapper: () => cy.get('.tick-icon-wrapper [data-name*="Rectangle"]'),
+    responseAreaNumeration: () => cy.get('.response-input-adornment'),
+    correctAnswerResponseWrapper: () => cy.get('.cloze-with-text-correct-response-wrapper .cloze-with-text-answer-status-response-preview-wrapper'),
+    correctAnswerResponse: () => cy.get('[class*="ResponseInputComponentstyles__ResponseInputWrapper"] input')
 }
 
 const steps = {
+    ...backgroundImageUploadComponent.steps,
     ...createQuestionBasePage.steps,
     ...questionInstructionsComponent.steps,
-    ...scoringSectionBase.steps,
-    ...additionalSettingsPanel.steps,
-    ...autoScoredSetCorrectAnswerSection.steps,
-    ...autoScoredPreviewBase.steps,
-    ...autoScoredSetCorrectAnswerSection.steps,
-    ...autoScoredScoringSection.steps,
-    ...autoScoredAdditionalSettings.steps,
-    ...specialCharactersFlyoutComponent.steps,
-    ...autoScoredScoringSectionMultipleResponsesType.steps,
-    ...answerNumerationComponent.steps,
-    ...figOverImageCommonComponent.steps,
-    ...uploadImageSectionComponent.steps,
-    ...fillInTheGapsTextCommonComponent.steps,
-    ...previewScoringAndShowCorrectAnswerComponent.steps,
     ...commonComponents.steps,
-    ...specialAndCustomSpecialCharactersComponent.steps,
+    ...scoringSectionBaseEditTab.steps,
+    ...autoScoredScoringPreviewTab.steps,
+    ...autoScoredSpecifyCorrectAnswerSection.steps,
+    ...autoScoredScoringSectionMultiResponseType.steps,
+    ...optionsWrapperComponent.steps,
+    ...figOverImageCanvasComponent.steps,
+    ...correctIncorrectAnswerLabelComponent.steps,
+    ...autoScoredStudentViewSettings.steps,
+    ...acceptedStudentInputComponent.steps,
     /**
-    * @param {number} responseContainerIndex Index of response container
-    * @param {number[]} responseContainerPositionCoordinates Position coordinates of the response container
-    * @description Verify position coordinates of response dropdown in preview tab
-    */
-    verifyResponseFieldPositionCoordinatesInPreviewTab: (responseContainerIndex, responseContainerPositionCoordinates) => {
-        fillInTheGapsTextCommonComponent.responseFieldPreviewTab()
-            .eq(responseContainerIndex)
-            .parents('.react-draggable')
-            .invoke('attr', 'style')
-            .then(($styleAttribute) => {
-                let transformValue = $styleAttribute;
-                let position = transformValue.split('(')[1]
-                    .split(')')[0]
-                    .split(',');
-                let horizontalCoordinate = position[0].trim();
-                let verticalCoordinate = position[1].trim();
-                expect(horizontalCoordinate).to.be.eq(responseContainerPositionCoordinates[0]);
-                expect(verticalCoordinate).to.be.eq(responseContainerPositionCoordinates[1]);
+     * Enter text in the answer input fields of the specify correct answer section.
+     * @param {Object[]} responses - An array of objects containing the responseIndex and responseText.
+     * @param {number} responses[].responseIndex - The index of the answer input field for each response.
+     * @param {string} responses[].responseText - The text to be entered in the respective answer input field.
+     * @example - enterTextInAnswerInputFieldsSpecifyCorrectAnswerSection([
+     *   { responseIndex: 0, responseText: "Answer 1" },
+     *   { responseIndex: 1, responseText: "Answer 2" },
+     * ]);
+     */
+    enterTextInAnswerInputFieldsSpecifyCorrectAnswerSection: (responses) => {
+        responses.forEach(({ responseIndex, responseText }) => {
+            utilities.getNthElement(fillInTheGapsOverImageTextPage.answerInputFieldSpecifyCorrectAnswerSection(), responseIndex)
+                .clear()
+                .type(responseText)
+                .blur();
+        });
+    },
+
+    /**
+     * Enter text in the answer input fields of the preview tab.
+     * @param {Object[]} responses - An array of objects containing the responseIndex and responseText.
+     * @param {number} responses[].responseIndex - The index of the answer input field for each response.
+     * @param {string} responses[].responseText - The text to be entered in the respective answer input field.
+     */
+    enterTextInAnswerInputFieldsPreviewTab: (responses) => {
+        responses.forEach(({ responseIndex, responseText }) => {
+            utilities.getNthElement(fillInTheGapsOverImageTextPage.answerInputFieldPreviewTab(), responseIndex)
+                .type(responseText)
+                .blur();
+        });
+    },
+
+    /**
+     * Verify text in the answer input fields of the preview tab.
+     * @param {Object[]} responses - An array of objects containing the responseIndex and responseText.
+     * @param {number} responses[].responseIndex - The index of the answer input field for each response.
+     * @param {string} responses[].responseText - The text to be verified in the respective answer input field.
+     */
+    verifyTextInAnswerInputFieldsPreviewTab: (responses) => {
+        responses.forEach(({ responseIndex, responseText }) => {
+            utilities.getNthElement(fillInTheGapsOverImageTextPage.answerInputFieldPreviewTab(), responseIndex)
+                .should('have.value', responseText)
+        });
+    },
+
+    /**
+     * Verify that a specific answer input field is disabled on the preview tab.
+     * @param {number} inputFieldIndex - The index of the disabled answer input field.
+     */
+    verifyAnswerInputFieldDisabled: (inputFieldIndex) => {
+        utilities.verifyElementDisabled(utilities.getNthElement(fillInTheGapsOverImageTextPage.answerInputFieldPreviewTab(), inputFieldIndex));
+    },
+
+    verifyCorrectAnswerSectionNotExists: () => {
+        utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.correctAnswerSectionWrapper(), 'notExist');
+    },
+
+    /**
+     * Verify that the incorrect option icon is displayed for a specific answer input field.
+     * @param {number} inputFieldIndex - The index of the answer input field to verify.
+     */
+    verifyIncorrectOptionIcon: (inputFieldIndex) => {
+        utilities.getNthElement(fillInTheGapsOverImageTextPage.responseStatusWrapper(), inputFieldIndex)
+            .within(() => {
+                utilities.verifyCSS(fillInTheGapsOverImageTextPage.tickIconWrapper(), {
+                    'fill': css.color.incorrectAnswer
+                });
             });
     },
 
     /**
-    * @param {number} rowIndex Index of the row in which response container is placed
-    * @param {number} responseContainerIndex Index of the response container
-    * @description Verify the vertical position of the response container as per the row
+     * Verify that the correct option icon is displayed for a specific answer input field.
+     * @param {number} inputFieldIndex - The index of the answer input field to verify.
+     */
+    verifyCorrectOptionIcon: (inputFieldIndex) => {
+        utilities.getNthElement(fillInTheGapsOverImageTextPage.responseStatusWrapper(), inputFieldIndex)
+            .within(() => {
+                utilities.verifyCSS(fillInTheGapsOverImageTextPage.tickIconWrapper(), {
+                    'fill': css.color.correctAnswer
+                });
+            });
+    },
+
+    /**
+     * Verify that both correct and incorrect option icons do not exist for a specific answer input field.
+     * @param {number} inputFieldIndex - The index of the answer input field to verify.
+     */
+    verifyCorrectIncorrectIconNotExist: (inputFieldIndex) => {
+        utilities.getNthElement(fillInTheGapsOverImageTextPage.responseStatusWrapper(), inputFieldIndex)
+            .within(() => {
+                utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.tickIconWrapper(), 'notExist');
+            });
+    },
+
+    verifyResponseAreaNumeration: () => {
+        fillInTheGapsOverImageTextPage.answerInputFieldPreviewTab()
+            .each(($element, index) => {
+                cy.wrap($element)
+                    .parents('.response-input-field')
+                    .within(() => {
+                        utilities.verifyTextContent(fillInTheGapsOverImageTextPage.responseAreaNumeration(), `${index + 1}`);
+                    });
+            });
+    },
+
+    /**
+     * 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(fillInTheGapsOverImageTextPage.correctAnswerResponseWrapper(), correctAnswerArray.length);
+        correctAnswerArray.forEach((correctAnswer, index) => {
+            fillInTheGapsOverImageTextPage.correctAnswerResponseWrapper()
+                .eq(index)
+                .within(() => {
+                    utilities.verifyInnerText(fillInTheGapsOverImageTextPage.responseAreaNumeration(), `${index + 1}`);
+                    fillInTheGapsOverImageTextPage.correctAnswerResponse()
+                        .should('have.value', correctAnswer);
+                });
+        });
+    },
+
+    /**
+     * @description Verify response accordion is collapsed in specify correct answer section
+     * @param {number} responseIndex index of response accordion
+     */
+    verifyResponseAccordionIsCollapsed: (responseIndex) => {
+        utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordion(), responseIndex)
+            .find('.ngie-accordion-summary')
+            .should('have.attr', 'aria-expanded', 'false');
+    },
+
+    /**
+   * @description Verify response accordion is expanded in specify correct answer section
+   * @param {number} responseIndex index of response accordion
+   */
+    verifyResponseAccordionIsExpanded: (responseIndex) => {
+        utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordion(), responseIndex)
+            .find('.ngie-accordion-summary')
+            .should('have.attr', 'aria-expanded', 'true');
+    },
+
+    /**
+     * @description Expand response accordion in specify correct answer section
+     * @param {number} responseIndex index of response accordion
+     */
+    expandResponseAccordionSpecifyCorrectAnswer: (responseIndex) => {
+        utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordion(), responseIndex)
+            .click();
+        fillInTheGapsOverImageTextPage.steps.verifyResponseAccordionIsExpanded(responseIndex);
+    },
+
+    /**
+     * @description Collapse response accordion in specify correct answer section
+     * @param {number} responseIndex index of response accordion
+     */
+    collapseResponseAccordionSpecifyCorrectAnswer: (responseIndex) => {
+        utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordionLabel(), responseIndex)
+            .click();
+        fillInTheGapsOverImageTextPage.steps.verifyResponseAccordionIsCollapsed(responseIndex);
+    },
+
+    /**
+     * Focus in and focus out of response accordion answer input field in specify correct answer section
+     * @param {number} answerFieldIndex answer input field index
+     */
+    focusInAndFocusOutOfResponseAnswerInputFieldSpecifyCorrectAnswer: (answerFieldIndex) => {
+        utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordionAnswerInputField(), answerFieldIndex)
+            .click()
+            .blur();
+    },
+
+    /**    
+     * Verify the points score displayed on response accordions
+     * @param {number} responseAccordionIndex index of response accordion
+     * @param {number} pointsPerResponse Points to be displayed on response accordion
+     */
+    verifyPointsDisplayedOnResponseAccordion: (responseAccordionIndex, pointsPerResponse) => {
+        utilities.verifyElementVisibilityState(utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordionPointsLabel(), responseAccordionIndex), 'visible');
+        utilities.verifyInnerText(utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordionPointsLabel(), responseAccordionIndex), 'Points:');
+        utilities.verifyElementVisibilityState(utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordionPointsScore(), responseAccordionIndex), 'visible');
+        utilities.verifyInnerText(utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordionPointsScore(), responseAccordionIndex), `${pointsPerResponse}`);
+    },
+
+    /**
+    * Click on response accordion add alternate button
+    * @param {number} responseAccordionIndex index of response accordion
+    */
+    addAlternateAnswerInResponseAccordion: (responseAccordionIndex) => {
+        utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordionAddAlternateButton(), responseAccordionIndex)
+            .click();
+    },
+
+    /**
+    * Verify the points input field and label displayed in response accordions
+    * @param {number} responseAccordionIndex index of response accordion
+    * @param {number} pointsInputFieldValue Points input field value
     */
-    verifyResponseContainerVerticalPosition: (rowIndex, responseContainerIndex) => {
-        let verticalCoordinate = '';
-        switch (rowIndex) {
-            case 1:
-                verticalCoordinate = '33px';
-                break;
-            case 2:
-                verticalCoordinate = '94px';
-                break;
-            default:
-                throw new Error('Invalid row index');
-        }
-        figOverImageCommonComponent.responseContainer()
-            .eq(responseContainerIndex)
-            .invoke('attr', 'style')
-            .then(($styleAttribute) => {
-                let transformValue = $styleAttribute;
-                let coordinatesArray = transformValue.split('(')[1]
-                    .split(')')[0]
-                    .split(',');
-                let responseVerticalCoordinate = coordinatesArray[1].trim();
-                expect(responseVerticalCoordinate).to.be.eq(verticalCoordinate);
+    verifyPointsLabelAndInputFieldInResponseAccordion: (responseAccordionIndex, pointsInputFieldValue) => {
+        utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordionPointsInputFieldWrapper(), responseAccordionIndex)
+            .within(() => {
+                utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.pointsLabel(), 'visible');
+                utilities.verifyInnerText(fillInTheGapsOverImageTextPage.pointsLabel(), 'Points');
+                utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.pointsInputField(), 'visible');
+                scoringSectionBaseEditTab.steps.verifyPointsFieldValue(pointsInputFieldValue);
+            });
+    },
+
+    /**
+   * allot points inside response accordion points input field
+   * @param {number} responseAccordionIndex index of response accordion
+   * @param {number} pointsInputFieldValue Points input field value to be allotted
+   */
+    allotPointsInResponseAccordion: (responseAccordionIndex, pointsInputFieldValue) => {
+        utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordionPointsInputFieldWrapper(), responseAccordionIndex)
+            .within(() => {
+                scoringSectionBaseEditTab.steps.allotPoints(pointsInputFieldValue);
             });
     }
 }
 
 const tests = {
-    ...commonComponents.tests,
-    ...createQuestionBasePage.tests,
-    ...questionInstructionsComponent.tests,
-    ...additionalSettingsPanel.tests,
-    ...scoringSectionBase.tests,
-    ...autoScoredSetCorrectAnswerSection.tests,
-    ...autoScoredAdditionalSettings.tests,
-    ...autoScoredScoringSection.tests,
-    ...specialCharactersFlyoutComponent.tests,
-    ...specialAndCustomSpecialCharactersComponent.tests,
-    ...previewScoringAndShowCorrectAnswerComponent.tests,
-    ...autoScoredScoringSectionMultipleResponsesType.tests,
-    ...answerNumerationComponent.tests,
-    ...uploadImageSectionComponent.tests,
-    ...fillInTheGapsTextCommonComponent.tests,
-    ...figOverImageCommonComponent.tests,
-    /**
-     * Verify minimum score awarded if attempted functionality when an incorrect answer is attempted.
-     * @param {number} minimumScoreIfAttemptedPoints - The minimum score awarded if attempted.
-     * @param {number} allocatedPoints - The expected allocated points for the question.
-     */
-    verifyMinimumScoreAwardedIfAttemptedFunctionalityForIncorrectAnswer: (minimumScoreIfAttemptedPoints, allocatedPoints) => {
-        it('When user has provided minimum score awarded (if attempted) points, then in preview tab on entering incorrect answer, minimum score should be provided for the question', () => {
-            cy.log('Switch to edit tab and set minimum score if attempted points')
-            fillInTheGapsOverImageTextPage.steps.switchToEditTab();
-            fillInTheGapsOverImageTextPage.steps.allotMinimumScoreAwardedIfAttempted(minimumScoreIfAttemptedPoints);
-            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
-            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldPreviewTab(0, 'Branch');
-            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldPreviewTab(1, 'Stem');
-            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabScoreText(`${minimumScoreIfAttemptedPoints}`, `${allocatedPoints}`);
+    ...autoScoredScoringPreviewTab.tests,
+    ...autoScoredSpecifyCorrectAnswerSection.tests,
+    ...scoringSectionBaseEditTab.tests,
+    ...autoScoredScoringSectionMultiResponseType.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(`When user has added a response token in image, then its corresponding response accordion \'Response 1\' should be displayed in the ${accordionName} accordion in expanded state`, () => {
+            utilities.verifyElementCount(fillInTheGapsOverImageTextPage.responseAccordion(), 1);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseAccordionIsExpanded(0);
+            utilities.verifyInnerText(utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordionLabel(), 0), 'Response 1');
         });
-    }
-}
 
+        it('When user focuses in and out of the response accordion \'Answer\' input field, \'Error: Answer is required.\' error message should be displayed', () => {
+            fillInTheGapsOverImageTextPage.steps.focusInAndFocusOutOfResponseAnswerInputFieldSpecifyCorrectAnswer(0, 0);
+            utilities.verifyElementVisibilityState(commonComponents.errorMessage(), 'visible');
+            utilities.verifyInnerText(commonComponents.errorMessage(), 'Error: Answer is required.');
+        });
+
+        it('When gives an input to \'Answer\' input field,then error message should disappear', () => {
+            fillInTheGapsOverImageTextPage.steps.enterTextInAnswerInputFieldsSpecifyCorrectAnswerSection([{ responseIndex: 0, responseText: 'Petals' }]);
+            commonComponents.steps.verifyErrorMessageIsNotDisplayed();
+        });
+
+        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');
+            acceptedStudentInputComponent.steps.verifyAcceptedStudentTypeMenuButtons(0);
+            acceptedStudentInputComponent.steps.verifyAcceptedStudentTypeActiveButton(0, 'Text');
+        });
+
+        it('User should be able to collapse response accordion', () => {
+            fillInTheGapsOverImageTextPage.steps.collapseResponseAccordionSpecifyCorrectAnswer(0);
+        });
+
+        autoScoredSpecifyCorrectAnswerSection.tests.verifyAutoScoredPointsErrorMessageWhenPointsFieldIsEmpty(accordionName);
+
+        it(`CSS of ${accordionName} accordion contents`, { tags: 'css' }, () => {
+            utilities.verifyCSS(utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordionLabel(), 0), {
+                'color': css.color.text,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.bold
+            });
+        });
+
+        it(`Accessibility of ${accordionName} accordion contents`, { tags: 'a11y' }, () => {
+            cy.checkAccessibility(utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordion(), 0).parents('[aria-label="Specify correct answer section"]'));
+        });
+    },
+
+    verifyContentsOfSpecifyCorrectAnswerSection: () => {
+        it('When user selects a scoring type then in the \'Correct\' accordion, all the contents should be displayed', () => {
+            utilities.verifyElementCount(fillInTheGapsOverImageTextPage.responseAccordion(), 2);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseAccordionIsExpanded(0);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseAccordionIsExpanded(1);
+            utilities.verifyInnerText(utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordionLabel(), 0), 'Response 1');
+            utilities.verifyInnerText(utilities.getNthElement(fillInTheGapsOverImageTextPage.responseAccordionLabel(), 1), 'Response 2');
+        });
+    },
+}
 
 export const fillInTheGapsOverImageTextPage = {
     ...selectors,
     steps,
     tests
-}
+}

package/cypress/pages/fillInTheGapsTextPage.js

@@ -1,4 +1,4 @@
-import { questionInstructionsComponent, scoringSectionBase, createQuestionBasePage, additionalSettingsPanel, commonComponents, autoScoredPreviewBase, autoScoredAdditionalSettings, autoScoredSetCorrectAnswerSection, autoScoredScoringSectionMultipleResponsesType, autoScoredScoringSection, fillInTheGapsCommonComponents, specialCharactersFlyoutComponent, specialAndCustomSpecialCharactersComponent, previewScoringAndShowCorrectAnswerComponent } from "./components";
+import { questionInstructionsComponent, scoringSectionBase, createQuestionBasePage, additionalSettingsPanel, commonComponents, autoScoredPreviewBase, autoScoredAdditionalSettings, autoScoredSetCorrectAnswerSection, autoScoredScoringSectionMultipleResponsesType, autoScoredScoringSection, fillInTheGapsCommonComponents, specialCharactersFlyoutComponent, specialAndCustomSpecialCharactersComponent, previewScoringAndShowCorrectAnswerComponent, questionInputFieldComponent } from "./components";
 import { answerNumerationComponent } from "./components/answerNumerationComponent";
 const css = Cypress.env('css');
 
@@ -17,6 +17,7 @@ const selectors = {
     ...specialAndCustomSpecialCharactersComponent,
     ...previewScoringAndShowCorrectAnswerComponent,
     ...answerNumerationComponent,
+    ...questionInputFieldComponent,
     setCorrectAnswerResponseField: () => cy.get('.response-input-field input[type="text"]'),
     caseSensitiveLabel: () => cy.get('[data-ngie-testid="case-sensitive-checkbox"] .MuiFormControlLabel-label'),
     ignoreSpacesBeforeAndAfterLabel: () => cy.get('[data-ngie-testid="ignore-spaces-before-and-after-checkbox"] .MuiFormControlLabel-label'),
@@ -56,6 +57,7 @@ const steps = {
     ...specialCharactersFlyoutComponent.steps,
     ...autoScoredScoringSectionMultipleResponsesType.steps,
     ...answerNumerationComponent.steps,
+    ...questionInputFieldComponent.steps,
     expandResponseAccordion: (responseIndex) => {
         fillInTheGapsTextPage.responseAccordionWrapper()
             .eq(responseIndex)
@@ -119,6 +121,7 @@ const tests = {
     ...previewScoringAndShowCorrectAnswerComponent.tests,
     ...autoScoredScoringSectionMultipleResponsesType.tests,
     ...answerNumerationComponent.tests,
+    ...questionInputFieldComponent.tests,
     verifySetCorrectAnswerTabContentsAndFunctionality: (tabName) => {
         it(`CSS of ${tabName} contents`, { tags: 'css' }, () => {
             fillInTheGapsTextPage.setCorrectAnswerResponseFieldLabel()

package/cypress/pages/index.js

@@ -1,4 +1,5 @@
 export * from './multipleSelectionPage';
+export * from './singleSelectionPage';
 export * from './createItemPage';
 export * from './selectQuestionResourceToolPage';
 export * from './dialogBoxBase';
@@ -32,4 +33,11 @@ export * from './itemPreviewSettingsPage';
 export * from './itemPreviewPage';
 export * from './studentViewPage';
 export * from './gradingViewPage';
-export * from './correctAnswerViewPage';
+export * from './correctAnswerViewPage';
+export * from './rulerPage';
+export * from './desmosToolPage';
+export * from './desmosGraphingPage';
+export * from './drawingResponsePage';
+export * from './protractorPage';
+export * from './textEntryMathPage';
+export * from './fillInTheGapsOverImageDragAndDropPage';

package/cypress/pages/itemPreviewPage.js

@@ -1,4 +1,4 @@
-import { createQuestionBasePage, autoScoredPreviewBase } from "./components";
+import { createQuestionBasePage, autoScoredPreviewBase, autoScoredScoringPreviewTab } from "./components";
 
 const selectors = {
     referenceID: () => cy.get('.edit-item-reference-id'),
@@ -7,6 +7,7 @@ const selectors = {
 const steps = {
     ...createQuestionBasePage.steps,
     ...autoScoredPreviewBase.steps,
+    ...autoScoredScoringPreviewTab.steps,
     getItemReferenceID: () => {
         const itemRefID = [];
         itemPreviewPage.referenceID()