itemengine-cypress-automation 1.0.211-2ndJulyFixes-2aec8c8.0 → 1.0.211

package/cypress/pages/highlightPage.js

@@ -1,499 +0,0 @@
-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'),
-    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"]'),
-    highlightOptionsSectionTextWrapper: () => cy.get('[class*="Highlightstyles__HighLightWrapper"] [data-testid="question-instruction-element"]'),
-    highlightOptionsParagraphs: () => cy.get('[class*="Highlightstyles__HighLightWrapper"] p'),
-    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('.popup-button-wrapper button').eq(1),
-    setPointsPopupCancelButton: () => cy.get('.popup-button-wrapper button').eq(0),
-    setPointsPopupOptions: () => cy.get('[class*="SetPointsPopupstyle__MappedAnswer"]'),
-    setPointsPopupPointsLabel: () => cy.get('[class*="SetPointsPopupstyle__PointLabel"]'),
-    //Check this after https://redmine.zeuslearning.com/issues/542344 is fixed
-    pointsPerResponseLabel: () => cy.get('[class*="Highlightstyles__PartialPointsPerResponseLabel"]'),
-    pointsPerResponseScore: () => cy.get('[class*="Highlightstyles__PartialPointsPerResponseValue"]'),
-    //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'),
-    setCorrectAnswerErrorMessage: () => cy.get('[class*="ErrorMessageContainer"]')
-}
-
-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,
-
-    /**
-     * @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: () => {
-        cy.get('body')
-            .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();
-    },
-
-    verifySetCorrectAnswerSectionErrorMessage: () => {
-        highlightPage.setCorrectAnswerErrorMessage()
-            .eq(1)
-            .verifyInnerText('Error: Please set a correct answer.');
-    },
-
-    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');
-    },
-
-    clearSelectedOptionsInHighlightOptionsSection: () => {
-        highlightPage.steps.clickOnClearHighlightButtonInHighlightOptionsSection();
-        highlightPage.steps.clickOnAcceptButtonInDialogBox();
-    },
-
-    /**
-     * @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 {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.pointsPerResponseScore(), `${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.');
-                    });
-            });
-    },
-
-    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');
-    },
-
-    //TODO- Update after https://redmine.zeuslearning.com/issues/548968 is resolved
-    verifySetCorrectAnswerErrorMessage: () => {
-        highlightPage.setCorrectAnswerLabel()
-            .parents('.highlight-set-correct-wrapper')
-            .within(() => {
-                utilities.verifyTextContent(highlightPage.errorMessage().eq(1), 'Error: Please set a correct answer.')
-            });
-    }
-}
-
-const tests = {
-    ...questionInstructionsComponent.tests,
-    ...commonComponents.tests,
-    ...autoScoredScoringSection.tests,
-    ...autoScoredScoringSectionMultipleResponsesType.tests,
-    ...previewScoringAndShowCorrectAnswerComponent.tests,
-    ...autoScoredSetCorrectAnswerSection.tests,
-    ...scoringSectionBase.tests,
-    ...additionalSettingsPanel.tests,
-    ...studentResponseAndLayoutComponent.tests,
-    ...autoScoredAdditionalSettings.tests,
-    ...createQuestionBasePage.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
-}