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

package/cypress/pages/rulerPage.js

@@ -280,11 +280,15 @@ const steps = {
     },
 
     verifyLengthOfRulerInPreview: (length) => {
-        let lengthOfRuler = length.replaceAll(' ', '')
+        let lengthOfRuler = length.replace(/\s|-/g, '');
         rulerPage.rulerPreviewTab()
             .find('svg g')
             .eq(0)
-            .should('have.attr', 'data-name', `Ruler ${lengthOfRuler}`);
+            .invoke('attr', 'data-name')
+            .then((dataName) => {
+                const trimmedDataName = dataName.trim().replace(/\s|-/g, '');
+                expect(trimmedDataName).to.equal(`Ruler${lengthOfRuler}`);
+            });
     },
 
     verifyColorOfRulerInPreview: (colorIndex) => {

package/cypress/pages/textSelectionPage.js

@@ -1,6 +1,6 @@
 import constants from "../fixtures/constants";
 import utilities from "../support/helpers/utilities";
-import { createQuestionBasePage, autoScoredScoringPreviewTab, scoringSectionBaseEditTab, questionInputFieldComponent, questionInstructionsComponent, autoScoredStudentViewSettings, correctIncorrectAnswerLabelComponent, autoScoredSpecifyCorrectAnswerSection, autoScoredScoringSectionMultiResponseType, setPointsPopupBase, commonComponents } from "./components";
+import { createQuestionBasePage, autoScoredScoringPreviewTab, scoringSectionBaseEditTab, questionInputFieldComponent, questionInstructionsComponent, autoScoredStudentViewSettings, correctIncorrectAnswerLabelComponent, autoScoredSpecifyCorrectAnswerSection, autoScoredScoringSectionMultiResponseType, setPointsPopupBase, commonComponents, ckEditorToolbar, equationEditorFlyout, studentViewSettingsLabelComponent, enableOuterBorderComponent, additionalSettingsPanel, additionalSettingsAccessibilitySectionComponent, styleAndLayoutCustomizationAccordionComponent, colorPopupComponent } from "./components";
 import { dialogBoxBase } from "./dialogBoxBase";
 const css = Cypress.env('css');
 const colorLibrary = css.textSelectionColorLibrary;
@@ -12,8 +12,15 @@ const selectors = {
     ...autoScoredScoringSectionMultiResponseType,
     ...setPointsPopupBase,
     ...commonComponents,
+    ...enableOuterBorderComponent,
+    ...autoScoredScoringPreviewTab,
+    ...additionalSettingsPanel,
+    ...correctIncorrectAnswerLabelComponent,
+    ...colorPopupComponent,
+    questionLabel: () => cy.get('[class*="Highlightstyles__QuestionComponentWrapper"] .title-casing'),
     questionInputField: () => cy.get('[class*="Highlightstyles__QuestionComponentWrapper"] [title="Question"]'),
-    specifyPossibleOptionsTextFieldWrapper: () => cy.get('[class*="Highlightstyles__HighLightWrapper"]'),
+    specifyPossibleOptionsTextFieldWrapper: () => cy.get('[class*="Highlightstyles__HighLightWrapper"] .question-text-wrapper'),
+    textSelectionModeLabel: () => cy.get('.text-selection-mode .options-label'),
     textSelectionMode: (ariaLabel = null) => {
         if (ariaLabel) {
             return cy.get(`.text-selection-mode [type="button"][aria-label*="${ariaLabel}"]`)
@@ -21,15 +28,57 @@ const selectors = {
             return cy.get('.text-selection-mode [type="button"]')
         }
     },
+    textSelectionModeButtonLabel: (ariaLabel = null) => {
+        if (ariaLabel) {
+            return cy.get(`.text-selection-mode [type="button"][aria-label*="${ariaLabel}"] .ngie-toggle-button-label`)
+        } else {
+            return cy.get('.text-selection-mode [type="button"] .ngie-toggle-button-label')
+        }
+    },
+    specifyPossibleOptionsLabel: () => cy.get('[class*="Highlightstyles__LabelWrapper"]'),
     specifyPossibleOptionsTextSpans: () => cy.get('[class*="Highlightstyles__HighLightWrapper"] span'),
+    specifyPossibleOptionsTextParagraphs: () => cy.get('[class*="Highlightstyles__HighLightWrapper"] p'),
+    optionSpan: () => cy.get('span'),
+    selectedOptionSpecifyPossibleOptions: () => cy.get('[class*="Highlightstyles__HighLightWrapper"] .highlighted'),
+    selectedOptionCounterSpecifyPossibleOptions: () => cy.get('[class*="Highlightstyles__CountWrapper"]'),
+    selectAllOptionsButton: () => cy.get('button[class*="Highlightstyles__IconButton"]').eq(0),
+    undoButton: () => cy.get('button[class*="Highlightstyles__IconButton"]').eq(3),
+    redoButton: () => cy.get('button[class*="Highlightstyles__IconButton"]').eq(3),
+    clearOptionsButton: () => cy.get('button[class*="Highlightstyles__IconButton"]').eq(3),
 
     //Specify correct answer section
+    specifyCorrectAnswerTextWrapper: () => cy.get('[class*="Highlightstyles__Wrapper"] .question-text-wrapper'),
     specifyCorrectAnswerTextSpans: () => cy.get('[class*="Highlightstyles__Wrapper"] span'),
+    specifyCorrectAnswerTextParagraphs: () => cy.get('[class*="Highlightstyles__Wrapper"] p'),
     optionSpecifyCorrectAnswer: () => cy.get('[class*="Highlightstyles__Wrapper"] .highlighted'),
     setPointsButton: () => cy.get('[class*="SetPointsPopupWrapper"] button'),
+    maximumOptionsCanBeSelectedErrorMessage: () => cy.get('[class*="Highlightstyles__AuthoringErrorMsg"]'),
+    maximumOptionsCanBeSelectedErrorMessagePreviewTab: () => cy.get('[class*="Highlightstyles__ErrorMessage"]'),
+    maximumOptionsCanBeSelectedErrorMessageWrapperPreviewTab: () => cy.get('.preview-selection-limit-error-wrapper'),
+
+    //Student view settings
+    showAvailableOptionsToStudentsLabel: () => cy.get('[data-ngie-testid="show-the-available-options-to-students-checkbox"] [class*="label"]'),
+    showAvailableOptionsToStudentsCheckbox: () => cy.get('[data-ngie-testid="show-the-available-options-to-students-checkbox"] input'),
+    maxNumberOfPossibleSelectionsLabel: () => cy.get('#Maximum-number-of-possible-selections-dropdown-label'),
+    maxNumberOfPossibleSelectionsDropdown: () => cy.get('#Maximum-number-of-possible-selections-select'),
+    showStudentMaximumNumberOfPossibleSelectionsCheckbox: () => cy.get('[data-ngie-testid="show-student-the-maximum-number-of-possible-selections-checkbox"] input'),
+    showStudentMaximumNumberOfPossibleSelectionsLabel: () => cy.get('[data-ngie-testid="show-student-the-maximum-number-of-possible-selections-checkbox"] [class*="label"]'),
+    maximumNumberOfSelectionsHelpText: () => cy.get('[class*="Highlightstyles__LimitWrapper"]'),
+
+    //Style and customization layout
+    filledInStyleLabel: () => cy.get('.text-selection-style-title'),
+    fillColorLabel: () => cy.get('[class*="StyleAndLayoutCustomizationstyles__SubSectionLabel"]'),
+    colorBlock: () => cy.get('.color-picker-block'),
+    editColorButton: () => cy.get('.ngie-icon-with-label-btn[aria-label="edit color"]'),
+    changeFontColorToWhiteCheckbox: () => cy.get('[data-ngie-testid="change-font-color-to-white-checkbox"] input'),
+    changeFontColorToWhiteCheckboxLabel: () => cy.get('[data-ngie-testid="change-font-color-to-white-checkbox"] [class*="label"]'),
 
     //Preview tab
+    questionTextOuterBorderPreviewTab: () => cy.get('[class*="Highlightstyles__HighlightPreviewWrapper"]'),
     questionTextPreviewTab: () => cy.get('[class*="Highlightstyles__HighlightPreviewWrapper"] [class*="QuestionTextstyle__QuestionTextWrapper"] p'),
+    previewTabQuestionTextParagraphs: () => cy.get('[class*="Highlightstyles__HighlightPreviewWrapper"] [class*="QuestionTextstyle__QuestionTextWrapper"] p'),
+    previewTabQuestionTextSpans: () => cy.get('[class*="Highlightstyles__HighlightPreviewWrapper"] [class*="QuestionTextstyle__QuestionTextWrapper"] span'),
+    questionTextWrapperPreviewTab: () => cy.get('[class*="Highlightstyles__HighlightPreviewWrapper"] [class*="QuestionTextstyle__QuestionTextWrapper"]'),
     optionPreviewTab: () => cy.get('[class*="Highlightstyles__HighlightPreviewWrapper"] .highlighted'),
     optionCorrectAnswerSection: () => cy.get('[class*="Highlightstyles__Wrapper"]').eq(1).find('.highlighted'),
     correctAnswerSection: () => cy.get('[class*="Highlightstyles__Wrapper"]').eq(1),
@@ -50,6 +99,12 @@ const steps = {
     ...setPointsPopupBase.steps,
     ...commonComponents.steps,
     ...dialogBoxBase.steps,
+    ...ckEditorToolbar.steps,
+    ...equationEditorFlyout.steps,
+    ...enableOuterBorderComponent.steps,
+    ...additionalSettingsPanel.steps,
+    ...styleAndLayoutCustomizationAccordionComponent.steps,
+    ...colorPopupComponent.steps,
     addInputToQuestionInputField: (text) => {
         textSelectionPage.questionInputField()
             .type(text);
@@ -78,7 +133,7 @@ const steps = {
     },
 
     verifyErroredStateOfSpecifyPossibleOptionsSection: () => {
-        utilities.verifyCSS(textSelectionPage.specifyPossibleOptionsTextFieldWrapper(), {
+        utilities.verifyCSS(textSelectionPage.specifyPossibleOptionsTextFieldWrapper().parent(), {
             'border-color': css.color.errorFieldBorder,
             'background-color': css.color.errorFieldBg
         });
@@ -140,6 +195,62 @@ const steps = {
             .should('have.text', 'This is Bold text input.lorem');
     },
 
+    verifyImageAndAltTextInSpecifyCorrectAnswerSection: () => {
+        textSelectionPage.specifyCorrectAnswerTextWrapper()
+            .find('img')
+            .should('have.attr', 'src', constants.foxImageLink)
+            .and('have.attr', 'alt', constants.foxImageAltText);
+    },
+
+    verifyEquationInSpecifyCorrectAnswerSection: () => {
+        textSelectionPage.specifyCorrectAnswerTextWrapper()
+            .find('span[role="math"]')
+            .should('have.attr', 'aria-label', constants.CKEditorInputFieldEnteredEquationAriaLabel)
+            .contains(constants.CKEditorInputFieldEnteredEquationText);
+    },
+
+    verifyLinkInSpecifyCorrectAnswerSection: () => {
+        textSelectionPage.specifyCorrectAnswerTextWrapper()
+            .find('a')
+            .should('have.text', 'lorem')
+            .and('have.attr', 'href', `${Cypress.config().baseUrl}`);
+    },
+
+    verifyBoldTextInSpecifyCorrectAnswerSection: () => {
+        textSelectionPage.specifyCorrectAnswerTextWrapper()
+            .find('strong')
+            .should('exist')
+            .should('have.text', 'This is Bold text input.lorem');
+    },
+
+    verifyImageAndAltTextInPreviewTab: () => {
+        textSelectionPage.questionTextWrapperPreviewTab()
+            .find('img')
+            .should('have.attr', 'src', constants.foxImageLink)
+            .and('have.attr', 'alt', constants.foxImageAltText);
+    },
+
+    verifyEquationInPreviewTab: () => {
+        textSelectionPage.questionTextWrapperPreviewTab()
+            .find('span[role="math"]')
+            .should('have.attr', 'aria-label', constants.CKEditorInputFieldEnteredEquationAriaLabel)
+            .contains(constants.CKEditorInputFieldEnteredEquationText);
+    },
+
+    verifyLinkInPreviewTab: () => {
+        textSelectionPage.questionTextWrapperPreviewTab()
+            .find('a')
+            .should('have.text', 'lorem')
+            .and('have.attr', 'href', `${Cypress.config().baseUrl}`);
+    },
+
+    verifyBoldTextInPreviewTab: () => {
+        textSelectionPage.questionTextWrapperPreviewTab()
+            .find('strong')
+            .should('exist')
+            .should('have.text', 'This is Bold text input.lorem');
+    },
+
     verifySpecifyPossibleOptionsFieldErrorMessage: () => {
         textSelectionPage.specifyPossibleOptionsTextFieldWrapper()
             .next()
@@ -155,6 +266,24 @@ const steps = {
             .click();
     },
 
+    /**
+     * @param {string} textSelectionType Type of text selection
+     * @description Verify text selection mode is selected
+     */
+    verifyTextSelectionModeIsSelected: (textSelectionType) => {
+        textSelectionPage.textSelectionMode(textSelectionType)
+            .should('have.attr', 'aria-pressed', 'true');
+    },
+
+    /**
+     * @param {string} textSelectionType Type of text selection
+     * @description Verify text selection mode is not selected
+     */
+    verifyTextSelectionModeIsNotSelected: (textSelectionType) => {
+        textSelectionPage.textSelectionMode(textSelectionType)
+            .should('have.attr', 'aria-pressed', 'false');
+    },
+
     /**
      * @param {string} optionText Text of the option in specify possible options section
      * @description Click on option in specify possible options section
@@ -182,7 +311,7 @@ const steps = {
     clickOnOptionInPreviewTab: (optionText) => {
         textSelectionPage.optionPreviewTab()
             .contains(optionText)
-            .click();
+            .realClick();
     },
 
     /**
@@ -246,18 +375,21 @@ const steps = {
 
     /**
     * @param {string} optionText Text of the option in specify possible options section
+     * @param {string} selectionColor type of color used for selection of option
     * @description Verify hover state of the deselected option in specify possible options section
+     * @example verifyHoverStateOfDeselectedOptionInSpecifyPossibleOptionsSection('Sample text', "blue")
     */
-    verifyHoverStateOfDeselectedOptionInSpecifyPossibleOptionsSection: (optionText) => {
+    verifyHoverStateOfDeselectedOptionInSpecifyPossibleOptionsSection: (optionText, selectionColor) => {
         textSelectionPage.steps.hoverOnDeselectedOptionInSpecifyPossibleOptionsSection(optionText);
         utilities.verifyCSS(textSelectionPage.specifyPossibleOptionsTextSpans()
             .contains(optionText), {
             'color': css.color.text,
             'font-size': css.fontSize.default,
             'font-weight': css.fontWeight.regular,
-            'background-color': colorLibrary.selectionColor.hoverBackground,
-            'border': `1px solid ${colorLibrary.selectionColor.hoverBorder}`
+            'background-color': colorLibrary[selectionColor].hoverBackground,
+            'border': `2px solid ${colorLibrary[selectionColor].hoverBorder}`
         });
+        utilities.hoverAwayFromElement(textSelectionPage.specifyPossibleOptionsTextSpans().contains(optionText));
     },
 
     /**
@@ -335,18 +467,21 @@ const steps = {
     },
 
     /**
-     * @param {string} optionText Text of the option in set correct answer section
-     * @description Verify hover state of the deselected option in set correct answer section
+     * @param {string} optionText Text of the option in specify correct answer section
+     * @param {string} selectionColor type of color used for selection of option
+     * @description Verify hover state of the deselected option in specify correct answer section
+     * @example verifyHoverStateOfDeselectedOptionInSpecifyCorrectAnswerSection('Sample text', "blue")
      */
-    verifyHoverStateOfDeselectedOptionInSpecifyCorrectAnswerSection: (optionText) => {
+    verifyHoverStateOfDeselectedOptionInSpecifyCorrectAnswerSection: (optionText, selectionColor) => {
         textSelectionPage.steps.hoverOnDeselectedOptionInSpecifyCorrectAnswerSection(optionText);
         utilities.verifyCSS(textSelectionPage.optionSpecifyCorrectAnswer().contains(optionText), {
             'color': css.color.text,
             'font-size': css.fontSize.default,
             'font-weight': css.fontWeight.regular,
-            'background-color': colorLibrary.selectionColor.hoverBackground,
-            'border': `1px solid ${colorLibrary.selectionColor.hoverBorder}`
+            'background-color': colorLibrary[selectionColor].hoverBackground,
+            'border': `2px solid ${colorLibrary[selectionColor].hoverBorder}`
         });
+        utilities.hoverAwayFromElement(textSelectionPage.optionSpecifyCorrectAnswer().contains(optionText));
     },
 
     /**
@@ -381,11 +516,24 @@ const steps = {
         });
     },
 
+    /**
+   * @param {string} optionText Text of the option in preview tab
+    * @example verifyOptionIsDisplayedToStudentsInPreviewTab('Sample text')
+    */
+    verifyOptionIsDisplayedToStudentsInPreviewTab: (optionText) => {
+        utilities.verifyCSS(textSelectionPage.optionPreviewTab().contains(optionText), {
+            'color': css.color.text,
+            'font-size': css.fontSize.default,
+            'font-weight': css.fontWeight.regular,
+            'background-color': colorLibrary["blue"].hoverBackground
+        });
+    },
+
     /**
     * @param {string} optionText Text of the option in preview tab
-     * @example verifyDeselectedStateOptionInPreviewTab('Sample text')
+     * @example verifyStandardStateOptionInPreviewTab('Sample text')
      */
-    verifyDeselectedStateOptionInPreviewTab: (optionText) => {
+    verifyStandardStateOptionInPreviewTab: (optionText) => {
         utilities.verifyCSS(textSelectionPage.optionPreviewTab().contains(optionText), {
             'color': css.color.text,
             'font-size': css.fontSize.default,
@@ -545,6 +693,36 @@ const steps = {
         textSelectionPage.steps.clickOnOptionInSpecifyPossibleOptionsSection(paragraphTextArray[5]);
     },
 
+    /**
+   * @param {number[]} pointsArray Array of partial different points for options
+   * @description Add points to options in set points popup
+   */
+    addPartialDifferentWeightsPointsInSetPointsPopup: (pointsArray) => {
+        textSelectionPage.setPointsButton()
+            .click();
+        setPointsPopupBase.steps.allotPointsToSetPointsPopupPointsInputField(pointsArray);
+        setPointsPopupBase.steps.saveSetPointsPopup();
+    },
+
+    /**
+     * Verify non-optional text is not interactive in preview tab
+     * @param {string} optionText Non-optional text in preview tab
+     */
+    verifyNonOptionTextIsNotInteractiveInPreviewTab: (optionText) => {
+        utilities.hoverOverElement(textSelectionPage.questionTextPreviewTab().contains(optionText));
+        utilities.verifyCSS(textSelectionPage.questionTextPreviewTab().contains(optionText), {
+            'background-color': css.color.transparent
+        });
+        utilities.hoverAwayFromElement(textSelectionPage.questionTextPreviewTab().contains(optionText));
+        textSelectionPage.questionTextPreviewTab()
+            .contains(optionText)
+            .click();
+        textSelectionPage.questionTextPreviewTab()
+            .contains(optionText)
+            .should('not.have.class', 'correct_answer')
+            .and('have.attr', 'aria-checked', 'false');
+    },
+
     /**
     * @param {number[]} pointsArray Array of partial different points for options
     * @description Add points to options in set points popup
@@ -575,7 +753,6 @@ const steps = {
     selectOptionInSpecifyPossibleOptionsSection: (textSelectionType, optionText) => {
         if (textSelectionType === 'Custom') {
             textSelectionPage.specifyPossibleOptionsTextFieldWrapper()
-                .find('.question-text-wrapper')
                 .selectText(optionText);
             textSelectionPage.steps.verifyOptionIsSelectedInSpecifyPossibleOptionsSection(optionText);
         } else {
@@ -585,7 +762,6 @@ const steps = {
     },
 
     /**
-     * @param {string} textSelectionType Type of text selection 
      * @param {*} optionText Text of the option in specify possible options section
      * @description Deselect an option in specify possible options section
      */
@@ -607,6 +783,103 @@ const steps = {
         utilities.verifyInnerText(autoScoredScoringSectionMultiResponseType.penaltyPointsDetailsSectionAllottedPointsLabel(), `Penalty points for each incorrect answer: ${penaltyPoints}`);
     },
 
+    /**
+     * @description Verify text and options displayed in specify correct answer section
+     * @param {string[]} textArray array of span-vise text in specify correct answer section 
+     * @param {string[]} optionsArray array of options in specify correct answer section
+     */
+    verifySpecifyCorrectAnswerTextAndOptions: (textArray, optionsArray) => {
+        textArray.forEach((text, index) => {
+            utilities.verifyInnerText(utilities.getNthElement(textSelectionPage.specifyCorrectAnswerTextSpans(), index), text);
+            utilities.verifyElementVisibilityState(utilities.getNthElement(textSelectionPage.specifyCorrectAnswerTextSpans(), index), 'visible');
+        });
+        optionsArray.forEach((optionText, index) => {
+            utilities.verifyInnerText(utilities.getNthElement(textSelectionPage.optionSpecifyCorrectAnswer(), index), optionText);
+        });
+        utilities.verifyElementCount(textSelectionPage.optionSpecifyCorrectAnswer(), optionsArray.length);
+    },
+
+    /**
+     * 
+    * @param {string} optionText Text of the option in preview tab
+     * @param {string} selectionColor type of color used for selection of option
+     * @example verifySelectedStateOptionInPreviewTab('Sample text', "blue")
+     */
+    verifySelectedStateOptionInSpecifyCorrectAnswerSection: (optionText, selectionColor) => {
+        utilities.verifyCSS(textSelectionPage.optionSpecifyCorrectAnswer().contains(optionText), {
+            'color': css.color.whiteText,
+            'font-size': css.fontSize.default,
+            'font-weight': css.fontWeight.regular,
+            'background-color': colorLibrary[selectionColor].background
+        });
+    },
+
+    /**
+     * 
+    * @param {string} optionText Text of the option in preview tab
+     * @param {string} selectionColor type of color used for selection of option
+     * @example verifySelectedStateOptionInPreviewTab('Sample text', "blue")
+     */
+    verifySelectedStateOptionInSpecifyPossibleOptionSection: (optionText, selectionColor) => {
+        utilities.verifyCSS(textSelectionPage.selectedOptionSpecifyPossibleOptions().contains(optionText), {
+            'color': css.color.whiteText,
+            'font-size': css.fontSize.default,
+            'font-weight': css.fontWeight.regular,
+            'background-color': colorLibrary[selectionColor].background
+        });
+    },
+
+    /**
+     * @param {number} selectedOptionCount Value of counter
+     * @description Verify option counter text and value
+     */
+    verifyOptionCounterTextAndValue: (selectedOptionCount) => {
+        utilities.verifyTextContent(textSelectionPage.selectedOptionCounterSpecifyPossibleOptions(), `Option count: ${selectedOptionCount}`);
+    },
+
+    clearSelectedOptionsInSpecifyPossibleOptionSection: () => {
+        textSelectionPage.steps.clickOnClearOptionsButtonInSpecifyPossibleOptionSection();
+        textSelectionPage.steps.clickOnAcceptButtonInDialogBox();
+    },
+
+    clickOnClearOptionsButtonInSpecifyPossibleOptionSection: () => {
+        textSelectionPage.clearOptionsButton()
+            .click();
+    },
+
+    verifyClearPopupForClearingOptionSelection: () => {
+        utilities.verifyElementVisibilityState(textSelectionPage.dialogBox(), 'visible');
+        utilities.verifyInnerText(textSelectionPage.dialogBoxTitle(), 'Clear');
+        utilities.verifyInnerText(textSelectionPage.dialogBoxContent(), 'Are you sure you want to clear all options? This action will not delete template content but remove all options.');
+        utilities.verifyInnerText(textSelectionPage.buttonReject(), 'Cancel');
+        utilities.verifyInnerText(textSelectionPage.buttonAccept(), 'Confirm');
+    },
+
+    /**
+     * @param {number} paragraphIndex Index of the paragraph in specify possible options section
+     * @param {number} numberOfOptions Number of options inside the paragraph in specify possible options section
+     * @description Verify number of options inside a paragraph in specify possible options section
+     */
+    verifyNumberOfOptionsInAParagraphInSpecifyPossibleOptionsSection: (paragraphIndex, numberOfOptions) => {
+        textSelectionPage.specifyPossibleOptionsTextParagraphs()
+            .eq(paragraphIndex)
+            .within(() => {
+                utilities.verifyElementCount(textSelectionPage.optionSpan(), numberOfOptions)
+            });
+    },
+
+    verifySelectAllOptionsButtonIsDisplayed: () => {
+        utilities.verifyElementVisibilityState(textSelectionPage.selectAllOptionsButton(), 'visible');
+        textSelectionPage.selectAllOptionsButton()
+            .should('have.attr', 'aria-label', 'Select all options');
+    },
+
+    verifyQuestionTextOuterBorderIsDisplayedInPreviewTab: () => {
+        utilities.verifyCSS(textSelectionPage.questionTextOuterBorderPreviewTab(), {
+            'border': `1px solid ${css.color.outerBorder}`
+        });
+    },
+
     /**
      * Verify non-optional text is not interactive in preview tab
      * @param {string} optionText Non-optional text in preview tab
@@ -616,14 +889,126 @@ const steps = {
         utilities.verifyCSS(textSelectionPage.questionTextPreviewTab().contains(optionText), {
             'background-color': css.color.transparent
         });
-        utilities.hoverAwayFromElement(textSelectionPage.questionTextPreviewTab().contains(optionText));
-        textSelectionPage.questionTextPreviewTab()
-            .contains(optionText)
+    },
+
+    verifyQuestionTextOuterBorderIsNotDisplayedInPreviewTab: () => {
+        utilities.verifyCSS(textSelectionPage.questionTextOuterBorderPreviewTab(), {
+            'border-width': '0px'
+        });
+    },
+
+    verifyShowAvailableOptionsToStudentsCheckboxIsUnchecked: () => {
+        textSelectionPage.showAvailableOptionsToStudentsCheckbox()
+            .should('not.be.checked');
+    },
+
+    verifyShowAvailableOptionsToStudentsCheckboxIsChecked: () => {
+        textSelectionPage.showAvailableOptionsToStudentsCheckbox()
+            .should('be.checked');
+    },
+
+    uncheckShowAvailableOptionsToStudentsCheckbox: () => {
+        textSelectionPage.showAvailableOptionsToStudentsCheckbox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    checkShowAvailableOptionsToStudentsCheckbox: () => {
+        textSelectionPage.showAvailableOptionsToStudentsCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    expandMaxNumberOfPossibleSelectionsDropdown: () => {
+        textSelectionPage.maxNumberOfPossibleSelectionsDropdown()
             .click();
-        textSelectionPage.questionTextPreviewTab()
-            .contains(optionText)
-            .should('not.have.class', 'correct_answer')
-            .and('have.attr', 'aria-checked', 'false');
+    },
+
+    /**
+     * Verify maximum number of possible selections dropdown options
+     * @param {string[]} options array of dropdown options 
+     */
+    verifyMaxNumberOfPossibleSelectionsDropdownListOptions: (options) => {
+        options.forEach((option, count) => {
+            utilities.verifyInnerText(utilities.getNthElement(textSelectionPage.dropdownListOption(), count), option);
+        });
+    },
+
+    /**
+    * @param {string} listOption - The option to be selected from the maximum number of possible selections dropdown
+    * @description Selects an option from the maximum number of possible selections dropdown. The dropdown options are dependent on the number of available options.
+    */
+    selectOptionFromMaxNumberOfPossibleSelectionsDropdown: (listOption) => {
+        textSelectionPage.dropdownListOption()
+            .contains(listOption)
+            .click();
+    },
+
+    verifyShowStudentTheMaxNumberOfSelectionsCheckboxIsUnchecked: () => {
+        textSelectionPage.showStudentMaximumNumberOfPossibleSelectionsCheckbox()
+            .should('not.be.checked');
+    },
+
+    checkShowStudentTheMaxNumberOfSelectionsCheckbox: () => {
+        textSelectionPage.showStudentMaximumNumberOfPossibleSelectionsCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    clickOnEditColorButton: () => {
+        textSelectionPage.editColorButton()
+            .click();
+    },
+
+    /**
+     * @description select a color block in style and customization layout accordion
+     * @param {number} index index of color block
+     */
+    selectColorBlock: (index) => {
+        utilities.getNthElement(textSelectionPage.colorBlock(), index)
+            .click()
+            .should('have.attr', 'aria-pressed', 'true');
+    },
+
+    /**
+     * @description verify that a color block is selected in style and customization layout accordion
+     * @param {number} index index of color block
+     */
+    verifyColorBlockIsSelected: (index) => {
+        utilities.getNthElement(textSelectionPage.colorBlock(), index)
+            .should('have.attr', 'aria-pressed', 'true');
+    },
+
+    /**
+     * @description verify the background color of a color block in style and customization layout accordion
+     * @param {number} index index of color block
+     * @param {string} color background color value of the color block in rgba format
+     */
+    verifyColorBlockBackgroundColor: (index, color) => {
+        utilities.verifyCSS(utilities.getNthElement(textSelectionPage.colorBlock(), index), {
+            'background-color': color
+        });
+    },
+
+    verifyChangeFontColorToWhiteCheckboxIsChecked: () => {
+        textSelectionPage.changeFontColorToWhiteCheckbox()
+            .should('be.checked');
+    },
+
+    uncheckChangeFontColorToWhiteCheckbox: () => {
+        textSelectionPage.changeFontColorToWhiteCheckbox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    /**
+     * @description select a color block in style and customization layout accordion
+     * @param {number} index index of color block
+     */
+    selectAColorBlock: (index) => {
+        utilities.getNthElement(textSelectionPage.colorBlock(), index)
+            .click();
+        textSelectionPage.steps.verifyColorBlockIsSelected(index)
     }
 }
 
@@ -632,6 +1017,15 @@ const tests = {
     ...scoringSectionBaseEditTab.tests,
     ...autoScoredScoringSectionMultiResponseType.tests,
     ...commonComponents.tests,
+    ...autoScoredSpecifyCorrectAnswerSection.tests,
+    ...questionInstructionsComponent.tests,
+    ...studentViewSettingsLabelComponent.tests,
+    ...enableOuterBorderComponent.tests,
+    ...autoScoredStudentViewSettings.tests,
+    ...createQuestionBasePage.tests,
+    ...additionalSettingsPanel.tests,
+    ...additionalSettingsAccessibilitySectionComponent.tests,
+    ...styleAndLayoutCustomizationAccordionComponent.tests,
     verifyContentsOfSpecifyCorrectAnswerSection: () => {
         it('When user selects a scoring type, then in the \'Correct\' accordion all the contents should be displayed', () => {
             textSelectionPage.specifyCorrectAnswerTextSpans()
@@ -641,6 +1035,50 @@ 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('When the user selects the options as correct answer, then the selected answer should be set as correct answer', () => {
+            textSelectionPage.steps.selectOptionInSpecifyCorrectAnswerSection(paragraphTextArray[0]);
+            textSelectionPage.steps.verifySelectedStateOptionInSpecifyCorrectAnswerSection(paragraphTextArray[0], 'blue');
+        });
+
+        it(`When the user deselects all the selected 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`, () => {
+            textSelectionPage.steps.deselectOptionInSpecifyCorrectAnswerSection(paragraphTextArray[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 selects an option, the error message should disappear', () => {
+            textSelectionPage.steps.selectOptionInSpecifyCorrectAnswerSection(paragraphTextArray[0]);
+            textSelectionPage.steps.verifyErrorMessageIsNotDisplayed();
+        });
+
+        autoScoredSpecifyCorrectAnswerSection.tests.verifyAutoScoredPointsErrorMessageWhenPointsFieldIsEmpty(accordionName);
+
+        //CSS covered while verifying selected and deselected state of options
+
+        it('Accessibility of accordion contents', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(textSelectionPage.pointsInputField().parents('.highlight-set-correct-wrapper'))
+        });
+    }
 }
 
 export const textSelectionPage = {