itemengine-cypress-automation 1.0.200-23rdMayUpdates-264dc55.0 → 1.0.201-28thMayRepoUpdate-e720349.0

package/cypress/e2e/ILC/chartsDotsPlot/studentViewSettings.js

@@ -0,0 +1,141 @@
+import { chartsDotPlotPage } from "../../../pages";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+const css = Cypress.env('css');
+const range = 20.75;
+
+describe('Create Item page - Charts - Dot plot : Student view settings', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Student view settings : Edit tab contents', () => {
+        abortEarlySetup();
+        before(() => {
+            chartsDotPlotPage.steps.navigateToCreateQuestion('charts');
+            cy.barsPreLoaderWait();
+            chartsDotPlotPage.steps.selectDotPlot();
+        });
+
+        chartsDotPlotPage.tests.verifyStudentViewSettingsLabelAndCSS();
+
+        it('\'Allow student to check answer\' label and checkbox should be displayed and it should be unchecked by default', () => {
+            utilities.verifyInnerText(chartsDotPlotPage.allowStudentToCheckAnswerLabel(), 'Allow student to check answer');
+            chartsDotPlotPage.steps.verifyAllowStudentsToCheckAnswerCheckboxUnchecked();
+        });
+
+        it('When the user checks the \'Allow student to check answer\' checkbox, then \'Maximum check answer attempts\' dropdown should be displayed', () => {
+            chartsDotPlotPage.steps.checkAllowStudentsToCheckAnswerCheckbox();
+            utilities.verifyElementVisibilityState(chartsDotPlotPage.maximumCheckAnswerAttemptsDropdown(), 'visible');
+        });
+
+        chartsDotPlotPage.tests.verifyMaxCheckAnswerAttemptsDropdown();
+
+        it('CSS of student view settings section', { tags: 'css' }, () => {
+            utilities.verifyCSS(chartsDotPlotPage.allowStudentToCheckAnswerLabel(), {
+                'color': css.color.labels,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.regular
+            });
+            utilities.verifyCSS(chartsDotPlotPage.allowStudentToCheckAnswerCheckbox().parent().find('.checkbox-icon-border-rect'), {
+                'fill': css.color.activeButtons
+            });
+            utilities.verifyCSS(chartsDotPlotPage.maximumCheckAnswerAttemptsDropdownLabel(), {
+                'color': css.color.labels,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.semibold
+            });
+            utilities.verifyCSS(chartsDotPlotPage.maximumCheckAnswerAttemptsDropdown().find('span'), {
+                'color': css.color.liText,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.regular
+            });
+            utilities.verifyCSS(chartsDotPlotPage.maximumCheckAnswerAttemptsDropdownListOptions().eq(0), {
+                'color': css.color.liText,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.regular,
+                'background-color': css.color.liTextSelectedBg
+            });
+        });
+
+        it('Accessibility of student view settings section', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(chartsDotPlotPage.allowStudentToCheckAnswerLabel().parents('.student-view-settings-container'));
+        });
+    });
+
+    describe('Allow student to check answer: Preview tab', () => {
+        abortEarlySetup();
+        before(() => {
+            chartsDotPlotPage.steps.navigateToCreateQuestion('charts');
+            cy.barsPreLoaderWait();
+            chartsDotPlotPage.steps.allotPoints(10);
+            chartsDotPlotPage.steps.selectDotPlot();
+            chartsDotPlotPage.steps.plotDotsInDotColumnSpecifyCorrectAnswer(2, { point: 1, min: 0, interval: 0.25, defaultDots: 0 });
+        });
+
+        it('When the user has specified correct answer and points then on checking the \'Allow student to check answer\' checkbox the Check answer button should be displayed in the preview tab', () => {
+            chartsDotPlotPage.steps.checkAllowStudentToCheckAnswerCheckbox();
+            chartsDotPlotPage.steps.switchToPreviewTab();
+            utilities.verifyInnerText(chartsDotPlotPage.checkAnswerButton(), 'Check answer');
+        });
+
+        it('When the user plots dots in dot column number line axis and checks the answer then correct/incorrect icon should be displayed on dot column and the check answer button should be in enabled state', () => {
+            chartsDotPlotPage.steps.switchToPreviewTab();
+            chartsDotPlotPage.steps.plotDotsInDotColumnPreviewTab(2, { point: 1, min: 0, interval: 0.25, defaultDots: 0 });
+            chartsDotPlotPage.steps.checkAnswer();
+            chartsDotPlotPage.steps.verifyCorrectDotColumnPreviewTab({ point: 1, min: 0, interval: 0.25 });
+            chartsDotPlotPage.steps.verifyCheckAnswerButtonEnabled();
+        });
+
+        it('When the user selects an option from the Maximum check answer attempts dropdown then the user should be able to check answer only those many times in the preview tab', () => {
+            chartsDotPlotPage.steps.switchToEditTab();
+            chartsDotPlotPage.steps.expandMaxCheckAnswerAttemptsDropdown();
+            chartsDotPlotPage.steps.selectMaxCheckAnswerAttemptsDropdownListOption('1');
+            chartsDotPlotPage.steps.switchToPreviewTab();
+            chartsDotPlotPage.steps.plotDotsInDotColumnPreviewTab(2, { point: 1, min: 0, interval: 0.25, defaultDots: 0 });
+            chartsDotPlotPage.steps.checkAnswer();
+            chartsDotPlotPage.steps.verifyCheckAnswerButtonDisabled();
+        });
+
+        it('When the user reaches maximum check answer attempts, then the \'Check Answer\' button should become disabled', () => {
+            utilities.verifyElementDisabled(chartsDotPlotPage.checkAnswerButton());
+        });
+
+        it('CSS of disabled \'Check Answer\' button', { tags: 'css' }, () => {
+            utilities.verifyCSS(chartsDotPlotPage.checkAnswerButton(), {
+                'color': css.color.primaryBtnDisabled,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.semibold
+            });
+        });
+
+        it('Accessibility of disabled Check Answer button', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(chartsDotPlotPage.checkAnswerButton().parents('.check-answer-and-status-wrapper'));
+        });
+
+        it('When the user updates the value of \'Maximum check answer attempts\' dropdown, it should get reflected on the Preview tab', () => {
+            chartsDotPlotPage.steps.switchToEditTab();
+            chartsDotPlotPage.steps.expandMaxCheckAnswerAttemptsDropdown();
+            chartsDotPlotPage.steps.selectMaxCheckAnswerAttemptsDropdownListOption('3');
+            chartsDotPlotPage.steps.switchToPreviewTab();
+            chartsDotPlotPage.steps.verifyCheckAnswerButtonEnabled();
+            chartsDotPlotPage.steps.plotDotsInDotColumnPreviewTab(2, { point: 1, min: 0, interval: 0.25, defaultDots: 0 });
+            chartsDotPlotPage.steps.checkAnswer();
+            chartsDotPlotPage.steps.verifyCheckAnswerButtonEnabled();
+        });
+
+        it('When the user selects \'No limit\' option from the dropdown then user should be able to check answer multiple times', () => {
+            chartsDotPlotPage.steps.switchToEditTab();
+            chartsDotPlotPage.steps.expandMaxCheckAnswerAttemptsDropdown();
+            chartsDotPlotPage.steps.selectMaxCheckAnswerAttemptsDropdownListOption('0');
+            chartsDotPlotPage.steps.switchToPreviewTab();
+            chartsDotPlotPage.steps.verifyCheckAnswerButtonEnabled();
+            chartsDotPlotPage.steps.plotDotsInDotColumnPreviewTab(2, { point: 1, min: 0, interval: 0.25, defaultDots: 0 });
+            chartsDotPlotPage.steps.checkAnswer();
+            chartsDotPlotPage.steps.verifyCheckAnswerButtonEnabled();
+            chartsDotPlotPage.steps.plotDotsInDotColumnPreviewTab(2, { point: 2, min: 0, interval: 0.25, defaultDots: 0 });
+            chartsDotPlotPage.steps.checkAnswer();
+            chartsDotPlotPage.steps.verifyCheckAnswerButtonEnabled();
+        });
+    });
+});

package/cypress/fixtures/theme/ilc.json

@@ -147,7 +147,8 @@
         "lockedDotColumnBg": "rgb(239, 239, 239)",
         "addDotButtonBg": "rgb(0, 133, 89)",
         "minusDotButtonBg": "rgb(184, 61, 0)",
-        "progressBarPin": "rgb(0, 0, 46)"
+        "progressBarPin": "rgb(0, 0, 46)",
+        "none": "rgba(255, 255, 255, 0)"
     },
     "fontSize": {
         "extraSmall": "10px",

package/cypress/pages/audioPlayerPage.js

@@ -69,6 +69,9 @@ const selectors = {
     deleteTranscriptButton: () => cy.get('[aria-label*="Delete"]'),
 
     //Preview tab
+    volumeControlButton: () => cy.get('.audio-resource-preview-wrapper-without-print .audio-player-icon'),
+    playbackPlayButton: () => cy.get('.audio-resource-preview-wrapper-without-print button[aria-label="Play"]'),
+    playbackPauseButton: () => cy.get('.audio-resource-preview-wrapper-without-print button[aria-label="Pause"]'),
     backwardButton: () => cy.get('.forward-backward-buttons-wrapper [aria-label*="Backward"]'),
     forwardButton: () => cy.get('.forward-backward-buttons-wrapper [aria-label*="Forward"]'),
     playbackTime: () => cy.get('.audio-player-current-time'),
@@ -81,7 +84,7 @@ const selectors = {
     transcriptPrintButton: () => cy.get('button[aria-label="Print preview"]'),
     transcriptModalCloseButton: () => cy.get('button[aria-label="Close"]'),
     transcriptContentPreviewTab: () => cy.get('.transcript-content'),
-    transcriptButton: () => cy.get('button[aria-label="Show transcript"]'),
+    transcriptButton: () => cy.get('button[aria-label*="transcript"]'),
     transcriptModal: () => cy.get('[class*="Transcriptstyles__TranscriptWrapper"]'),
     standardPreviewPlayerWrapper: () => cy.get('.standard-audio-resource-preview'),
     audioPlayerToolbar: () => cy.get('.audio-player-toolbar'),

package/cypress/pages/chartsBarPage.js

@@ -1,5 +1,5 @@
 import utilities from "../support/helpers/utilities"
-import { barAndLineChartComponent, chartsCommonComponent, createQuestionBasePage, questionInstructionsComponent, resetPopupComponent, scoringSectionBaseEditTab, commonComponents, autoScoredStudentViewSettings, autoScoredScoringPreviewTab, autoScoredScoringSectionMultiResponseType, autoScoredSpecifyCorrectAnswerSection, correctIncorrectAnswerLabelComponent } from "./components";
+import { barAndLineChartComponent, chartsCommonComponent, createQuestionBasePage, questionInstructionsComponent, resetPopupComponent, scoringSectionBaseEditTab, commonComponents, autoScoredStudentViewSettings, autoScoredScoringPreviewTab, autoScoredScoringSectionMultiResponseType, autoScoredSpecifyCorrectAnswerSection, correctIncorrectAnswerLabelComponent, studentViewSettingsLabelComponent } from "./components";
 import { dialogBoxBase } from "./dialogBoxBase";
 const css = Cypress.env('css');
 
@@ -8,6 +8,8 @@ const selectors = {
     ...barAndLineChartComponent,
     ...commonComponents,
     ...dialogBoxBase,
+    ...autoScoredStudentViewSettings,
+    ...autoScoredScoringPreviewTab,
     ...autoScoredScoringPreviewTab,
     ...correctIncorrectAnswerLabelComponent,
     ...chartsCommonComponent,
@@ -398,11 +400,29 @@ const steps = {
         chartsBarPage.steps.verifyBarIsLockedInCorrectAnswerSection(barIndex);
         chartsBarPage.steps.verifyBarCorrectIncorrectIconNotExistsInCorrectAnswerSection(barIndex);
     },
+
+    /**
+    * @param {("correct" | "incorrect")} answerStatus - The status of the answer.
+    * @description Verifies the visibility and content of the correct/incorrect answer label block.
+    * If the answer is correct, it also verifies the visibility of the correct icon;
+    * otherwise, it verifies the visibility of the incorrect icon.
+    */
+    verifyCorrectIncorrectAnswerLabel: (answerStatus) => {
+        utilities.verifyElementVisibilityState(correctIncorrectAnswerLabelComponent.correctIncorrectAnswerBlock(), 'exist');
+        utilities.verifyInnerText(correctIncorrectAnswerLabelComponent.correctIncorrectStatusMessageText(), `Your answer is${answerStatus}`)
+        if (answerStatus === 'correct') {
+            utilities.verifyElementVisibilityState(autoScoredScoringPreviewTab.correctIcon(), 'visible');
+        } else {
+            utilities.verifyElementVisibilityState(autoScoredScoringPreviewTab.incorrectIcon(), 'visible');
+        }
+    }
 }
 
 const tests = {
     ...autoScoredScoringPreviewTab.tests,
     ...resetPopupComponent.tests,
+    ...autoScoredStudentViewSettings.tests,
+    ...studentViewSettingsLabelComponent.tests,
 
     /**
      * Verify bar tooltip contents with css and a11y in preview tab

package/cypress/pages/chartsDotPlotPage.js

@@ -14,6 +14,7 @@ const selectors = {
     ...additionalSettingsPanel,
     ...studentViewSettingsLabelComponent,
     ...autoScoredScoringPreviewTab,
+    ...autoScoredSpecifyCorrectAnswerSection,
     ...selectQuestionResourceToolPage,
     ...dialogBoxBase,
 
@@ -53,10 +54,14 @@ const selectors = {
     tooltipWrapperSpecifyCorrectAnswer: () => cy.get('.ngie-accordion-detail .charts-tooltip-wrapper'),
     labelsNumberLineAxisSpecifyCorrectAnswer: () => cy.get('.ngie-accordion-detail .label-wrapper [class*="DotPlotChartstyles__Label"]'),
     numberLineAxisSpecifyCorrectAnswer: () => cy.get('.ngie-accordion-detail .number-line-wrapper'),
-    labelsNumberLineAxisSpecifyCorrectAnswer: () => cy.get('.ngie-accordion-detail .label-wrapper [class*="DotPlotChartstyles__Label"]'),
     partialEqualWeightsPointsPerResponseScore: () => cy.get('[class*="Chartsstyles__EqualPoints"]'),
     dotColumnNumerationPointsLabel: () => cy.get('[class*="Chartsstyles__PartialPointsWrapper"] .partial-points-input-label'),
     pointsInputField: () => cy.get('.ngie-accordion-detail .points-input-field input[type="text"]'),
+    dotColumnLockIconSpecifyCorrectAnswer: () => cy.get('[class*="LockIconWrapper"]'),
+    dotPlotChartSpecifyCorrectAnswer: () => cy.get('.ngie-accordion-detail [class*="DotPlotChartstyles__ChartWrapper"]'),
+
+    toleranceThresholdLabel: () => cy.get('[class*="AllocatedPointsstyles__PointsWrapper"] .points-label'),
+    toleranceThresholdInputField: () => cy.get('[class*="AllocatedPointsstyles__PointsWrapper"] input'),
 
     //preview tab
     dotColumnPreviewTab: () => cy.get('.ngie-chart-point:visible'),
@@ -233,7 +238,6 @@ const steps = {
         }
     },
 
-
     /**
      * Removes dots 
      * @param {number} numberOfDots - The number of dots to be removed
@@ -372,7 +376,7 @@ const steps = {
       * @param {string} controlOption - The control option to select.
       */
     selectControlOptionSpecifyCorrectAnswer: (controlOption) => {
-        controlOptionsSpecifyCorrectAnswer(controlOption)
+        chartsDotPlotPage.controlOptionsSpecifyCorrectAnswer(controlOption)
             .click();
     },
 
@@ -440,6 +444,7 @@ const steps = {
       */
     verifyLabelsOnNumberLineAxisSpecifyCorrectAnswer: (min, max, annotateEvery) => {
         let expectedLabelsIndex = [];
+        let indexForArray = 0;
         chartsDotPlotPage.labelsNumberLineAxisSpecifyCorrectAnswer()
             .each((value, index) => {
                 if (index % annotateEvery === 0) {
@@ -448,14 +453,69 @@ const steps = {
             })
             .then(() => {
                 for (var i = min; i < max; i++) {
-                    console.log(expectedLabelsIndex[i])
                     chartsDotPlotPage.labelsNumberLineAxisSpecifyCorrectAnswer()
-                        .eq(expectedLabelsIndex[i - 1])
+                        .eq(expectedLabelsIndex[indexForArray])
                         .should('have.text', i)
+                    indexForArray += 1;
                 }
             });
     },
 
+    /**
+     * Verifies the number of divisions on the number line axis.
+     * @param {object} options - The options object containing min, max, and interval values.
+     * @param {number} options.min - The minimum value.
+     * @param {number} options.max - The maximum value.
+     * @param {number} options.interval - The interval value.
+     */
+    verifyDivisionsOnNumberLineAxisSpecifyCorrectAnswer: ({ min, max, interval }) => {
+        const expectedDivisions = Math.round((max - min) / interval);
+        chartsDotPlotPage.numberLineAxisSpecifyCorrectAnswer()
+            .find('.number-line')
+            .its('length')
+            .then((len) => {
+                expect(len).to.equal(expectedDivisions);
+            });
+    },
+
+    /**
+      * Verifies that the default dot column
+      * @param {object} options - The options object containing point, min, and interval.
+      * @param {number} options.point - The point value.
+      * @param {number} options.min - The minimum value.
+      * @param {number} options.interval - The interval value.
+      */
+    verifyLockedDotColumnSpecifyCorrectAnswer: ({ point, min, interval }) => {
+        const index = Math.round((point - min) / interval);
+        utilities.getNthElement(chartsDotPlotPage.dotColumnSpecifyCorrectAnswer(), index)
+            .within(() => {
+                utilities.verifyElementVisibilityState(chartsDotPlotPage.dotColumnLockIconSpecifyCorrectAnswer(), 'visible');
+            });
+        utilities.getNthElement(chartsDotPlotPage.dotColumnSpecifyCorrectAnswer(), index)
+            .should('have.css', 'background-color', css.color.lockedDotColumnBg);
+        steps.verifyDefaultDotSpecifyCorrectAnswer({ point, min, interval });
+    },
+
+    /**
+    * Verifies that the default dot exists in the specified column 
+    * @param {object} options - The options object containing point, min, and interval.
+    * @param {number} options.point - The point value.
+    * @param {number} options.min - The minimum value.
+    * @param {number} options.interval - The interval value.
+    */
+    verifyDefaultDotSpecifyCorrectAnswer: ({ point, min, interval }) => {
+        const index = Math.round((point - min) / interval);
+        chartsDotPlotPage.dotColumnSpecifyCorrectAnswer()
+            .eq(index)
+            .within(() => {
+                chartsDotPlotPage.dotIconSpecifyCorrectAnswer()
+                    .each((el) => {
+                        cy.wrap(el)
+                            .should('have.css', 'background-color', css.color.activeButtons)
+                    });
+            });
+    },
+
     verifyPointsPerResponseLabel: () => {
         utilities.verifyInnerText(autoScoredScoringSectionMultiResponseType.pointsPerResponseLabel(), 'Points per response:\n-');
         utilities.verifyElementVisibilityState(autoScoredScoringSectionMultiResponseType.pointsPerResponseLabel(), 'visible');
@@ -849,7 +909,6 @@ const steps = {
             })
             .then(() => {
                 for (var i = min; i < max; i++) {
-                    console.log(expectedLabelsIndex[i])
                     chartsDotPlotPage.labelsNumberLineAxisPreviewTab()
                         .eq(expectedLabelsIndex[i - 1])
                         .should('have.text', i)
@@ -876,6 +935,10 @@ const steps = {
             });
     },
 
+    verifyCorrectIncorrectAnswerLabelNotExists: () => {
+        utilities.verifyElementVisibilityState(chartsDotPlotPage.correctIncorrectAnswerTextWrapper(), `notExist`);
+    },
+
     verifyCorrectAnswerSectionNotExists: () => {
         utilities.verifyElementVisibilityState(chartsDotPlotPage.dotPlotChartCorrectAnswerSection(), 'notExist');
     },
@@ -1087,7 +1150,7 @@ const steps = {
         chartsDotPlotPage.toleranceThresholdInputField()
             .focus()
             .blur();
-    },
+    }
 }
 
 const tests = {
@@ -1101,15 +1164,84 @@ const tests = {
     ...commonComponents.tests,
     ...studentViewSettingsLabelComponent.tests,
     ...autoScoredStudentViewSettings.tests,
+    ...autoScoredSpecifyCorrectAnswerSection.tests,
     ...chartsCommonComponent.tests,
 
     verifyContentsOfSpecifyCorrectAnswerSection: () => {
         it('When user selects a scoring type then in the \'Correct\' accordion, all the contents should be displayed', () => {
-            chartsCommonComponent.steps.verifyGraphTitleInSpecifyCorrectAnswer('Graph title');
-            chartsCommonComponent.steps.verifyXAxisLabelInSpecifyCorrectAnswer('Label');
+            chartsCommonComponent.steps.verifyGraphTitleInSpecifyCorrectAnswer('Five-day observation');
+            chartsCommonComponent.steps.verifyXAxisLabelInSpecifyCorrectAnswer('Days');
             utilities.verifyElementVisibilityState(chartsDotPlotPage.numberLineAxisSpecifyCorrectAnswer(), 'exist');
             chartsDotPlotPage.steps.verifyLabelsOnNumberLineAxisSpecifyCorrectAnswer(1, 4, 1);
         });
+    },
+
+    /**
+   * Verifies the contents and functionality of the 'Specify correct answer' accordion for multiple selection questions.
+   * @param {{'Correct' | 'Alternative'}} accordionName - The name of the accordion to be used in the validation.
+   * @example - verifySpecifyCorrectAnswerAccordionContentsAndFunctionality('Correct');
+   */
+    verifySpecifyCorrectAnswerAccordionContentsAndFunctionality: (accordionName) => {
+        it('The number line axis should be displayed with labels from 1 to 6 with 20 divisions', () => {
+            utilities.verifyElementVisibilityState(chartsDotPlotPage.numberLineAxisSpecifyCorrectAnswer(), 'exist');
+            chartsDotPlotPage.steps.verifyDivisionsOnNumberLineAxisSpecifyCorrectAnswer({ min: 1, max: 6, interval: 0.25 });
+            chartsDotPlotPage.steps.verifyLabelsOnNumberLineAxisSpecifyCorrectAnswer(0, 5, 4);
+        });
+
+        it(`The user should be able to plot dots in dot column on number line axis in the specify correct answer section ${accordionName} accordion`, () => {
+            steps.plotDotsInDotColumnSpecifyCorrectAnswer(2, { point: 0, min: 0, interval: 0.25, defaultDots: 0 })
+        });
+
+        it(`When the user resets the number line in the ${accordionName} accordion, error message should not be thrown on the \'${accordionName}\' accordion`, () => {
+            steps.selectControlOptionSpecifyCorrectAnswer('Reset');
+            chartsDotPlotPage.steps.confirmReset();
+            utilities.verifyElementVisibilityState(commonComponents.errorMessage(), 'notExist');
+            if (accordionName == 'Correct') {
+                autoScoredSpecifyCorrectAnswerSection.correctAnswerAccordion()
+                    .within(() => {
+                        utilities.verifyElementVisibilityState(autoScoredSpecifyCorrectAnswerSection.specifyCorrectAnswerErrorIcon(), 'notExist');
+                    });
+            } else {
+                autoScoredSpecifyCorrectAnswerSection.alternativeAnswerAccordion()
+                    .within(() => {
+                        utilities.verifyElementVisibilityState(autoScoredSpecifyCorrectAnswerSection.specifyCorrectAnswerErrorIcon(), 'notExist');
+                    });
+            };
+        });
+
+        tests.verifyAutoScoredPointsErrorMessageWhenPointsFieldIsEmpty(accordionName);
+
+        it('Accessibility of \'Correct\' accordion contents', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(chartsDotPlotPage.numberLineAxisSpecifyCorrectAnswer().parents('.ngie-accordion-detail'));
+        });
+    },
+
+    /**
+     * @description Verifies the behavior of points input field and error messages when the points field is empty.
+     * @param {{'Correct' | 'Alternative'}} accordionName - The name of the accordion to be used in the validation.
+     * @example - verifyAutoScoredPointsErrorMessageWhenPointsFieldIsEmpty('Correct');
+     */
+    verifyAutoScoredPointsErrorMessageWhenPointsFieldIsEmpty: (accordionName) => {
+        it(`When the user focuses in and out of the empty points input field, no points error message should be displayed below the points input field and error icon should not be displayed on the \'${accordionName}\' accordion`, () => {
+            scoringSectionBaseEditTab.pointsInputField()
+                .eq(0)
+                .focus();
+            scoringSectionBaseEditTab.pointsInputField()
+                .eq(0)
+                .blur();
+            utilities.verifyElementVisibilityState(scoringSectionBaseEditTab.pleaseEnterPointsErrorMessage(), 'notExist')
+            if (accordionName == 'Correct') {
+                autoScoredSpecifyCorrectAnswerSection.correctAnswerAccordion()
+                    .within(() => {
+                        autoScoredSpecifyCorrectAnswerSection.steps.verifySpecifyCorrectAnswerErrorIconNotExists();
+                    });
+            } else {
+                autoScoredSpecifyCorrectAnswerSection.alternativeAnswerAccordion()
+                    .within(() => {
+                        autoScoredSpecifyCorrectAnswerSection.steps.verifySpecifyCorrectAnswerErrorIconNotExists();
+                    });
+            };
+        });
     }
 }
 

package/cypress/pages/chartsLinePage.js

@@ -372,7 +372,7 @@ const tests = {
 
         it('When user hovers away from the point, then point tooltip should be not be displayed', () => {
             utilities.hoverAwayFromElement();
-            utilities.verifyElementVisibilityState(chartsLinePage.barAndPointTooltipWrapper(), 'hidden');
+            utilities.verifyElementVisibilityState(chartsLinePage.barAndPointTooltipWrapper(), 'notExist');
         });
 
         it('CSS of point tooltip', { tags: 'css' }, () => {

package/cypress/pages/components/autoScoredStudentViewSettings.js

@@ -7,6 +7,7 @@ const selectors = {
     allowStudentToCheckAnswerLabel: () => cy.get('[data-ngie-testid="allow-student-to-check-answer-checkbox"] .MuiFormControlLabel-label'),
     //Note: update after https://redmine.zeuslearning.com/issues/565666 gets resolved
     allowStudentToCheckAnswerCheckbox: () => cy.get('[data-ngie-testid="allow-student-to-check-answer-checkbox"] input'),
+    allowStudentToCheckAnswerWrapper: () => cy.get('[data-ngie-testid="allow-student-to-check-answer-checkbox"]'),
     maximumCheckAnswerAttemptsDropdownLabel: () => cy.get('#Maximum-check-answer-attempts-dropdown-label'),
     maximumCheckAnswerAttemptsDropdown: () => cy.get('#Maximum-check-answer-attempts-select'),
     maximumCheckAnswerAttemptsDropdownListOptions: (dataValue = null) => {
@@ -72,6 +73,13 @@ const steps = {
 }
 
 const tests = {
+    verifyAllowStudentsToCheckAnswerNotExist: () => {
+        it('\'Allow student to check answer\' label and checkbox should not be displayed', () => {
+            utilities.verifyElementVisibilityState(autoScoredStudentViewSettings.allowStudentToCheckAnswerWrapper(), 'notExist');
+            utilities.verifyElementVisibilityState(autoScoredStudentViewSettings.maximumCheckAnswerAttemptsDropdownLabel(), 'notExist');
+        });
+    },
+
     verifyAllowStudentsToCheckAnswerLabelAndCheckboxCSS: () => {
         it('\'Allow student to check answer\' label and checkbox should be displayed and it should be unchecked by default', () => {
             utilities.verifyInnerText(autoScoredStudentViewSettings.allowStudentToCheckAnswerLabel(), 'Allow student to check answer');

package/cypress/pages/components/colorPopupComponent.js

@@ -312,14 +312,20 @@ const tests = {
             utilities.verifyCSS(colorPopupComponent.okButton(), {
                 'color': css.color.primaryBtn,
                 'font-size': css.fontSize.default,
-                'font-weight': css.fontWeight.regular,
-                'background-color': css.color.primaryBtnBg
+                'font-weight': css.fontWeight.semibold,
+            });
+            utilities.verifyCSS(colorPopupComponent.okButton().parents('button'), {
+                'background-color': css.color.primaryBtnBg,
+                'border': `1px solid ${css.color.primaryBtnBorder}`
             });
             utilities.verifyCSS(colorPopupComponent.cancelButton(), {
                 'color': css.color.secondaryBtn,
                 'font-size': css.fontSize.default,
                 'font-weight': css.fontWeight.semibold,
-                'background-color': css.color.transparent
+            });
+            utilities.verifyCSS(colorPopupComponent.cancelButton().parents('button'), {
+                'background-color': css.color.transparent,
+                'border': `1px solid ${css.color.secondaryBtnBorder}`
             });
         });
 

package/cypress/pages/components/draggableOptionContainer.js

@@ -20,7 +20,7 @@ const selectors = {
     draggableOptionText: () => cy.get('.icon-container-wrapper [class*="DraggableItemsstyle__QuestionTextWrapper"]:visible'),
     optionContainerItemListPreviewTab: () => cy.get('[class*="question-preview-wrapper"] .item-list'),
     optionContainerItemListSpecifyCorrectAnswerSection: () => cy.get('.item-list'),
-    draggableOptionDragIcon: () => cy.get('.drag-icon-button')
+    draggableOptionDragIcon: () => cy.get('.drag-indicator-icon')
 }
 
 const steps = {