itemengine-cypress-automation 1.0.2

package/cypress/pages/highlightPage.js

@@ -0,0 +1,870 @@
+import utilities from "../support/helpers/utilities";
+import constants from "../fixtures/constants";
+import { additionalSettingsPanel, autoScoredAdditionalSettings, autoScoredPreviewBase, autoScoredScoringSection, autoScoredScoringSectionMultipleResponsesType, autoScoredSetCorrectAnswerSection, ckEditorToolbar, commonComponents, createQuestionBasePage, equationEditorFlyout, previewScoringAndShowCorrectAnswerComponent, questionInstructionsComponent, scoringSectionBase, studentResponseAndLayoutComponent } from "./components"
+import { dialogBoxBase } from "./dialogBoxBase";
+import { setPointsPopupBase } from "./components/setPointsPopupBase";
+const css = Cypress.env('css');
+
+const dropdownOptions = ['Any', 'Paragraph', 'Sentence', 'Word'];
+
+const paragraphTextArray = ['All animals have a unique role to play in maintaining the balance of nature.', 'A lot of animal species exist in both, land and water. As a result, each of them has a purpose for their existence.', 'The animals divide into specific groups in biology. Amphibians are those which can live on both, land and water.', 'Mammals are ones which give birth to their offspring in the womb and have mammary glands.']
+
+const colorLibrary = css.highlightColorLibrary;
+
+const selectors = {
+    ...questionInstructionsComponent,
+    ...commonComponents,
+    ...ckEditorToolbar,
+    ...dialogBoxBase,
+    ...autoScoredScoringSectionMultipleResponsesType,
+    ...additionalSettingsPanel,
+    ...setPointsPopupBase,
+    ...scoringSectionBase,
+    ...autoScoredSetCorrectAnswerSection,
+    ...autoScoredAdditionalSettings,
+
+    questionLabel: () => cy.get('[class*="Highlightstyles__QuestionComponentWrapper"] .title-casing'),
+    questionInputField: () => cy.get('[class*="Highlightstyles__QuestionComponentWrapper"] [title="Question"]'),
+    optionSpan: () => cy.get('span'),
+    option: () => cy.get('.highlighted'),
+    //text selection dropdown
+    textSelectionLabel: () => cy.get('#Text-selection-dropdown-label'),
+    textSelectionDropdown: () => cy.get('#Text-selection-select'),
+    textSelectionDropdownList: () => cy.get('ul[aria-labelledby*="Text-selection-dropdown-label"]'),
+    textSelectionDropdownListOptions: () => cy.get('ul[aria-labelledby*="Text-selection-dropdown-label"] li'),
+    //highlight options section
+    highlightOptionsLabel: () => cy.get('.highlightOptions-label-wrapper'),
+    highlightOptionsHighlightCounter: () => cy.get('[class*="Highlightstyles__CountWrapper"]'),
+    highlightOptionsTextFieldWrapper: () => cy.get('[class*="Highlightstyles__HighLightWrapper"]'),
+    highlightOptionsSectionTextWrapper: () => cy.get('[class*="Highlightstyles__HighLightWrapper"] [data-testid="question-instruction-element"]'),
+    highlightOptionsParagraphs: () => cy.get('[class*="Highlightstyles__HighLightWrapper"] p'),
+    highlightOptionsSpans: () => cy.get('[class*="Highlightstyles__HighLightWrapper"] span'),
+    colorLibraryButton: () => cy.get('.color-library-wrapper button').eq(0),
+    colorLibraryColorOptionButton: () => cy.get('.color-library-content'),
+    colorLibrarySelectedColorIcon: () => cy.get('[class*="ColorLibrarystyle__BtnSelectionWrapper"]'),
+    clearHighlightButton: () => cy.get('.color-library-wrapper button').eq(1),
+    //set correct answer section
+    setCorrectAnswerTextFieldWrapper: () => cy.get('[class*="Highlightstyles__Wrapper"]'),
+    setCorrectAnswerTextWrapper: () => cy.get('[class*="Highlightstyles__HighlightPreviewWrapper"] [data-testid="question-instruction-element"]'),
+    setCorrectAnswerParagraphs: () => cy.get('[class*="Highlightstyles__Wrapper"] p'),
+    setCorrectAnswerSpans: () => cy.get('[class*="Highlightstyles__Wrapper"] span'),
+    setCorrectAnswerOption: () => cy.get('[class*="Highlightstyles__Wrapper"] .highlighted'),
+    setPointsButton: () => cy.get('[class*="Highlightstyles__SetPointsPopupWrapper"] button'),
+    setPointsPopupSaveButton: () => cy.get('.compact-popup-accept-button'),
+    setPointsPopupCancelButton: () => cy.get('.compact-popup-reject-button'),
+    setPointsPopupOptions: () => cy.get('[class*="SetPointsPopupstyle__MappedAnswer"]'),
+    setPointsPopupPointsLabel: () => cy.get('[class*="SetPointsPopupstyle__PointLabel"]'),
+    //Check this after https://redmine.zeuslearning.com/issues/542344 is fixed
+    pointsPerResponseLabelAndScore: () => cy.get('[class*="Highlightstyles__PartialPointsPerResponseLabel"]'),
+    //preview tab
+    previewTabQuestionContainer: () => cy.get('.highlight-preview-wrapper'),
+    previewTabParagraphs: () => cy.get('.highlight-preview-wrapper p'),
+    previewTabSpans: () => cy.get('.highlight-preview-wrapper span'),
+    previewTabOption: () => cy.get('.highlight-preview-wrapper .highlighted'),
+    //additional settings
+    maximumNumberOfAnswersLabel: () => cy.get('.maximum-answers'),
+    maximumAnswersInputField: () => cy.get('[class*="StudentResponseComponentstyle__OptionWrapper"] input'),
+}
+
+const steps = {
+    ...createQuestionBasePage.steps,
+    ...questionInstructionsComponent.steps,
+    ...ckEditorToolbar.steps,
+    ...equationEditorFlyout.steps,
+    ...dialogBoxBase.steps,
+    ...scoringSectionBase.steps,
+    ...previewScoringAndShowCorrectAnswerComponent.steps,
+    ...autoScoredPreviewBase.steps,
+    ...additionalSettingsPanel.steps,
+    ...autoScoredAdditionalSettings.steps,
+    ...autoScoredSetCorrectAnswerSection.steps,
+    ...autoScoredScoringSectionMultipleResponsesType.steps,
+    ...setPointsPopupBase.steps,
+    ...autoScoredScoringSection.steps,
+    ...commonComponents.steps,
+
+    addInputToQuestionInputField: (text) => {
+        highlightPage.questionInputField()
+            .type(text);
+    },
+
+    clearQuestionInputField: () => {
+        highlightPage.questionInputField()
+            .clear();
+    },
+
+    focusInQuestionInputField: () => {
+        highlightPage.questionInputField()
+            .focus();
+    },
+
+    focusOutOfQuestionInputField: () => {
+        highlightPage.questionInputField()
+            .blur();
+    },
+
+    verifyErroredStateOfQuestionInputField: () => {
+        utilities.verifyCSS(highlightPage.questionInputField(), {
+            'border-color': css.color.errorFieldBorder,
+            'background-color': css.color.errorFieldBg
+        });
+    },
+
+    verifyErroredStateOfHighlightOptionsSection: () => {
+        utilities.verifyCSS(highlightPage.highlightOptionsTextFieldWrapper(), {
+            'border-color': css.color.errorFieldBorder,
+            'background-color': css.color.errorFieldBg
+        });
+    },
+
+    /**
+     * @param {number} highlightCounterValue Value of highlight counter
+     * @description Verify highlight counter text and value
+     */
+    verifyHighlightCounterTextAndValue: (highlightCounterValue) => {
+        utilities.verifyInnerText(highlightPage.highlightOptionsHighlightCounter(), `Highlight count: ${highlightCounterValue}`);
+    },
+
+    /**
+     * @param {number} paragraphIndex Index of the paragraph in highlight options section
+     * @param {number} numberOfOptions Number of options inside the paragraph in highlight options section
+     * @description Verify number of options inside a paragraph in highlight options section
+     */
+    verifyNumberOfOptionsInsideAParagraphInHighlightOptionsSection: (paragraphIndex, numberOfOptions) => {
+        highlightPage.highlightOptionsParagraphs()
+            .eq(paragraphIndex)
+            .within(() => {
+                utilities.verifyElementCount(highlightPage.optionSpan(), numberOfOptions)
+            });
+    },
+
+    /**
+     * @param {number} paragraphIndex Index of the paragraph in set correct answer section
+     * @param {number} numberOfOptions Number of options inside the paragraph in set correct answer section
+     * @description Verify number of options inside a paragraph in set correct answer section
+     */
+    verifyNumberOfOptionsInsideAParagraphInSetCorrectAnswerSection: (paragraphIndex, numberOfOptions) => {
+        highlightPage.setCorrectAnswerParagraphs()
+            .eq(paragraphIndex)
+            .within(() => {
+                utilities.verifyElementCount(highlightPage.option(), numberOfOptions)
+            });
+    },
+
+    clickOnColorLibraryButton: () => {
+        highlightPage.colorLibraryButton()
+            .click();
+    },
+
+    clickingAwayFromColorLibraryPopup: () => {
+        cy.get('body')
+            .click('left');
+    },
+
+    verifyColorLibraryButton: () => {
+        utilities.verifyInnerText(highlightPage.colorLibraryButton(), 'Color library');
+        utilities.verifyElementVisibilityState(highlightPage.colorLibraryButton(), 'visible');
+        utilities.verifyElementVisibilityState(highlightPage.colorLibraryButton().find('.color-library-icon'), 'exist');
+    },
+
+    verifyClearHighlightButton: () => {
+        utilities.verifyInnerText(highlightPage.clearHighlightButton(), 'Clear')
+        utilities.verifyElementVisibilityState(highlightPage.clearHighlightButton(), 'visible');
+        utilities.verifyElementVisibilityState(highlightPage.clearHighlightButton().find('.X-mark-icon'), 'exist');
+    },
+
+    switchColorInColorLibraryPopup: (colorIndex) => {
+        highlightPage.colorLibraryColorOptionButton()
+            .eq(colorIndex)
+            .click();
+        utilities.verifyElementVisibilityState(highlightPage.dialogBox(), 'notExist');
+    },
+
+    verifyColorLibraryPopupColors: () => {
+        utilities.verifyElementVisibilityState(highlightPage.colorLibraryColorOptionButton(), 'visible');
+        utilities.verifyElementCount(highlightPage.colorLibraryColorOptionButton(), '6');
+        colorLibrary.forEach((color, index) => {
+            utilities.verifyCSS(highlightPage.colorLibraryColorOptionButton().eq(index), {
+                'background-color': color.background,
+                'border': `1px solid ${color.border}`
+            });
+        });
+    },
+
+    verifyColorLibraryPopupColorSelected: (colorIndex) => {
+        highlightPage.colorLibraryColorOptionButton()
+            .eq(colorIndex)
+            .should('have.attr', 'aria-pressed', 'true')
+            .within(() => {
+                utilities.verifyElementVisibilityState(highlightPage.colorLibrarySelectedColorIcon(), 'visible');
+            })
+    },
+
+    expandTextSelectionDropdown: () => {
+        highlightPage.textSelectionDropdown()
+            .scrollIntoView({ offset: { top: 200, left: 0 } })
+            .click();
+        utilities.verifyElementVisibilityState(highlightPage.textSelectionDropdownList(), 'visible');
+    },
+
+    closeTextSelectionDropdown: () => {
+        highlightPage.textSelectionDropdown()
+            .scrollIntoView({ offset: { top: 200, left: 0 } })
+            .click();
+        utilities.verifyElementVisibilityState(highlightPage.textSelectionDropdownList(), 'notExist');
+    },
+
+    verifyTextSelectionDropdownList: () => {
+        for (let index = 0; index < dropdownOptions.length; index++) {
+            highlightPage.textSelectionDropdownListOptions()
+                .eq(index)
+                .verifyInnerText(dropdownOptions[index]);
+        }
+    },
+
+    /**
+     * @param {string} textSelectionType Type of text selection in text selection dropdown
+     * @description Select the dropdown option in the text selection dropdown
+     */
+    selectDropdownOptionInTextSelectionDropdown: (textSelectionType) => {
+        highlightPage.textSelectionDropdownListOptions()
+            .contains(textSelectionType)
+            .click();
+    },
+
+    verifyResetPopupForClearingOptionSelection: () => {
+        utilities.verifyElementVisibilityState(highlightPage.dialogBox(), 'visible');
+        utilities.verifyInnerText(highlightPage.dialogBoxTitle(), 'Reset');
+        utilities.verifyInnerText(highlightPage.dialogBoxContent(), 'Are you sure you want to clear all highlights? This action will not delete template content but clear all highlights.');
+        utilities.verifyInnerText(highlightPage.buttonReject(), 'Cancel');
+        utilities.verifyInnerText(highlightPage.buttonAccept(), 'Confirm');
+    },
+
+    /**
+     * @param {string} textSelectionType Type of text selection for which reset confirmation popup is displayed
+     * @description Verify reset confirmation popup for switch text selection type
+     */
+    verifyResetPopupForSwitchingTextSelectionType: (textSelectionType) => {
+        utilities.verifyElementVisibilityState(highlightPage.dialogBox(), 'visible');
+        utilities.verifyInnerText(highlightPage.dialogBoxTitle(), 'Reset');
+        utilities.verifyInnerText(highlightPage.dialogBoxContent(), `Applying ${textSelectionType} text selection will reset any existing highlight options, including valid responses and alternate response values.`);
+        utilities.verifyInnerText(highlightPage.buttonReject(), 'Cancel');
+        utilities.verifyInnerText(highlightPage.buttonAccept(), 'Confirm');
+    },
+
+    /**
+     * @param {string} textSelectionType Type of text selection for which reset confirmation popup is displayed
+     * @description Switch text selection type in text selection dropdown
+     */
+    switchTextSelectionTypeInTextSelectionDropdown: (textSelectionType) => {
+        highlightPage.steps.expandTextSelectionDropdown();
+        highlightPage.steps.selectDropdownOptionInTextSelectionDropdown(textSelectionType);
+        utilities.verifyInnerText(highlightPage.dialogBoxContent(), `Applying ${textSelectionType} text selection will reset any existing highlight options, including valid responses and alternate response values.`);
+        highlightPage.steps.clickOnAcceptButtonInDialogBox();
+        utilities.verifyInnerText(highlightPage.textSelectionDropdown(), textSelectionType);
+    },
+
+    clearSelectedOptionsInHighlightOptionsSection: () => {
+        highlightPage.steps.clickOnClearHighlightButtonInHighlightOptionsSection();
+        highlightPage.steps.clickOnAcceptButtonInDialogBox();
+    },
+
+    /**
+     * @param {string} optionText Text of the option in highlight options section
+     * @description Verify that option is in selected state in highlight options section
+     */
+    verifyOptionIsSelectedInHighlightOptionsSection: (optionText) => {
+        highlightPage.highlightOptionsSpans()
+            .contains(optionText)
+            .should('have.class', 'highlighted')
+            .and('have.attr', 'aria-checked', 'true');
+    },
+
+    /**
+     * @param {string} optionText Text of the option in set correct answer section
+     * @description Verify that option is not in selected state in set correct answer section
+     */
+    verifyOptionIsNotSelectedInSetCorrectAnswerSection: (optionText) => {
+        highlightPage.setCorrectAnswerOption()
+            .contains(optionText)
+            .should('not.have.class', 'correct_answer')
+            .and('have.attr', 'aria-checked', 'false');
+    },
+
+    /**
+     * @param {string} optionText Text of the option in set correct answer section
+     * @description Verify that option is in selected state in set correct answer section
+     */
+    verifyOptionIsSelectedInSetCorrectAnswerSection: (optionText) => {
+        highlightPage.setCorrectAnswerOption()
+            .contains(optionText)
+            .should('have.class', 'correct_answer')
+            .and('have.attr', 'aria-checked', 'true');
+    },
+
+    /**
+     * @param {string} optionText Text of the option in highlight options section
+     * @description Verify that option is not in selected state in highlight options section
+     */
+    verifyOptionIsNotSelectedInHighlightOptionsSection: (optionText) => {
+        highlightPage.highlightOptionsSpans()
+            .contains(optionText)
+            .should('not.have.class', 'highlighted')
+            .and('have.attr', 'aria-checked', 'false');
+    },
+
+    /**
+     * @param {string} optionText Text of the option in preview tab
+     * @description Verify that option is in selected state in preview tab
+     */
+    verifyOptionIsSelectedInPreviewTab: (optionText) => {
+        highlightPage.previewTabOption()
+            .contains(optionText)
+            .should('have.class', 'correct_answer')
+            .and('have.attr', 'aria-checked', 'true');
+    },
+
+    /**
+     * @param {string} optionText Text of the option in preview tab
+     * @description Verify that option is not in selected state in preview tab
+     */
+    verifyOptionIsNotSelectedInPreviewTab: (optionText) => {
+        highlightPage.previewTabOption()
+            .contains(optionText)
+            .should('not.have.class', 'correct_answer')
+            .and('have.attr', 'aria-checked', 'false');
+    },
+
+    verifyNoOptionIsSelectedInPreviewTab: () => {
+        highlightPage.previewTabOption()
+            .should('not.have.class', 'correct_answer')
+            .and('have.attr', 'aria-checked', 'false');
+    },
+
+    /**
+     * @param {string} optionText Text of the option in highlight options section
+     * @description Verify that option does not exist in highlight options section
+     */
+    verifyOptionDoesNotExistInHighlightOptionsSection: (optionText) => {
+        utilities.verifyElementVisibilityState(highlightPage.highlightOptionsSpans().contains(optionText), 'notExist');
+    },
+
+    /**
+     * @param {string} optionText Text of the option in highlight options section
+     * @description Click on option in highlight options section
+     */
+    clickOnOptionInHighlightOptionsSection: (optionText) => {
+        highlightPage.highlightOptionsSpans()
+            .contains(optionText)
+            .click();
+    },
+
+    /**
+     * @param {string} optionText Text of the option in set correct answer section
+     * @description Click on option in set correct answer section
+     */
+    clickOnOptionInSetCorrectAnswerSection: (optionText) => {
+        highlightPage.setCorrectAnswerOption()
+            .contains(optionText)
+            .click();
+    },
+
+    /**
+    * @param {string} optionText Text of the option in preview tab
+    * @description Click on option in preview tab
+    */
+    clickOnOptionInPreviewTab: (optionText) => {
+        highlightPage.previewTabOption()
+            .contains(optionText)
+            .click();
+    },
+
+    /**
+     * @param {string} textSelectionType Type of text selection 
+     * @param {*} optionText Text of the option in highlight options section
+     * @description Select an option in highlight options section
+     */
+    selectOptionInHighlightOptionsSection: (textSelectionType, optionText) => {
+        if (textSelectionType === 'Any') {
+            highlightPage.highlightOptionsSectionTextWrapper()
+                .selectText(optionText);
+            highlightPage.steps.verifyOptionIsSelectedInHighlightOptionsSection(optionText);
+        } else {
+            highlightPage.steps.clickOnOptionInHighlightOptionsSection(optionText);
+            highlightPage.steps.verifyOptionIsSelectedInHighlightOptionsSection(optionText);
+        }
+    },
+
+    /**
+     * @param {string} textSelectionType Type of text selection 
+     * @param {*} optionText Text of the option in highlight options section
+     * @description Deselect an option in highlight options section
+     */
+    deselectOptionInHighlightOptionsSection: (textSelectionType, optionText) => {
+        if (textSelectionType === 'Any') {
+            highlightPage.steps.clickOnOptionInHighlightOptionsSection(optionText);
+            highlightPage.steps.verifyOptionDoesNotExistInHighlightOptionsSection(optionText);
+        } else {
+            highlightPage.steps.clickOnOptionInHighlightOptionsSection(optionText);
+            highlightPage.steps.verifyOptionIsNotSelectedInHighlightOptionsSection(optionText);
+        }
+    },
+
+    /**
+     * @param {*} optionText Text of the option in set correct answer section
+     * @description Select an option in set correct answer section
+     */
+    selectOptionInSetCorrectAnswerSection: (optionText) => {
+        highlightPage.steps.clickOnOptionInSetCorrectAnswerSection(optionText);
+        highlightPage.steps.verifyOptionIsSelectedInSetCorrectAnswerSection(optionText);
+    },
+
+    /**
+     * @param {*} optionText Text of the option in set correct answer section
+     * @description Deselect an option in set correct answer section
+     */
+    deselectOptionInSetCorrectAnswerSection: (optionText) => {
+        highlightPage.steps.clickOnOptionInSetCorrectAnswerSection(optionText);
+        highlightPage.steps.verifyOptionIsNotSelectedInSetCorrectAnswerSection(optionText);
+    },
+
+    /**
+     * @param {*} optionText Text of the option in preview tab
+     * @description Select an option in preview tab
+     */
+    selectOptionInPreviewTab: (optionText) => {
+        highlightPage.steps.clickOnOptionInPreviewTab(optionText);
+        highlightPage.steps.verifyOptionIsSelectedInPreviewTab(optionText);
+    },
+
+    /**
+     * @param {*} optionText Text of the option in preview tab
+     * @description Deselect an option in preview tab
+     */
+    deselectOptionInPreviewTab: (optionText) => {
+        highlightPage.steps.clickOnOptionInPreviewTab(optionText);
+        highlightPage.steps.verifyOptionIsNotSelectedInPreviewTab(optionText);
+    },
+
+    /**
+     * @param {string[]} optionArray Array of text of options in highlight options section
+     * @description Verify the options displayed in highlight options section
+     */
+    verifyOptionsInHighlightOptionsSection: (optionArray) => {
+        optionArray.forEach((optionText, optionIndex) => {
+            utilities.verifyInnerText(highlightPage.highlightOptionsSpans().eq(optionIndex), optionText)
+        });
+        utilities.verifyElementCount(highlightPage.highlightOptionsSpans(), optionArray.length);
+    },
+
+    /**
+     * @param {string[]} optionArray Array of text of options in highlight options section
+     * @description Verify the options displayed in highlight options section
+     */
+    verifyOptionsInSetCorrectAnswerSection: (optionArray) => {
+        optionArray.forEach((optionText, optionIndex) => {
+            utilities.verifyInnerText(highlightPage.setCorrectAnswerOption().eq(optionIndex), optionText)
+        });
+        utilities.verifyElementCount(highlightPage.setCorrectAnswerOption(), optionArray.length);
+    },
+
+    /**
+    * @param {string[]} optionArray Array of text of options in preview tab
+    * @description Verify the options displayed in preview tab
+    */
+    verifyOptionInPreviewTab: (optionArray) => {
+        optionArray.forEach((optionText, optionIndex) => {
+            utilities.verifyInnerText(highlightPage.previewTabOption().eq(optionIndex), optionText)
+        });
+        utilities.verifyElementCount(highlightPage.previewTabOption(), optionArray.length);
+    },
+
+
+    /**
+     * @param {string} optionText Text of the option in highlight options section
+     * @description Hover on deselected option in highlight options section
+     */
+    hoverOnDeselectedOptionInHighlightOptionsSection: (optionText) => {
+        highlightPage.highlightOptionsSpans()
+            .contains(optionText)
+            .realHover();
+    },
+
+    /**
+     * @param {string} optionText Text of the option in highlight options section
+     * @description Verify hover state of the deselected option in highlight options section
+     */
+    verifyHoverStateOfDeselectedOptionInHighlightOptionsSection: (optionText) => {
+        highlightPage.steps.hoverOnDeselectedOptionInHighlightOptionsSection(optionText);
+        utilities.verifyCSS(highlightPage.highlightOptionsSpans().contains(optionText), {
+            'color': css.color.text,
+            'font-size': css.fontSize.default,
+            'font-weight': css.fontWeight.regular,
+            'background-color': colorLibrary[0].hoverBackground,
+            'border': `1px solid ${colorLibrary[0].hoverBorder}`
+        });
+    },
+
+    /**
+     * @param {string} optionText Text of the option in set correct answer section
+     * @description Hover on deselected option in set correct answer section
+     */
+    hoverOnDeselectedOptionInSetCorrectAnswerSection: (optionText) => {
+        highlightPage.setCorrectAnswerOption()
+            .contains(optionText)
+            .realHover();
+    },
+
+    /**
+     * @param {string} optionText Text of the option in preview tab
+     * @description Hover on deselected option in preview tab
+     */
+    hoverOnDeselectedOptionInPreviewTab: (optionText) => {
+        highlightPage.previewTabOption()
+            .contains(optionText)
+            .realHover();
+    },
+
+    /**
+     * @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
+     */
+    verifyHoverStateOfDeselectedOptionInSetCorrectAnswerSection: (optionText) => {
+        highlightPage.steps.hoverOnDeselectedOptionInSetCorrectAnswerSection(optionText);
+        utilities.verifyCSS(highlightPage.setCorrectAnswerOption().contains(optionText), {
+            'color': css.color.text,
+            'font-size': css.fontSize.default,
+            'font-weight': css.fontWeight.regular,
+            'background-color': colorLibrary[0].hoverBackground,
+            'border': `1px solid ${colorLibrary[0].hoverBorder}`
+        });
+    },
+
+    /**
+    * @param {string} optionText Text of the option in preview tab
+    * @description Verify hover state of the deselected option in preview tab
+    */
+    verifyHoverStateOfOptionInPreviewTab: (optionText) => {
+        highlightPage.steps.hoverOnDeselectedOptionInPreviewTab(optionText);
+        utilities.verifyCSS(highlightPage.previewTabOption().contains(optionText), {
+            'color': css.color.text,
+            'font-size': css.fontSize.default,
+            'font-weight': css.fontWeight.regular,
+            'background-color': colorLibrary[0].hoverBackground,
+            'border': `1px solid ${colorLibrary[0].hoverBorder}`
+        });
+    },
+
+    /**
+         * @param {string} optionText Text of the option in preview tab
+         * @description Verify check-mark icon is displayed for option
+         */
+    verifyCorrectAnswerCheckmarkIconForOption: (optionText) => {
+        highlightPage.previewTabOption()
+            .contains(optionText)
+            .should('have.class', 'correct_answer')
+            .within(() => {
+                autoScoredPreviewBase.correctIcon()
+                    .should('be.visible');
+            });
+    },
+
+    /**
+     * @param {string} optionText Text of the option in preview tab
+     * @description Verify cross-mark icon is displayed for option
+     */
+    verifyIncorrectAnswerCrossmarkIconForOption: (optionText) => {
+        highlightPage.previewTabOption()
+            .contains(optionText)
+            .should('have.class', 'correct_answer')
+            .within(() => {
+                autoScoredPreviewBase.incorrectIcon()
+                    .should('be.visible');
+            });
+    },
+
+    /**
+     * @param {number[]} pointsArray Array of partial different points for options
+     * @description Add points to options in set points popup
+     */
+    addPartialDifferentWeightsPointsInSetPointsPopup: (pointsArray) => {
+        highlightPage.setPointsButton()
+            .click();
+        setPointsPopupBase.steps.allotPointsToSetPointsPopupPointsInputField(pointsArray);
+        highlightPage.setPointsPopupSaveButton()
+            .click();
+    },
+
+    /**
+    * @param {string[]} optionsArray array of options set in options section
+    * @description this function resets the question preview
+    */
+    resetQuestionPreview: () => {
+        highlightPage.steps.switchToEditTab();
+        highlightPage.steps.switchToPreviewTab();
+        highlightPage.steps.verifyNoOptionIsSelectedInPreviewTab();
+    },
+
+    /**
+     * @param {number} maxNumberOfAnswers maximum number of answers
+     * @description add input to maximum number of answers input field
+     */
+    addInputToMaximumNumberOfAnswersInputField: (maxNumberOfAnswers) => {
+        highlightPage.maximumAnswersInputField()
+            .clear()
+            .type(`${maxNumberOfAnswers}`)
+            .should('have.value', `${maxNumberOfAnswers}`);
+    },
+
+    //Check after https://redmine.zeuslearning.com/issues/542344 is fixed
+    /**
+     * @param {number} points Points displayed for points per response
+     * @description Verify the points per response score
+     */
+    verifyPartialEqualWeightsPointsPerResponseScore: (points) => {
+        utilities.verifyInnerText(highlightPage.pointsPerResponseLabelAndScore(), `Points per response: ${points}`);
+    },
+
+    clickOnClearHighlightButtonInHighlightOptionsSection: () => {
+        highlightPage.clearHighlightButton()
+            .click();
+    },
+
+    verifyDefaultSetPointsButtonLabelAndDisabledState: () => {   
+        utilities.verifyInnerText(highlightPage.setPointsButton(), 'Set points');
+        utilities.verifyElementVisibilityState(highlightPage.setPointsButton(), 'visible');
+        utilities.verifyElementVisibilityState(highlightPage.setPointsButton().find('svg'), 'exist');
+        highlightPage.setPointsButton()
+            .should('be.disabled');
+        utilities.verifyCSS(highlightPage.setPointsButton(), {
+            'color': css.color.secondaryBtnDisabled
+        });
+        utilities.verifyCSS(highlightPage.setPointsButton().find('svg'), {
+            'color': css.color.secondaryBtnDisabled
+        });
+    },
+
+    verifySetPointsButtonLabelAndEnabledState: () => {
+        utilities.verifyInnerText(highlightPage.setPointsButton(), 'Set points');
+        utilities.verifyElementVisibilityState(highlightPage.setPointsButton(), 'visible');
+        utilities.verifyElementVisibilityState(highlightPage.setPointsButton().find('svg'), 'exist');
+        highlightPage.setPointsButton()
+            .should('be.enabled');
+    },
+
+    clickOnSetPointsButton: () => {
+        highlightPage.setPointsButton()
+            .click();
+    },
+
+    cancelSetPointsPopup: () => {
+        highlightPage.setPointsPopupCancelButton()
+            .click();
+        highlightPage.dialogBox()
+            .should('not.exist');
+    },
+
+    savePointsAllotedInSetPointsPopup: () => {
+        highlightPage.setPointsPopupSaveButton()
+            .click();
+        highlightPage.dialogBox()
+            .should('not.exist');
+    },
+
+    /**
+     * @param {string[]} optionTextArray Array of options displayed in set points popup
+     * @description Verify the options displayed in set points popup
+     */
+    verifySetPointsPopupOptions: (optionTextArray) => {
+        optionTextArray.forEach((optionText, index) => {
+            utilities.verifyInnerText(highlightPage.setPointsPopupOptions().eq(index), `${optionText}`);
+        });
+        utilities.verifyElementCount(highlightPage.setPointsPopupOptions(), optionTextArray.length);
+    },
+
+    /**
+     * @param {number} index points field option index
+     * @description this function verifies points field error message
+     */
+    verifyPointsErrorMessageInSetPointsPopup: (index) => {
+        setPointsPopupBase.dialogBox()
+            .within(() => {
+                scoringSectionBase.pointsInputField()
+                    .eq(index)
+                    .parents('[class*="SetPointsPopupstyle__PointsErrorWrapper"]')
+                    .within(() => {
+                        commonComponents.errorMessage()
+                            .should('have.text', 'Error: Please enter points.');
+                    });
+            });
+    },
+
+    verifyImageAndAltTextInQuestionInputField: () => {
+        highlightPage.questionInputField()
+            .find('img')
+            .should('have.attr', 'src', constants.foxImageLink)
+            .and('have.attr', 'alt', constants.foxImageAltText);
+    },
+
+    verifyEquationInQuestionInputField: () => {
+        highlightPage.questionInputField()
+            .find('[data-widget="ngie_equation"]')
+            .should('have.attr', 'aria-label', constants.CKEditorInputFieldEnteredEquationAriaLabel)
+            .contains(constants.CKEditorInputFieldEnteredEquationText);
+    },
+
+    verifyLinkInQuestionInputField: () => {
+        highlightPage.questionInputField()
+            .find('a')
+            .should('have.text', 'lorem')
+            .and('have.attr', 'href', `${Cypress.config().baseUrl}`);
+    },
+
+    verifyBoldTextInQuestionInputField: () => {
+        highlightPage.questionInputField()
+            .find('strong')
+            .should('exist')
+            .should('have.text', '​​​​​​​This is Bold text input.');
+    },
+
+    verifyImageAndAltTextInHighlightOptionsSection: () => {
+        highlightPage.highlightOptionsTextFieldWrapper()
+            .find('img')
+            .should('have.attr', 'src', constants.foxImageLink)
+            .and('have.attr', 'alt', constants.foxImageAltText);
+    },
+
+    verifyEquationInHighlightOptionsSection: () => {
+        highlightPage.highlightOptionsTextFieldWrapper()
+            .find('span[role="math"]')
+            .should('have.attr', 'aria-label', constants.CKEditorInputFieldEnteredEquationAriaLabel)
+            .contains(constants.CKEditorInputFieldEnteredEquationText);
+    },
+
+    verifyLinkInHighlightOptionsSection: () => {
+        highlightPage.highlightOptionsTextFieldWrapper()
+            .find('a')
+            .should('have.text', 'lorem')
+            .and('have.attr', 'href', `${Cypress.config().baseUrl}`);
+    },
+
+    verifyBoldTextInHighlightOptionsSection: () => {
+        highlightPage.highlightOptionsTextFieldWrapper()
+            .find('strong')
+            .should('exist')
+            .should('have.text', 'This is Bold text input.lorem');
+    },
+
+    verifyImageAndAltTextInSetCorrectAnswerSection: () => {
+        highlightPage.setCorrectAnswerTextWrapper()
+            .find('img')
+            .should('have.attr', 'src', constants.foxImageLink)
+            .and('have.attr', 'alt', constants.foxImageAltText);
+    },
+
+    verifyEquationInSetCorrectAnswerSection: () => {
+        highlightPage.setCorrectAnswerTextWrapper()
+            .find('span[role="math"]')
+            .should('have.attr', 'aria-label', constants.CKEditorInputFieldEnteredEquationAriaLabel)
+            .contains(constants.CKEditorInputFieldEnteredEquationText);
+    },
+
+    verifyLinkInSetCorrectAnswerSection: () => {
+        highlightPage.setCorrectAnswerTextWrapper()
+            .find('a')
+            .should('have.text', 'lorem')
+            .and('have.attr', 'href', `${Cypress.config().baseUrl}`);
+    },
+
+    verifyBoldTextInSetCorrectAnswerSection: () => {
+        highlightPage.setCorrectAnswerTextWrapper()
+            .find('strong')
+            .should('exist')
+            .should('have.text', 'This is Bold text input.lorem');
+    },
+
+    verifyImageAndAltTextInPreviewTab: () => {
+        highlightPage.previewTabQuestionContainer()
+            .find('img')
+            .should('have.attr', 'src', constants.foxImageLink)
+            .and('have.attr', 'alt', constants.foxImageAltText);
+    },
+
+    verifyEquationInPreviewTab: () => {
+        highlightPage.previewTabQuestionContainer()
+            .find('span[role="math"]')
+            .should('have.attr', 'aria-label', constants.CKEditorInputFieldEnteredEquationAriaLabel)
+            .contains(constants.CKEditorInputFieldEnteredEquationText);
+    },
+
+    verifyLinkInPreviewTab: () => {
+        highlightPage.previewTabQuestionContainer()
+            .find('a')
+            .should('have.text', 'lorem')
+            .and('have.attr', 'href', `${Cypress.config().baseUrl}`);
+    },
+
+    verifyBoldTextInPreviewTab: () => {
+        highlightPage.previewTabQuestionContainer()
+            .find('strong')
+            .should('exist')
+            .should('have.text', 'This is Bold text input.lorem');
+    },
+}
+
+const tests = {
+    ...questionInstructionsComponent.tests,
+    ...commonComponents.tests,
+    ...autoScoredScoringSection.tests,
+    ...autoScoredScoringSectionMultipleResponsesType.tests,
+    ...previewScoringAndShowCorrectAnswerComponent.tests,
+    ...autoScoredSetCorrectAnswerSection.tests,
+    ...scoringSectionBase.tests,
+    ...additionalSettingsPanel.tests,
+    ...studentResponseAndLayoutComponent.tests,
+    ...autoScoredAdditionalSettings.tests,
+
+    /**
+     * @param {number} totalPoints Maximum total points set for the question
+     * @description Verify the options displayed in set correct answer section
+     */
+    verifyMinimumScoreAwardedIfAttemptedFunctionalityForIncorrectAnswer: (totalPoints) => {
+        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')
+            highlightPage.steps.switchToEditTab();
+            highlightPage.steps.allotMinimumScoreAwardedIfAttempted(1);
+            highlightPage.steps.switchToPreviewTab()
+            highlightPage.steps.selectOptionInPreviewTab(paragraphTextArray[3]);
+            highlightPage.steps.verifyPreviewTabScoreText(1, `${totalPoints}`);
+        });
+
+        it('When user removes minimum score awarded (if attempted) points, then in Preview tab on selecting any options other than correct answers, points should not be provided', () => {
+            cy.log('Switch to edit tab and remove minimum score if attempted points')
+            highlightPage.steps.switchToEditTab();
+            highlightPage.steps.clearMinimumScoreIfAttemptedPointsField();
+            highlightPage.steps.switchToPreviewTab()
+            highlightPage.steps.selectOptionInPreviewTab(paragraphTextArray[3]);
+            highlightPage.steps.verifyPreviewTabScoreText(0, `${totalPoints}`);
+        });
+    },
+
+    /**
+     * @param {string} scoringType Type of scoring set in scoring section
+     * @param {string[]} optionsArray Array of the options displayed in set correct answer
+     * @description Verify the options displayed in set correct answer section
+     */
+    verifyContentsOfSetCorrectAnswerSectionForScoringType: (scoringType, optionsArray) => {
+        it(`When user has selected ${scoringType} scoring type then the added options should be displayed in the set correct answer section and they should be in deselected state`, () => {
+            highlightPage.steps.verifyOptionsInSetCorrectAnswerSection(optionsArray);
+            optionsArray.forEach((optionText) => {
+                highlightPage.steps.verifyOptionIsNotSelectedInSetCorrectAnswerSection(optionText);
+            });
+        });
+    }
+}
+
+export const highlightPage = {
+    ...selectors,
+    steps,
+    tests
+}