itemengine-cypress-automation 1.0.204-graphQLUpdate-b0c0036.0 → 1.0.204

package/cypress/pages/chartsDotPlotPage.js

@@ -15,19 +15,18 @@ const selectors = {
     ...studentViewSettingsLabelComponent,
     ...autoScoredScoringPreviewTab,
     ...autoScoredSpecifyCorrectAnswerSection,
+    ...layoutSectionComponent,
     ...selectQuestionResourceToolPage,
     ...dialogBoxBase,
 
     dotPlotToggleButton: () => cy.get('[data-ngie-testid="dot-plot-toggle-button"]'),
-    minInputFieldSelectChartType: () => cy.get('input[aria-label="Min"]'),
-    maxInputFieldSelectChartType: () => cy.get('input[aria-label="Max"]'),
     dotColumnSelectChartType: () => cy.get('.ngie-dot-plot-chart .ngie-chart-point'),
     lockUnlockButtonSelectChartType: () => cy.get('.ngie-dot-plot-chart .lock-reset-icon-wrapper button'),
     dotColumnLockIcon: () => cy.get('[class*="LockIconWrapper"]'),
     tooltipWrapperSelectChartType: () => cy.get('.ngie-dot-plot-chart .charts-tooltip-wrapper'),
     addButtonSelectChartType: () => cy.get('.ngie-dot-plot-chart .charts-tooltip-wrapper [aria-label*="plus"]'),
     minusButtonSelectChartType: () => cy.get('.ngie-dot-plot-chart .charts-tooltip-wrapper [aria-label*="minus"]'),
-    dotIconSelectChartType: () => cy.get('.ngie-dot-plot-chart .dot-icon'),
+    dotIconSelectChartType: () => cy.get('.dot-icon'),
     controlOptionsWrapperSelectChartType: () => cy.get('.ngie-dot-plot-chart .charts-toolbar-wrapper'),
     controlOptionsSelectChartType: (toolOptionAriaLabel = null) => {
         if (toolOptionAriaLabel) {
@@ -38,6 +37,16 @@ const selectors = {
     },
     labelsNumberLineAxisSelectChartType: () => cy.get('.ngie-dot-plot-chart .label-wrapper [class*="DotPlotChartstyles__Label"]'),
     numberLineAxisSelectChartType: () => cy.get('.ngie-dot-plot-chart .number-line-wrapper'),
+    dotTypeLabel: () => cy.get('[class*="DotTypeWrapper"] [class*="ChartOptionsstyles__LabelText"]'),
+    dotLabel: () => cy.get('[class*="DotTypeWrapper"] .title-casing').eq(0),
+    dotRadioButton: () => cy.get('[class*="DotTypeWrapper"] input').eq(0),
+    xMarkLabel: () => cy.get('[class*="DotTypeWrapper"] .title-casing').eq(1),
+    xMarkRadioButton: () => cy.get('[class*="DotTypeWrapper"] input').eq(1),
+    labelOptionsLabel: () => cy.get('[class*="LabelOptionsWrapper"] .chart-option-label'),
+    allowStudentsToEditLabel: () => cy.get('[class*="LabelOptionsWrapper"] .additional-settings-label'),
+    xAxisLabelSelectChartType: () => cy.get('[class*="LabelOptionsWrapper"] .MuiFormControlLabel-label'),
+    xAxisCheckBox: () => cy.get('[class*="LabelOptionsWrapper"] input'),
+
     //Specify correct answer
     dotColumnSpecifyCorrectAnswer: () => cy.get('.ngie-accordion-detail .ngie-chart-point'),
     addButtonSpecifyCorrectAnswer: () => cy.get('.ngie-accordion-detail .charts-tooltip-wrapper [aria-label*="plus"]'),
@@ -60,6 +69,7 @@ const selectors = {
     dotColumnLockIconSpecifyCorrectAnswer: () => cy.get('[class*="LockIconWrapper"]'),
     dotPlotChartSpecifyCorrectAnswer: () => cy.get('.ngie-accordion-detail [class*="DotPlotChartstyles__ChartWrapper"]'),
 
+    //scoring
     toleranceThresholdLabel: () => cy.get('[class*="AllocatedPointsstyles__PointsWrapper"] .points-label'),
     toleranceThresholdInputField: () => cy.get('[class*="AllocatedPointsstyles__PointsWrapper"] input'),
 
@@ -131,46 +141,6 @@ const steps = {
             .click();
     },
 
-    /**
-    * Enters text into the minimum input field
-    * @param {string} value - The value to be entered into the input field.
-    */
-    enterTextInMinInputField: (value) => {
-        chartsDotPlotPage.minInputFieldSelectChartType()
-            .clear()
-            .type(value)
-            .blur();
-    },
-
-    /**
-     * Verifies text into the minimum input field.
-     * @param {string} value - The value to be verified into the input field.
-     */
-    verifyTextInMinInputField: (value) => {
-        chartsDotPlotPage.minInputFieldSelectChartType()
-            .should('have.value', value)
-    },
-
-    /**
-     * Enters text into the max input field.
-     * @param {string} value - The value to be entered into the input field.
-     */
-    enterTextInMaxInputField: (value) => {
-        chartsDotPlotPage.maxInputFieldSelectChartType()
-            .clear()
-            .type(value)
-            .blur();
-    },
-
-    /**
-      * Verifies text into the max input field.
-      * @param {string} value - The value to be verified into the input field.
-      */
-    verifyTextInMaxInputField: (value) => {
-        chartsDotPlotPage.maxInputFieldSelectChartType()
-            .should('have.value', value)
-    },
-
     /**
      * Selects a dot column in the chart type selection section based on the given point, minimum, and interval.
      * @param {object} options - The options for selecting the dot column.
@@ -312,8 +282,276 @@ const steps = {
             });
     },
 
-    //specify correct answer
+    /**
+     * Verifies the labels on the number line axis
+     * @param {number} min - The minimum value.
+     * @param {number} max - The maximum value.
+     * @param {number} annotateEvery - value of annotate every
+     */
+    verifyLabelsOnNumberLineAxisSelectChartType: (min, max, annotateEvery) => {
+        let expectedLabelsIndex = [];
+        let indexForArray = 0;
+        chartsDotPlotPage.labelsNumberLineAxisSelectChartType()
+            .each((value, index) => {
+                if (index % annotateEvery === 0) {
+                    expectedLabelsIndex.push(index.toString());
+                }
+            })
+            .then(() => {
+                cy.log(expectedLabelsIndex)
+                for (var i = min; i < max; i++) {
+                    chartsDotPlotPage.labelsNumberLineAxisSelectChartType()
+                        .eq(expectedLabelsIndex[indexForArray])
+                        .should('have.text', i)
+                    indexForArray += 1;
+                }
+            });
+    },
+
+    /**
+    * Verifies the display numbers orientation.
+    * @param {('Below' | 'Above')} numberOrientation - The orientation of the numbers ('Below' or 'Above').
+    * @throws {Error} Thrown if the number line orientation is invalid.
+    */
+    verifyDisplayNumbersOrientationOnChartSelectChartType: (numberOrientation) => {
+        let value;
+        switch (numberOrientation) {
+            case 'Below':
+                value = '-32px'
+                break;
+            case 'Above':
+                value = '-8px'
+                break;
+            default:
+                throw new Error('Invalid Number orientation');
+        }
+        chartsDotPlotPage.labelsNumberLineAxisSelectChartType()
+            .eq(0)
+            .should('have.css', 'margin-top', value);
+    },
+
+    /**
+     * Verifies the minimum value on the number line axis.
+     * @param {string} min - The expected minimum value.
+     */
+    verifyMinOnNumberLineAxisSelectChartType: (min) => {
+        chartsDotPlotPage.labelsNumberLineAxisSelectChartType()
+            .eq(0)
+            .should('have.text', min);
+    },
+
+    /**
+     * Verifies the maximum value on the number line axis.
+     * @param {string} max - The expected maximum value.
+     */
+    verifyMaxOnNumberLineAxisSelectChartType: (max) => {
+        chartsDotPlotPage.labelsNumberLineAxisSelectChartType()
+            .eq(-1)
+            .should('have.text', max);
+    },
+
+    /**
+    * Verifies the label on the number line axis.
+    * @param {Array} values - An array of objects containing the value and index of each label.
+    */
+    verifyLabelOnNumberLineAxisSelectChartType: (values) => {
+        values.forEach(({ value, index }) => {
+            chartsDotPlotPage.labelsNumberLineAxisSelectChartType()
+                .eq(index)
+                .then(($el) => {
+                    const innerText = $el[0].innerText;
+                    expect(innerText.trim()).to.equal(value.toString());
+                });
+        });
+    },
+
+    selectDotRadioButton: () => {
+        chartsDotPlotPage.dotRadioButton()
+            .click()
+            .should('be.checked');
+    },
+
+    selectXMarkRadioButton: () => {
+        chartsDotPlotPage.xMarkRadioButton()
+            .click()
+            .should('be.checked');
+    },
+
+    verifyDotRadioButtonSelected: () => {
+        chartsDotPlotPage.dotRadioButton()
+            .should('be.checked');
+    },
+
+    verifyXMarkRadioButtonSelected: () => {
+        chartsDotPlotPage.xMarkRadioButton()
+            .should('be.checked');
+    },
+
+    /**
+     * Verifies the dot type.
+     * @param {('Dot'| 'XMark')} type - Dot type.
+     * @param {object} options - Options for calculation of index.
+     * @param {number} options.point - The point value.
+     * @param {number} options.min - The minimum value.
+     * @param {number} options.interval - The interval value.
+     * @throws {Error} Throws an error if the provided type is invalid.
+     */
+    verifyDotTypeSelectChartType: (type, { point, min, interval }) => {
+        const index = Math.round((point - min) / interval);
+        switch (type) {
+            case 'Dot':
+                chartsDotPlotPage.dotColumnSelectChartType()
+                    .eq(index)
+                    .find('.dot-icon')
+                    .should('exist');
+                break;
+            case 'XMark':
+                chartsDotPlotPage.dotColumnSelectChartType()
+                    .eq(index)
+                    .find('[data-name="Clear all"]')
+                    .should('exist');
+                break;
+            default:
+                throw new Error('Invalid dot type');
+        }
+    },
+
+    /**
+     * 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.
+     */
+    verifyDivisionsOnNumberLineAxisSelectChartType: ({ min, max, interval }) => {
+        const expectedDivisions = Math.round((max - min) / interval);
+        chartsDotPlotPage.numberLineAxisSelectChartType()
+            .find('.number-line')
+            .its('length')
+            .then((len) => {
+                expect(len).to.equal(expectedDivisions);
+            });
+    },
+
+    checkXAxisCheckbox: () => {
+        chartsDotPlotPage.xAxisCheckBox()
+            .click()
+            .should('be.checked');
+    },
+
+    uncheckXAxisCheckbox: () => {
+        chartsDotPlotPage.xAxisCheckBox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    verifyXAxisCheckboxChecked: () => {
+        chartsDotPlotPage.xAxisCheckBox()
+            .should('be.checked');
+    },
+
+    /**
+      * 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.
+      */
+    verifyLockedDotColumnSelectChartType: ({ point, min, interval }) => {
+        const index = Math.round((point - min) / interval);
+        utilities.getNthElement(chartsDotPlotPage.dotColumnSelectChartType(), index)
+            .within(() => {
+                utilities.verifyElementVisibilityState(chartsDotPlotPage.dotColumnLockIcon(), 'visible');
+            });
+        utilities.getNthElement(chartsDotPlotPage.dotColumnSelectChartType(), index)
+            .should('have.css', 'background-color', css.color.lockedDotColumnBg);
+    },
+
+    /**
+      * Adds dots using keyboard navigation 
+      * @param {number} numberOfDots - The number of dots to subtract.
+      * @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.
+      */
+    increaseDotInDotColumnUsingKeyboardSelectChartType: (numberOfDots, { point, min, interval }) => {
+        const index = Math.round((point - min) / interval);
+        steps.selectDotColumnInSelectChartTypeSection({ point, min, interval });
+        for (let i = 0; i < numberOfDots; i++) {
+            chartsDotPlotPage.dotColumnSelectChartType()
+                .eq(index)
+                .type('{upArrow}');
+        }
+    },
+    /**
+      * removes dots using keyboard navigation 
+      * @param {number} numberOfDots - The number of dots to subtract.
+      * @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.
+      */
+    decreaseDotInDotColumnUsingKeyboardSelectChartType: (numberOfDots, { point, min, interval }) => {
+        const index = Math.round((point - min) / interval);
+        steps.selectDotColumnInSelectChartTypeSection({ point, min, interval });
+        for (let i = 0; i < numberOfDots; i++) {
+            chartsDotPlotPage.dotColumnSelectChartType()
+                .eq(index)
+                .type('{downArrow}');
+        }
+    },
+
+    /**
+     * @description verifies ock unlock icon
+     * @param {('Locked'|'Unlocked')} action 
+     */
+    verifyLockUnlockButtonIcon: (action) => {
+        if (action === 'Locked') {
+            chartsDotPlotPage.lockUnlockButtonSelectChartType()
+                .find('[id="Lock"]')
+                .should('exist');
+        }
+        else if (action === 'Unlocked') {
+            chartsDotPlotPage.lockUnlockButtonSelectChartType()
+                .find('[id="Unlock"]')
+                .should('exist');
+        } else {
+            cy.log('Incorrect string')
+        }
+    },
+
+    /**
+      * @description Unlock the bar in select chart type section
+      * @param {number} index Index of the bar to be locked 
+      */
+    unlockDotColumn: ({ point, min, interval }) => {
+        const index = Math.round((point - min) / interval);
+        steps.selectDotColumnInSelectChartTypeSection({ point, min, interval });
+        chartsDotPlotPage.lockUnlockButtonSelectChartType()
+            .click();
+        chartsDotPlotPage.lockUnlockButtonSelectChartType()
+            .should('have.attr', 'aria-label', 'unlocked bar');
+        steps.unselectDotColumnInSelectChartTypeSection({ point, min, interval });
+        utilities.getNthElement(chartsDotPlotPage.dotColumnSelectChartType(), index)
+            .within(() => {
+                utilities.verifyElementVisibilityState(chartsDotPlotPage.dotColumnLockIcon(), 'notExist');
+            });
+    },
+
+      /**
+     * Verify the bar is unlocked 
+     * @param {number} index index of the bar
+     */
+      verifyDotColumnIsUnlockedInSelectChartType: ({ point, min, interval }) => {
+        const index = Math.round((point - min) / interval);
+        utilities.getNthElement(chartsDotPlotPage.dotColumnSelectChartType(), index)
+            .within(() => {
+                utilities.verifyElementVisibilityState(chartsDotPlotPage.dotColumnLockIcon(), 'notExist');
+            });
+    },
 
+    //specify correct answer
     /**
      * selects a dot column in the chart type selection section based on the given point, minimum, and interval.
      * @param {object} options - The options for selecting the dot column.
@@ -325,10 +563,7 @@ const steps = {
         const index = Math.round((point - min) / interval);
         chartsDotPlotPage.dotColumnSpecifyCorrectAnswer()
             .eq(index)
-            .click()
-            .should('have.class', 'selected');
-        chartsDotPlotPage.tooltipWrapperSpecifyCorrectAnswer()
-            .should('exist');
+            .click();
     },
 
     /**
@@ -529,6 +764,144 @@ const steps = {
         utilities.verifyInnerText(chartsDotPlotPage.partialEqualWeightsPointsPerResponseScore(), points);
     },
 
+    /**
+     * Verifies the display numbers orientation.
+     * @param {('Below' | 'Above')} numberOrientation - The orientation of the numbers ('Below' or 'Above').
+     * @throws {Error} Thrown if the number line orientation is invalid.
+     */
+    verifyDisplayNumbersOrientationOnChartSpecifyCorrectAnswer: (numberOrientation) => {
+        let value;
+        switch (numberOrientation) {
+            case 'Below':
+                value = '-32px'
+                break;
+            case 'Above':
+                value = '-8px'
+                break;
+            default:
+                throw new Error('Invalid Number orientation');
+        }
+        chartsDotPlotPage.labelsNumberLineAxisSpecifyCorrectAnswer()
+            .eq(0)
+            .should('have.css', 'margin-top', value);
+    },
+
+    /**
+     * Verifies the minimum value on the number line axis.
+     * @param {string} min - The expected minimum value.
+     */
+    verifyMinOnNumberLineAxisSpecifyCorrectAnswer: (min) => {
+        chartsDotPlotPage.labelsNumberLineAxisSpecifyCorrectAnswer()
+            .eq(0)
+            .should('have.text', min);
+    },
+
+    /**
+     * Verifies the maximum value on the number line axis.
+     * @param {string} max - The expected maximum value.
+     */
+    verifyMaxOnNumberLineAxisSpecifyCorrectAnswer: (max) => {
+        chartsDotPlotPage.labelsNumberLineAxisSpecifyCorrectAnswer()
+            .eq(-1)
+            .should('have.text', max);
+    },
+
+    /**
+    * Verifies the label on the number line axis.
+    * @param {Array} values - An array of objects containing the value and index of each label.
+    */
+    verifyLabelOnNumberLineAxisSpecifyCorrectAnswer: (values) => {
+        values.forEach(({ value, index }) => {
+            chartsDotPlotPage.labelsNumberLineAxisSpecifyCorrectAnswer()
+                .eq(index)
+                .then(($el) => {
+                    const innerText = $el[0].innerText;
+                    expect(innerText.trim()).to.equal(value.toString());
+                });
+        });
+    },
+
+    /**
+     * Verifies the dot type.
+     * @param {('Dot'| 'XMark')} type - Dot type.
+     * @param {object} options - Options for calculation of index.
+     * @param {number} options.point - The point value.
+     * @param {number} options.min - The minimum value.
+     * @param {number} options.interval - The interval value.
+     * @throws {Error} Throws an error if the provided type is invalid.
+     */
+    verifyDotTypeSpecifyCorrectAnswer: (type, { point, min, interval }) => {
+        const index = Math.round((point - min) / interval);
+        switch (type) {
+            case 'Dot':
+                chartsDotPlotPage.dotColumnSpecifyCorrectAnswer()
+                    .eq(index)
+                    .find('.dot-icon')
+                    .should('exist');
+                break;
+            case 'XMark':
+                chartsDotPlotPage.dotColumnSpecifyCorrectAnswer()
+                    .eq(index)
+                    .find('[data-name="Clear all"]')
+                    .should('exist');
+                break;
+            default:
+                throw new Error('Invalid dot type');
+        }
+    },
+
+    /**
+     * Adds dots using keyboard navigation 
+     * @param {number} numberOfDots - The number of dots to subtract.
+     * @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.
+     */
+    increaseDotInDotColumnUsingKeyboardSpecifyCorrectAnswer: (numberOfDots, { point, min, interval }) => {
+        const index = Math.round((point - min) / interval);
+        steps.selectDotColumnInSpecifyCorrectAnswer({ point, min, interval });
+        for (let i = 0; i < numberOfDots; i++) {
+            chartsDotPlotPage.dotColumnSpecifyCorrectAnswer()
+                .eq(index)
+                .type('{upArrow}');
+        }
+    },
+    /**
+      * removes dots using keyboard navigation 
+      * @param {number} numberOfDots - The number of dots to remove.
+      * @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.
+      */
+    decreaseDotInDotColumnUsingKeyboardSpecifyCorrectAnswer: (numberOfDots, { point, min, interval }) => {
+        const index = Math.round((point - min) / interval);
+        steps.selectDotColumnInSpecifyCorrectAnswer({ point, min, interval });
+        for (let i = 0; i < numberOfDots; i++) {
+            chartsDotPlotPage.dotColumnSpecifyCorrectAnswer()
+                .eq(index)
+                .type('{downArrow}');
+        }
+    },
+
+    tooltipWrapperNotExistSpecifyCorrectAnswer: () => {
+        chartsDotPlotPage.tooltipWrapperSpecifyCorrectAnswer()
+            .should('not.exist');
+    },
+
+     /**
+     * Verify the bar is unlocked 
+     * @param {number} index index of the bar
+     */
+     verifyDotColumnIsUnlockedInSpecifyCorrectAnswer: ({ point, min, interval }) => {
+        const index = Math.round((point - min) / interval);
+        utilities.getNthElement(chartsDotPlotPage.dotColumnSpecifyCorrectAnswer(), index)
+            .within(() => {
+                utilities.verifyElementVisibilityState(chartsDotPlotPage.dotColumnLockIconSpecifyCorrectAnswer(), 'notExist');
+            });
+    },
+
     //preview tab
     /**
      * Unselects a dot column based on the given point, minimum, and interval.
@@ -545,9 +918,9 @@ const steps = {
     },
 
     /**
-  * Adds dots 
-  * @param {number} numberOfDots - The number of dots to add.
-  */
+     * Adds dots 
+     * @param {number} numberOfDots - The number of dots to add.
+     */
     increaseDotCountInDotColumnPreviewTab: (numberOfDots) => {
         for (let i = 0; i < numberOfDots; i++) {
             chartsDotPlotPage.addButtonPreviewTab()
@@ -901,6 +1274,7 @@ const steps = {
       */
     verifyLabelsOnNumberLineAxisPreviewTab: (min, max, annotateEvery) => {
         let expectedLabelsIndex = [];
+        let indexForArray = 0;
         chartsDotPlotPage.labelsNumberLineAxisPreviewTab()
             .each((value, index) => {
                 if (index % annotateEvery === 0) {
@@ -910,12 +1284,99 @@ const steps = {
             .then(() => {
                 for (var i = min; i < max; i++) {
                     chartsDotPlotPage.labelsNumberLineAxisPreviewTab()
-                        .eq(expectedLabelsIndex[i - 1])
-                        .should('have.text', i)
+                        .eq(expectedLabelsIndex[indexForArray])
+                        .should('have.text', i);
+                    indexForArray += 1;
                 }
             });
     },
 
+    /**
+     * Verifies the display numbers orientation on the preview tab.
+     * @param {('Below' | 'Above')} numberOrientation - The orientation of displayed numbers ('Below' or 'Above').
+     * @throws {Error} Throws an error if the provided number orientation is invalid.
+     */
+    verifyDisplayNumbersOrientationOnChartPreviewTab: (numberOrientation) => {
+        let value;
+        switch (numberOrientation) {
+            case 'Below':
+                value = '-32px'
+                break;
+            case 'Above':
+                value = '-8px'
+                break;
+            default:
+                throw new Error('Invalid Number orientation');
+        }
+        chartsDotPlotPage.labelsNumberLineAxisPreviewTab()
+            .eq(0)
+            .should('have.css', 'margin-top', value);
+    },
+
+    /**
+     * Verifies the minimum value on the number line axis.
+     * @param {string} min - The expected minimum value.
+     */
+    verifyMinOnNumberLineAxisPreviewTab: (min) => {
+        chartsDotPlotPage.labelsNumberLineAxisPreviewTab()
+            .eq(0)
+            .should('have.text', min);
+    },
+
+    /**
+     * Verifies the maximum value on the number line axis.
+     * @param {string} max - The expected maximum value.
+     */
+    verifyMaxOnNumberLineAxisPreviewTab: (max) => {
+        chartsDotPlotPage.labelsNumberLineAxisPreviewTab()
+            .eq(-1)
+            .should('have.text', max);
+    },
+
+    /**
+    * Verifies the label on the number line axis.
+    * @param {Array} values - An array of objects containing the value and index of each label.
+    */
+    verifyLabelOnNumberLineAxisPreviewTab: (values) => {
+        values.forEach(({ value, index }) => {
+            chartsDotPlotPage.labelsNumberLineAxisPreviewTab()
+                .eq(index)
+                .then(($el) => {
+                    const innerText = $el[0].innerText;
+                    expect(innerText).to.equal(value.toString());
+                });
+        });
+    },
+
+    /**
+     * Verifies the dot type.
+     * @param {('Dot'| 'XMark')} type - Dot type.
+     * @param {object} options - Options for calculation of index.
+     * @param {number} options.point - The point value.
+     * @param {number} options.min - The minimum value.
+     * @param {number} options.interval - The interval value.
+     * @throws {Error} Throws an error if the provided type is invalid.
+     */
+    verifyDotTypePreviewTab: (type, { point, min, interval }) => {
+        const index = Math.round((point - min) / interval);
+        switch (type) {
+            case 'Dot':
+                chartsDotPlotPage.dotColumnPreviewTab()
+                    .eq(index)
+                    .find('.dot-icon')
+                    .should('exist');
+                break;
+            case 'XMark':
+                chartsDotPlotPage.dotColumnPreviewTab()
+                    .eq(index)
+                    .find('[data-name="Clear all"]')
+                    .should('exist');
+                break;
+            default:
+                throw new Error('Invalid dot type');
+        }
+    },
+
     //correct answer section
     /**
     * @param {("correct" | "incorrect")} answerStatus - The status of the answer.
@@ -1154,20 +1615,88 @@ const tests = {
     ...autoScoredSpecifyCorrectAnswerSection.tests,
     ...chartsCommonComponent.tests,
 
+    /**
+     * Verifies the contents and functionality of the 'Specify correct answer' accordion for multiple selection questions.
+     * @param {{'Correct' | 'Alternative'}} accordionName - The name of the accordion to be used in the validation.
+     * @example - verifySpecifyCorrectAnswerAccordionContentsAndFunctionality('Correct');
+     */
+    verifySpecifyCorrectAnswerAccordionContentsAndFunctionality: (accordionName) => {
+        it('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();
+                    });
+            };
+        });
+    },
+
     verifyContentsOfSpecifyCorrectAnswerSection: () => {
         it('When user selects a scoring type then in the \'Correct\' accordion, all the contents should be displayed', () => {
-            chartsCommonComponent.steps.verifyGraphTitleInSpecifyCorrectAnswer('Five-day observation');
-            chartsCommonComponent.steps.verifyXAxisLabelInSpecifyCorrectAnswer('Days');
+            chartsCommonComponent.steps.verifyGraphTitleInSpecifyCorrectAnswer('Graph title');
+            chartsCommonComponent.steps.verifyXAxisLabelInSpecifyCorrectAnswer('Label');
             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');
-   */
+     * 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');