itemengine-cypress-automation 1.0.50 → 1.0.62

package/cypress/e2e/ILC/Highlight/highlightEditTabScoringSection.js

@@ -0,0 +1,361 @@
+import { highlightPage } from "../../../pages/highlightPage";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+const css = Cypress.env('css');
+
+const paragraphTextArray = ['Horses cannot breath through their mouth. Cows can sleep standing up.', 'Dogs have excellent hearing.', 'Deers possess nearly 300 degree field of vision.'];
+
+describe('Create item page - Highlight: Edit tab scoring types and set correct answer section (Correct answer tab)', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Edit tab \'Set correct answer\' section (Correct answer tab) and \'Scoring\' section for Auto-scored: All or Nothing scoring type', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Highlight question type, switch to paragraph text selection');
+            highlightPage.steps.navigateToCreateQuestion('highlight');
+            cy.barsPreLoaderWait();
+            highlightPage.steps.clearQuestionInputField();
+            paragraphTextArray.forEach((paragraphText) => {
+                highlightPage.steps.addInputToQuestionInputField(`${paragraphText}{enter}`);
+            });
+            highlightPage.steps.addInputToQuestionInputField('{backspace}');
+            highlightPage.steps.switchTextSelectionTypeInTextSelectionDropdown('Paragraph');
+        });
+
+        highlightPage.tests.verifyAutoScoredAllOrNothingPointsAndMinimumScoreAwardedLabelAndInputField();
+
+        highlightPage.tests.verifyContentsOfSetCorrectAnswerSectionForScoringType('All or nothing', paragraphTextArray);
+
+        highlightPage.tests.verifyPointsFieldErrorState(10);
+
+        highlightPage.tests.verifyMinimumScoreIfAttemptedFieldErrorState(10, 20, 10);
+    });
+
+    describe('Edit tab \'Set correct answer\' section (Correct answer tab) and \'Scoring\' section for Auto-scored: Partial equal weights scoring type', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Highlight question type, switch to paragraph text selection');
+            highlightPage.steps.navigateToCreateQuestion('highlight');
+            cy.barsPreLoaderWait();
+            highlightPage.steps.clearQuestionInputField();
+            paragraphTextArray.forEach((paragraphText) => {
+                highlightPage.steps.addInputToQuestionInputField(`${paragraphText}{enter}`);
+            });
+            highlightPage.steps.addInputToQuestionInputField('{backspace}');
+            highlightPage.steps.switchTextSelectionTypeInTextSelectionDropdown('Paragraph');
+        });
+
+        it('When Scoring type dropdown has Auto scored selected then user should be able to select \'Partial - equal weights\' scoring type', () => {
+            utilities.verifyInnerText(highlightPage.scoringTypeDropdown(), 'Auto scored')
+            highlightPage.steps.selectPartialEqualWeightsCheckbox();
+        });
+
+        //Failing due to https://redmine.zeuslearning.com/issues/542344
+        it('When the Points input field is empty and the user has switched to \'Partial - equal weights\' scoring, then \'Points per response\' label should be displayed and a \'-\' should be displayed beside it, \'Penalty Points\' and \'Minimum score awarded (if attempted)\' labels and input fields should be displayed and \'Round down score\' label and checkbox should be displayed and by default it should be checked', () => {
+            highlightPage.steps.verifyDefaultPointsLabelAndInputField();
+            utilities.verifyInnerText(highlightPage.pointsPerResponseLabel(), 'Points per response:');
+            utilities.verifyInnerText(highlightPage.pointsPerResponseScore(), '-');
+            utilities.verifyElementVisibilityState(highlightPage.pointsPerResponseLabel(), 'visible');
+            highlightPage.steps.verifyPartialEqualWeightsPointsPerResponseScore('-');
+            highlightPage.steps.verifyDefaultPenaltyPointsInputFieldAndLabel();
+            highlightPage.steps.verifyDefaultMinimumScoreIfAttemptedLabelAndPointsField();
+            highlightPage.steps.verifyDefaultRoundDownScoreCheckboxCheckedAndLabel();
+        });
+
+        highlightPage.tests.verifyContentsOfSetCorrectAnswerSectionForScoringType('Partial equal weights', paragraphTextArray);
+
+        it('When user gives a score input to \'Points\' input field and no options are selected in set correct answer section, then the \'Points per response\' score should be displayed as \'-\'', () => {
+            highlightPage.steps.allotPoints('20');
+            highlightPage.steps.verifyPartialEqualWeightsPointsPerResponseScore('-');
+        });
+
+        it('When user selects options in set correct answer section, then the \'Points per response\' score should be equally divided and displayed as per the number of selected options', () => {
+            highlightPage.steps.selectOptionInSetCorrectAnswerSection(paragraphTextArray[0]);
+            highlightPage.steps.verifyPartialEqualWeightsPointsPerResponseScore('20');
+            highlightPage.steps.selectOptionInSetCorrectAnswerSection(paragraphTextArray[1]);
+            highlightPage.steps.selectOptionInSetCorrectAnswerSection(paragraphTextArray[2]);
+            highlightPage.steps.verifyPartialEqualWeightsPointsPerResponseScore('6.67');
+        });
+
+        it('When user deselects an option then the Points per response should be updated accordingly', () => {
+            highlightPage.steps.deselectOptionInSetCorrectAnswerSection(paragraphTextArray[2]);
+            highlightPage.steps.verifyPartialEqualWeightsPointsPerResponseScore('10');
+        });
+
+        it('User should be able to enter points in \'Penalty Points\' and \'Minimum score awarded (if attempted)\' input fields', () => {
+            highlightPage.steps.allotPenaltyPoints(2);
+            highlightPage.steps.allotMinimumScoreAwardedIfAttempted(1);
+        });
+
+        //Add separate css verification for points per response label and score after https://redmine.zeuslearning.com/issues/542344 is fixed
+        it('CSS of \'Points per response\' label and its displayed score, \'Penalty Points\' and \'Minimum score awarded (if attempted)\' and \'Round down score\' checkbox', { tags: 'css' }, () => {
+            utilities.verifyCSS(highlightPage.pointsPerResponseLabel(), {
+                'color': css.color.labels,
+                'font-size': css.fontSize.normal,
+            });
+            utilities.verifyCSS(highlightPage.penaltyPointsLabel(), {
+                'color': css.color.labels,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.semibold
+            });
+            utilities.verifyCSS(highlightPage.minimumScoreIfAttemptedLabel(), {
+                'color': css.color.labels,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.semibold
+            });
+            utilities.verifyCSS(highlightPage.rounddownScoreCheckboxLabel(), {
+                'color': css.color.labelText,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.regular
+            });
+        });
+
+        it('Accessibility of \'Penalty Points\' and \'Minimum score awarded (if attempted)\' input field and \'Round down score\' checkbox', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(highlightPage.penaltyPointsInputField().parents('.points-container'));
+            cy.checkAccessibility(highlightPage.rounddownScoreCheckbox().parents('[data-ngie-testid="round-down-score-checkbox"]'));
+        });
+
+        it('When the user switches to \'All or nothing\' scoring, the \'Points per response\' label and the points displayed for individual responses should not be displayed and the points displayed in \'Points\' input field should remain unchanged', () => {
+            highlightPage.steps.selectAllOrNothingCheckbox()
+            utilities.verifyElementVisibilityState(highlightPage.pointsPerResponseLabel(), 'notExist');
+            utilities.verifyElementVisibilityState(highlightPage.pointsPerResponseScore(), 'notExist');
+            highlightPage.steps.verifyPointsFieldValue('20');
+        });
+
+        it('When user has entered points in \'All or nothing\' scoring type and switches to \'Partial equal weights\' scoring type, then the score should be equally divided and displayed beside the \'Points per response\' label', () => {
+            highlightPage.steps.allotPoints('9');
+            highlightPage.steps.selectPartialEqualWeightsCheckbox();
+            highlightPage.steps.verifyPartialEqualWeightsPointsPerResponseScore('4.5');
+        });
+    });
+
+    describe('Edit tab \'Set correct answer\' section (Correct answer tab) and \'Scoring\' section for AutoScored: Partial different weights scoring type', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Highlight question type, switch to paragraph text selection');
+            highlightPage.steps.navigateToCreateQuestion('highlight');
+            cy.barsPreLoaderWait();
+            highlightPage.steps.clearQuestionInputField();
+            paragraphTextArray.forEach((paragraphText) => {
+                highlightPage.steps.addInputToQuestionInputField(`${paragraphText}{enter}`);
+            });
+            highlightPage.steps.addInputToQuestionInputField('{backspace}');
+            highlightPage.steps.switchTextSelectionTypeInTextSelectionDropdown('Paragraph');
+        });
+
+        it('When scoring type dropdown has Auto scored selected then user should be able to select \'Partial - different weights\' scoring', () => {
+            utilities.verifyInnerText(highlightPage.scoringTypeDropdown(), 'Auto scored');
+            highlightPage.steps.selectPartialDifferentWeightsCheckbox();
+        });
+
+        it('When the user has switched to \'Partial - different weights\' scoring, then \'Set points\' button should be displayed and it should be disabled, \'Penalty Points\' and \'Minimum score awarded (if attempted)\' labels and input fields should be displayed and \'Round down score\' checkbox should be displayed and by default it should be checked', () => {
+            highlightPage.steps.verifyDefaultSetPointsButtonLabelAndDisabledState();
+            highlightPage.steps.verifyDefaultPenaltyPointsInputFieldAndLabel();
+            highlightPage.steps.verifyDefaultMinimumScoreIfAttemptedLabelAndPointsField()
+            highlightPage.steps.verifyDefaultRoundDownScoreCheckboxCheckedAndLabel();
+        });
+
+        it('When user selects an option in set correct answer section, then the \'Set points\' button should be enabled', () => {
+            highlightPage.steps.selectOptionInSetCorrectAnswerSection(paragraphTextArray[0]);
+            highlightPage.steps.verifySetPointsButtonLabelAndEnabledState();
+        });
+
+        it('CSS of \'Set points\' button', { tags: 'css' }, () => {
+            utilities.verifyCSS(highlightPage.setPointsButton(), {
+                'color': css.color.activeButtons,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.regular
+            });
+            utilities.verifyCSS(highlightPage.setPointsButton().find('svg'), {
+                'color': css.color.activeButtons
+            });
+        });
+
+        it('Accessibility of \'Set points\' button', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(highlightPage.setPointsButton());
+        });
+
+        it('When user clicks on \'Set points\' button, then the popup should be displayed with \'Set points\' title,', () => {
+            highlightPage.steps.clickOnSetPointsButton();
+            utilities.verifyElementVisibilityState(highlightPage.dialogBox(), 'visible');
+            utilities.verifyInnerText(highlightPage.dialogBoxTitle(), 'Set points');
+        });
+
+        it('When user has opened \'Set points\' popup and focuses in and out of the points input field then an error message \'Error: Please enter points.\' should be displayed', () => {
+            highlightPage.steps.focusInAndFocusOutOfPointsInputField(0);
+            utilities.verifyInnerText(highlightPage.errorMessage(), 'Error: Please enter points.');
+        });
+
+        highlightPage.tests.verifyCSSAnda11yOfErrorMessage();
+
+        it('When user enters points then the error message should disappear', () => {
+            highlightPage.steps.allotPointsToSetPointsPopupPointsInputField([10]);
+            utilities.verifyElementVisibilityState(highlightPage.errorMessage(), 'notExist');
+        });
+
+        it('When user clicks on Cancel button then the popup should close and on opening the popup again empty points fields should be displayed', () => {
+            highlightPage.steps.cancelSetPointsPopup();
+            highlightPage.steps.clickOnSetPointsButton();
+            utilities.verifyInnerText(highlightPage.pointsInputField(), '');
+            cy.log('Post-step: Close the Set points popup')
+            highlightPage.steps.cancelSetPointsPopup();
+        });
+
+        it('When user selects an option in the set correct answer section then it should be displayed in the \'Set points\' popup with an empty points field under a \'Points\' label', () => {
+            highlightPage.steps.selectOptionInSetCorrectAnswerSection(paragraphTextArray[1]);
+            highlightPage.steps.selectOptionInSetCorrectAnswerSection(paragraphTextArray[2]);
+            highlightPage.steps.clickOnSetPointsButton();
+            highlightPage.steps.verifySetPointsPopupOptions(paragraphTextArray);
+            utilities.verifyInnerText(highlightPage.setPointsPopupPointsLabel(), 'Points');
+            utilities.verifyInnerText(highlightPage.pointsInputField(), '');
+        });
+
+        it('CSS of \'Set points\' popup', { tags: 'css' }, () => {
+            utilities.verifyCSS(highlightPage.dialogBoxTitle(), {
+                'color': css.color.flyoutTitle,
+                'font-size': css.fontSize.heading,
+                'font-weight': css.fontWeight.semibold
+            });
+            utilities.verifyCSS(highlightPage.setPointsPopupPointsLabel(), {
+                'color': css.color.labels,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.semibold
+            });
+            utilities.verifyCSS(highlightPage.setPointsPopupOptions(), {
+                'color': css.color.text,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.regular,
+                'background-color': css.color.figActiveComponentBg,
+                'border': `1px solid ${css.color.activeComponentBorder}`
+            });
+            utilities.verifyCSS(highlightPage.pointsInputField(), {
+                'color': css.color.text,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.regular
+            });
+            utilities.verifyCSS(highlightPage.setPointsPopupSaveButton(), {
+                'color': css.color.whiteText,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.semibold,
+                'background-color': css.color.primaryBtnBg
+            });
+            utilities.verifyCSS(highlightPage.setPointsPopupCancelButton(), {
+                'color': css.color.secondaryBtn,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.semibold,
+                'background-color': css.color.transparent
+            });
+        });
+
+        it('Accessibility of \'Set points\' popup', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(highlightPage.dialogBox());
+        });
+
+        it('When user de-selects an option in the set correct answer section then it should not be displayed in the \'Set points\' popup', () => {
+            cy.log('Pre-step: Close the set points popup');
+            highlightPage.steps.cancelSetPointsPopup();
+            highlightPage.steps.deselectOptionInSetCorrectAnswerSection(paragraphTextArray[2]);
+            highlightPage.steps.clickOnSetPointsButton();
+            highlightPage.steps.verifySetPointsPopupOptions([`${paragraphTextArray[0]}`, `${paragraphTextArray[1]}`]);
+        });
+
+        it('When user adds points to the options and clicks on \'Save\' button then the popup should close and opening the popup again the points should be prefilled', () => {
+            highlightPage.steps.allotPointsToSetPointsPopupPointsInputField([4.8]);
+            highlightPage.steps.savePointsAllotedInSetPointsPopup();
+            highlightPage.steps.clickOnSetPointsButton();
+            highlightPage.steps.verifyPointsAllotedInSetPointsPopup(['4.8', '']);
+            cy.log('Close the Set points popup')
+            highlightPage.steps.cancelSetPointsPopup();
+        });
+
+        it('When user tries to add \'Alternate\' tab without adding points to all options points field then a warning popup should be displayed with \'Warning!\' title and \'Please fill required details.\' should be displayed', () => {
+            highlightPage.steps.clickOnAddAlternateAnswerButton();
+            highlightPage.steps.allFieldsRequiredWarningPopupContents();
+        });
+
+        it('Warning popup should close on clicking the Close icon button', () => {
+            highlightPage.steps.closeWarningPopup();
+        });
+
+        it('\'Error: Please enter points.\' error message should be displayed below the Set points button with error icon on the Correct tab', () => {
+            highlightPage.steps.verifySetCorrectAnswerErrorIconIsDisplayed();
+            utilities.verifyInnerText(highlightPage.errorMessage(), 'Error: Please enter points.');
+        });
+
+        it('When user opens the Set points popup an error message should be displayed below the empty points input field and on entering points the error message should disappear', () => {
+            highlightPage.steps.clickOnSetPointsButton();
+            highlightPage.steps.verifyPointsErrorMessageInSetPointsPopup(1);
+            highlightPage.steps.allotPointsToSetPointsPopupPointsInputField([4, 3]);
+            utilities.verifyElementVisibilityState(highlightPage.errorMessage(), 'notExist');
+        });
+
+        it('When user has alloted points to all options then the error message and error icon should not be displayed', () => {
+            highlightPage.steps.verifySetCorrectAnswerErrorIconIsNotDisplayed();
+            utilities.verifyElementVisibilityState(highlightPage.errorMessage(), 'notExist');
+        });
+
+        it('User should be able to add \'Alternate\' tab', () => {
+            highlightPage.steps.savePointsAllotedInSetPointsPopup();
+            highlightPage.steps.addAlternateTab(1);
+        });
+    });
+
+    describe('Edit tab \'Set correct answer\' section (Correct answer tab) and \'Scoring\' section for Manually Scored scoring type', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Highlight question type, switch to paragraph text selection');
+            highlightPage.steps.navigateToCreateQuestion('highlight');
+            cy.barsPreLoaderWait();
+            highlightPage.steps.clearQuestionInputField();
+            paragraphTextArray.forEach((paragraphText) => {
+                highlightPage.steps.addInputToQuestionInputField(`${paragraphText}{enter}`);
+            });
+            highlightPage.steps.addInputToQuestionInputField('{backspace}');
+            highlightPage.steps.switchTextSelectionTypeInTextSelectionDropdown('Paragraph');
+        });
+
+        it('User should be able to select \'Manually scored\' scoring type from scoring type dropdown', () => {
+            highlightPage.steps.selectAScoringTypeFromScoringTypeDropdown('Manually scored')
+        });
+
+        it('When the user has selected \'Manually Scored\' option from the Scoring Type dropdown then the \'Set Correct Answer\' section should not be displayed, \'All or Nothing\', \'Partial - equal weights\' and \'Partial - different weights\' radio buttons should not be displayed, \'Points\' and \'Minimum score awarded (if attempted)\' labels and input fields should be displayed, round down score label and checkbox should not be displayed and inside Additional Settings accordion Check Answer section i.e. \'Allow students to check answer\' checkbox should not be displayed', () => {
+            utilities.verifyElementVisibilityState(highlightPage.setCorrectAnswerLabel(), 'notExist');
+            utilities.verifyElementVisibilityState(highlightPage.allOrNothingCheckbox(), 'notExist');
+            utilities.verifyElementVisibilityState(highlightPage.partialEqualWeightsCheckbox(), 'notExist');
+            utilities.verifyElementVisibilityState(highlightPage.partialDifferentWeightsCheckbox(), 'notExist');
+            utilities.verifyElementVisibilityState(highlightPage.penaltyPointsInputField(), 'notExist');
+            utilities.verifyElementVisibilityState(highlightPage.penaltyPointsLabel(), 'notExist');
+            utilities.verifyElementVisibilityState(highlightPage.rounddownScoreCheckbox(), 'notExist');
+            utilities.verifyElementVisibilityState(highlightPage.rounddownScoreCheckboxLabel(), 'notExist');
+            highlightPage.steps.verifyDefaultMinimumScoreIfAttemptedLabelAndPointsField();
+            highlightPage.steps.expandAdditonalSettings()
+            utilities.verifyElementVisibilityState(highlightPage.checkAnswerLabel(), 'notExist');
+            utilities.verifyElementVisibilityState(highlightPage.allowStudentsToCheckAnswerLabel(), 'notExist');
+        });
+
+        highlightPage.tests.verifyPointsFieldErrorState(10);
+
+        highlightPage.tests.verifyMinimumScoreIfAttemptedFieldErrorState(10, 20, 10);
+    });
+
+    describe('Edit tab \'Set correct answer\' section (Correct answer tab) and \'Scoring\' section for Non Scored scoring type', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Highlight question type, switch to paragraph text selection');
+            highlightPage.steps.navigateToCreateQuestion('highlight');
+            cy.barsPreLoaderWait();
+            highlightPage.steps.clearQuestionInputField();
+            paragraphTextArray.forEach((paragraphText) => {
+                highlightPage.steps.addInputToQuestionInputField(`${paragraphText}{enter}`);
+            });
+            highlightPage.steps.addInputToQuestionInputField('{backspace}');
+            highlightPage.steps.switchTextSelectionTypeInTextSelectionDropdown('Paragraph');
+        });
+
+        highlightPage.tests.verifyEditTabNonScoredScoringSectionContents();
+
+        highlightPage.tests.verifyContentsOfSetCorrectAnswerSectionForScoringType('Non scored', paragraphTextArray);
+    });
+});

package/cypress/e2e/ILC/Highlight/highlightHeaderSection.js

@@ -0,0 +1,91 @@
+import { dialogBoxBase, highlightPage } from "../../../pages";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+
+describe('Create question page - Highlight: Header section and Saving question', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Header section contents', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to highlight question type');
+            highlightPage.steps.navigateToCreateQuestion('highlight');
+            cy.barsPreLoaderWait();
+        });
+
+        highlightPage.tests.verifyCreateQuestionPageQuestionTypeHeader('Highlight');
+    });
+
+    describe('Tabs section', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to highlight question type');
+            highlightPage.steps.navigateToCreateQuestion('highlight');
+            cy.barsPreLoaderWait();
+        });
+
+        highlightPage.tests.verifyTabsSection();
+    });
+
+    describe('Cancel button', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to highlight question type');
+            highlightPage.steps.navigateToCreateQuestion('highlight');
+            cy.barsPreLoaderWait();
+        });
+
+        highlightPage.tests.verifyCancelButton('highlight');
+    });
+
+    describe('Save Question button', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to highlight question type');
+            highlightPage.steps.navigateToCreateQuestion('highlight');
+            cy.barsPreLoaderWait();
+        });
+
+        describe('Validation error messages', () => {
+            dialogBoxBase.tests.verifyRequiredFieldsWarningPopupOnClickingSaveButton();
+
+            it('Validation error messages should be displayed below required input fields (Question instructions, Highlight options section, Points input field, set correct answer section)', () => {
+                highlightPage.steps.verifyQuestionInstructionsErrorMessage();
+                highlightPage.steps.verifyHighlightOptionsFieldErrorMessage();
+                highlightPage.steps.verifyPointsFieldErrorMessage();
+                highlightPage.steps.verifySetCorrectAnswerErrorIconIsDisplayed();
+                highlightPage.steps.verifySetCorrectAnswerErrorMessage();
+            });
+
+            it('When the user has made no changes and switches to the preview tab and clicks on \'Save question\' button, the user should get a warning popup and on closing the warning popup, the user should be on the edit tab', () => {
+                highlightPage.steps.switchToPreviewTab();
+                highlightPage.steps.clickOnSaveQuestionButton();
+                utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'visible');
+                dialogBoxBase.steps.closeWarningPopup();
+                highlightPage.steps.verifyEditTabSelectedState();
+                highlightPage.steps.verifyPreviewTabNotSelectedState();
+            });
+
+            it('Validation error messages should disappear when all required input fields are filled', () => {
+                highlightPage.steps.addQuestionInstructions();
+                highlightPage.steps.switchTextSelectionTypeInTextSelectionDropdown('Paragraph');
+                highlightPage.steps.selectOptionInSetCorrectAnswerSection('Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.');
+                highlightPage.steps.allotPoints(10);
+                highlightPage.steps.verifyErrorMessageIsNotDisplayed();
+                highlightPage.steps.verifySetCorrectAnswerErrorIconIsNotDisplayed();
+            });
+
+            highlightPage.tests.verifya11yOfCreateItemWrapperContents();
+        });
+    });
+
+    describe('Saving a question', () => {
+        it('When user has filled all the mandatory fields then on clicking on Save Question button the question should get saved and a snackbar with text \'Saved successfully!\' should be displayed', () => {
+            highlightPage.steps.saveAQuestionAndVerifySnackbar();
+        });
+
+        highlightPage.tests.verifySavedSuccessfullySnackbarCSSanda11y();
+    });
+});

package/cypress/e2e/ILC/Highlight/highlightQuestionInstructionsAndQuestion.js

@@ -0,0 +1,178 @@
+import { highlightPage } from "../../../pages";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+const css = Cypress.env('css');
+
+describe('Create Item page - Highlight: Question Instructions and Question section', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Question Instructions input field - Edit tab', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Highlight question type');
+            highlightPage.steps.navigateToCreateQuestion('highlight');
+            cy.barsPreLoaderWait();
+        });
+
+        highlightPage.tests.verifyQuestionInstructionsInputFieldEditTab();
+    });
+
+    describe('Question Instructions input field - Preview tab', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Highlight question type');
+            highlightPage.steps.navigateToCreateQuestion('highlight');
+            cy.barsPreLoaderWait();
+        });
+
+        highlightPage.tests.verifyQuestionInstructionsInputFieldPreviewTab();
+    });
+
+    describe('Question input field - Edit tab', () => {
+        abortEarlySetup();
+        before(() => {
+            highlightPage.steps.navigateToCreateQuestion('highlight');
+            cy.barsPreLoaderWait();
+        });
+
+        it('\'Question\' label and input field should be displayed and by default in the question input field, sample \'Lorem Ipsum\' text should be present', () => {
+            utilities.verifyInnerText(highlightPage.questionLabel(), 'Question');
+            utilities.verifyInnerText(highlightPage.questionInputField(), 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.\n\n\n\n\nUt enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.\n\n\n\n\nExcepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.');
+        });
+
+        it('The default sample \'Lorem Ipsum\' text in the question input field should also be displayed in Highlight options section and Set correct answer section in the Edit tab.', () => {
+            utilities.verifyInnerText(highlightPage.highlightOptionsSectionTextWrapper(), 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.\n\n \n\nUt enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.\n\n \n\nExcepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.');
+            utilities.verifyInnerText(highlightPage.setCorrectAnswerTextWrapper(), 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.\n\n \n\nUt enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.\n\n \n\nExcepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.');
+        });
+
+        it('When the user removes all the text from the question input field and focuses out of it, an error message \'Error: Question is required.\' should be displayed', () => {
+            highlightPage.steps.clearQuestionInputField();
+            highlightPage.steps.focusOutOfQuestionInputField();
+            utilities.verifyInnerText(highlightPage.errorMessage(), 'Error: Question is required.');
+            highlightPage.steps.verifyErroredStateOfQuestionInputField();
+        });
+
+        highlightPage.tests.verifyCSSAnda11yOfErrorMessage();
+
+        it('The user should be able to give input in the question input field, then the error message should disappear and the updated question should be displayed in Highlight options section and Set correct answer section in the Edit tab', () => {
+            cy.log('Add Image to Question input field')
+            highlightPage.steps.focusInQuestionInputField();
+            highlightPage.steps.selectImageOptionFromCKEditorToolbar();
+            highlightPage.steps.addImageToInputField();
+            highlightPage.steps.verifyImageAndAltTextInQuestionInputField();
+            highlightPage.steps.addInputToQuestionInputField('{enter}');
+            cy.log('Add equation to Question input field')
+            highlightPage.steps.selectEquationEditorOptionFromCKEditorToolbar();
+            highlightPage.steps.addGenericEquationUsingEquationEditorToCKEditorInputField();
+            highlightPage.steps.verifyEquationInQuestionInputField();
+            highlightPage.steps.addInputToQuestionInputField('{rightarrow}{enter}');
+            cy.log('Add bold text to input field')
+            highlightPage.steps.focusInQuestionInputField();
+            highlightPage.steps.selectBoldOptionFromCKEditorToolbar();
+            highlightPage.steps.addInputToQuestionInputField('This is Bold text input.');
+            highlightPage.steps.verifyBoldTextInQuestionInputField();
+            highlightPage.steps.addInputToQuestionInputField('{enter}');
+            cy.log('Add link to Question input field')
+            highlightPage.steps.selectLinkOptionFromCKEditorToolbar();
+            highlightPage.steps.addLinkToInputField();
+            highlightPage.steps.verifyLinkInQuestionInputField();
+            utilities.verifyElementVisibilityState(highlightPage.errorMessage(), 'notExist');
+            highlightPage.steps.focusOutOfQuestionInputField();
+        });
+
+        it('CSS of Question label and Question input field contents', { tags: 'css' }, () => {
+            utilities.verifyCSS(highlightPage.questionLabel(), {
+                'color': css.color.sectionHeading,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.semibold
+            });
+            utilities.verifyCSS(highlightPage.questionInputField(), {
+                'color': css.color.text,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.regular,
+                'border': `1px solid ${css.color.figDefaultComponentBorder}`
+            });
+            utilities.verifyCSS(highlightPage.questionInputField().find('a'), {
+                'color': css.color.linkText,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.bold
+            });
+        });
+
+        it('Image, equation, bold text and link added in Question input field should be properly displayed in highlight options section', () => {
+            highlightPage.steps.verifyImageAndAltTextInHighlightOptionsSection();
+            highlightPage.steps.verifyEquationInHighlightOptionsSection();
+            highlightPage.steps.verifyBoldTextInHighlightOptionsSection();
+            highlightPage.steps.verifyLinkInHighlightOptionsSection();
+        });
+
+        it('Image, equation, bold text and link added in Question input field should be properly displayed in set correct answer section', () => {
+            highlightPage.steps.verifyImageAndAltTextInSetCorrectAnswerSection();
+            highlightPage.steps.verifyEquationInSetCorrectAnswerSection();
+            highlightPage.steps.verifyBoldTextInSetCorrectAnswerSection();
+            highlightPage.steps.verifyLinkInSetCorrectAnswerSection();
+        });
+    });
+
+    describe('Question field - Preview tab', () => {
+        abortEarlySetup();
+        before(() => {
+            highlightPage.steps.navigateToCreateQuestion('highlight');
+            cy.barsPreLoaderWait();
+        });
+
+        it('In Preview tab, the sample \'Lorem Ipsum\' text should be displayed in the question field', () => {
+            highlightPage.steps.switchToPreviewTab()
+            utilities.verifyInnerText(highlightPage.previewTabQuestionContainer(), 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.\n\n \n\nUt enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.\n\n \n\nExcepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.');
+        });
+
+        it('The user should be able to edit text in the question input field and the updated question should be displayed in the preview tab', () => {
+            cy.log('Switching to edit tab')
+            highlightPage.steps.switchToEditTab();
+            highlightPage.steps.clearQuestionInputField();
+            cy.log('Add Image to Question input field')
+            highlightPage.steps.focusInQuestionInputField();
+            highlightPage.steps.selectImageOptionFromCKEditorToolbar();
+            highlightPage.steps.addImageToInputField();
+            highlightPage.steps.verifyImageAndAltTextInQuestionInputField();
+            highlightPage.steps.addInputToQuestionInputField('{enter}');
+            cy.log('Add equation to Question input field')
+            highlightPage.steps.selectEquationEditorOptionFromCKEditorToolbar();
+            highlightPage.steps.addGenericEquationUsingEquationEditorToCKEditorInputField();
+            highlightPage.steps.verifyEquationInQuestionInputField();
+            highlightPage.steps.addInputToQuestionInputField('{rightarrow}{enter}');
+            cy.log('Add bold text to input field')
+            highlightPage.steps.focusInQuestionInputField();
+            highlightPage.steps.selectBoldOptionFromCKEditorToolbar();
+            highlightPage.steps.addInputToQuestionInputField('This is Bold text input.');
+            highlightPage.steps.verifyBoldTextInQuestionInputField();
+            highlightPage.steps.addInputToQuestionInputField('{enter}');
+            cy.log('Add link to Question input field')
+            highlightPage.steps.selectLinkOptionFromCKEditorToolbar();
+            highlightPage.steps.addLinkToInputField();
+            highlightPage.steps.verifyLinkInQuestionInputField();
+            cy.log('Switching to preview tab')
+            highlightPage.steps.switchToPreviewTab();
+            highlightPage.steps.verifyImageAndAltTextInPreviewTab();
+            highlightPage.steps.verifyEquationInPreviewTab();
+            highlightPage.steps.verifyBoldTextInPreviewTab();
+            highlightPage.steps.verifyLinkInPreviewTab();
+        });
+
+        //Failing due to https://redmine.zeuslearning.com/issues/537907
+        it('CSS of \'Preview tab\' when image, equation, bold text and link are added', { tags: 'css' }, () => {
+            utilities.verifyCSS(highlightPage.previewTabQuestionContainer().find('strong'), {
+                'color': css.color.labels,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.bold
+            });
+            utilities.verifyCSS(highlightPage.previewTabQuestionContainer().find('a'), {
+                'color': css.color.linkText,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.bold
+            });
+        });
+    });
+});

package/cypress/e2e/ILC/Highlight/highlightScoringSectionBasic.js

@@ -0,0 +1,21 @@
+import { highlightPage } from "../../../pages";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+
+describe('Create Item page - Fill in the gaps - drag and drop: Scoring Section basic: Labels, dropdown, checkboxes', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Scoring Section contents', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Highlight question type');
+            highlightPage.steps.navigateToCreateQuestion('highlight');
+            cy.barsPreLoaderWait();
+        });
+
+        highlightPage.tests.verifyScoringTypeLabelAndDropdown('autoScored');
+
+        highlightPage.tests.verifyAutoScoredScoringTypeSectionWithCSSAnda11y();
+    });
+});