itemengine-cypress-automation 1.0.167-repoUpdate10April-1465c8c.0 → 1.0.169-uploadResponseMigration-83ab996.0

package/cypress/pages/numberLinePage.js

@@ -1,723 +0,0 @@
-import utilities from '../support/helpers/utilities';
-import { createQuestionBasePage, toolsAndControlsComponent, questionInstructionsComponent, resetPopupComponent, scoringSectionBaseEditTab, autoScoredScoringPreviewTab, autoScoredSpecifyCorrectAnswerSection, commonComponents, autoScoredScoringSectionMultiResponseType, toolSettingsComponent, additionalSettingsPanel, additionalSettingsAccessibilitySectionComponent, autoScoredStudentViewSettings, randomizeOptionsComponent, studentViewSettingsLabelComponent, defaultToolDropdown } from './components';
-const css = Cypress.env('css');
-
-const selectors = {
-    ...toolsAndControlsComponent,
-    ...questionInstructionsComponent,
-    ...resetPopupComponent,
-    ...additionalSettingsPanel,
-    ...autoScoredStudentViewSettings,
-    ...autoScoredScoringPreviewTab,
-    ...randomizeOptionsComponent,
-    ...commonComponents,
-    ...defaultToolDropdown,
-    ...autoScoredScoringSectionMultiResponseType,
-
-    //Specify correct answer
-    numberLineSpecifyCorrectAnswer: () => cy.get('.ngie-accordion .ngie-jxgbox svg'),
-    numberLineToolOptionSpecifyCorrectAnswer: (toolOptionAriaLabel = null) => {
-        if (toolOptionAriaLabel) {
-            return cy.get(`.graph-tools-wrapper .single-select-toggle-group-double button[aria-label*="${toolOptionAriaLabel}"]`).eq(0)
-        } else {
-            return cy.get('.graph-tools-wrapper .single-select-toggle-group-double button')
-        }
-    },
-    numberLineControlOptionSpecifyCorrectAnswer: (toolOptionAriaLabel = null) => {
-        if (toolOptionAriaLabel) {
-            return cy.get(`[class*="GraphingToolsstyles__ControlsWrapper"] button[aria-label*="${toolOptionAriaLabel}"]`)
-        } else {
-            return cy.get('[class*="GraphingToolsstyles__ControlsWrapper"] button')
-        }
-    },
-    numberLineTitleSpecifyCorrectAnswerSection: () => cy.get('.correct-answer-accordion [class*="LineGraphstyles__TitleText"]'),
-    plotNumberLineToggleButton: () => cy.get('[data-ngie-testid="plot-number-line-tab"]'),
-    partialEqualWeightsPointsPerResponseScore: () => cy.get('.alternate-points-points-per-value-span'),
-
-    //Preview Tab
-    numberLinePreviewTab: () => cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox svg').eq(0),
-    numberLinePointPreviewTab: () => cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(0).find('svg ellipse[tabindex="0"]'),
-    numberLineSegmentPreviewTab: () => cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(0).find('[stroke-linecap="butt"]'),
-    numberLineToolOptionPreviewTab: (toolOptionAriaLabel = null) => {
-        if (toolOptionAriaLabel) {
-            return cy.get(`[class*="question-preview-wrapper"] .graph-tools-wrapper .single-select-toggle-group-double button[aria-label*="${toolOptionAriaLabel}"]`).eq(0)
-        } else {
-            return cy.get('[class*="question-preview-wrapper"] .graph-tools-wrapper .single-select-toggle-group-double button')
-        }
-    },
-    numberLineControlOptionPreviewTab: (toolOptionAriaLabel = null) => {
-        if (toolOptionAriaLabel) {
-            return cy.get(`[class*="question-preview-wrapper"] [class*="ControlsWrapper"] button[aria-label*="${toolOptionAriaLabel}"]`)
-        } else {
-            return cy.get('[class*="question-preview-wrapper"] [class*="ControlsWrapper"] button')
-        }
-    },
-    numberLineTitlePreviewTab: () => cy.get('.edit-question-preview-wrapper [class*="LineGraphstyles__TitleText"]'),
-
-    //Correct answer section
-    correctAnswersLabel: () => cy.get('[class*="AnswerLabel"]'),
-    correctIcon: () => cy.get('[data-icon="CorrectAnswer"]'),
-    incorrectIcon: () => cy.get('[data-icon="Incorrect"]'),
-    numberLineCorrectAnswerSection: () => cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox svg:visible').eq(1),
-    numberLinePointCorrectAnswerSection: () => cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(1).find('svg ellipse[tabindex="0"]'),
-    correctIncorrectAnswerTextWrapper: () => cy.get('[class*="CorrectIncorrectWrapper"]'),
-    numberLineTitleCorrectAnswerSection: () => cy.get('[class*="LineGraphstyles__TitleText"]').last()
-}
-
-const steps = {
-    ...createQuestionBasePage.steps,
-    ...toolsAndControlsComponent.steps,
-    ...questionInstructionsComponent.steps,
-    ...resetPopupComponent.steps,
-    ...scoringSectionBaseEditTab.steps,
-    ...additionalSettingsPanel.steps,
-    ...autoScoredStudentViewSettings.steps,
-    ...autoScoredScoringPreviewTab.steps,
-    ...autoScoredSpecifyCorrectAnswerSection.steps,
-    ...commonComponents.steps,
-    ...autoScoredScoringSectionMultiResponseType.steps,
-    ...defaultToolDropdown.steps,
-
-    /**
-     * @description This function selects the tool option from graph
-     * @param {string} toolOption aria label of the tool option to be selected
-     */
-    selectNumberLineToolOptionSpecifyCorrectAnswer: (toolOption) => {
-        numberLinePage.numberLineToolOptionSpecifyCorrectAnswer(toolOption)
-            .click();
-    },
-
-    /**
-    * @description This function selects the control option from graph
-    * @param {string} controlOption aria label of the control option to be selected
-    */
-    selectNumberLineControlOptionSpecifyCorrectAnswerSection: (controlOption) => {
-        numberLinePage.numberLineControlOptionSpecifyCorrectAnswer(controlOption)
-            .click();
-    },
-
-    /**
-    * This function plots points on the number line on Edit tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].xRange - range of x coordinate
-    */
-    plotPointOnNumberLineSpecifyCorrectAnswer: (coordinates) => {
-        coordinates.forEach(({ x, xRange }) => {
-            numberLinePage.numberLineSpecifyCorrectAnswer()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const xPixel = originX + x * (graphWidth / xRange);
-                    numberLinePage.numberLineSpecifyCorrectAnswer()
-                        .click(xPixel, originY, { force: true });
-                });
-        });
-    },
-
-    /**
-    * This function verifies plotted points on the number line on Edit tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].xRange - range of x coordinate
-    */
-    verifyPointsPlottedOnNumberLineSpecifyCorrectAnswer: (coordinates) => {
-        coordinates.forEach(({ x, xRange }) => {
-            numberLinePage.numberLineSpecifyCorrectAnswer()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const xPixel = originX + x * (graphWidth / xRange);
-                    cy.get(`.ngie-accordion .ngie-jxgbox svg ellipse[cx*="${Math.floor(xPixel)}"][cy*="${Math.floor(originY)}"][tabindex="0"]`)
-                        .should('exist');
-                });
-        });
-    },
-
-    /**
-    * This verifies line segment on the number line on Edit tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x1 - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].x1Range - range of x coordinate
-    * @param {number} coordinates[].x2 - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].x2Range - range of x coordinate
-    */
-    verifyLineSegmentOnNumberLineSpecifyCorrectAnswer: (coordinates) => {
-        coordinates.forEach(({ x1, x1Range, x2, x2Range }) => {
-            numberLinePage.numberLineSpecifyCorrectAnswer()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const x1Pixel = originX + x1 * (graphWidth / x1Range);
-                    const x2Pixel = originX + x2 * (graphWidth / x2Range);
-                    cy.get(`.ngie-accordion .ngie-jxgbox svg [stroke-linecap="butt"][x1*="${Math.floor(x1Pixel)}"][y1*="${Math.floor(originY)}"][x2*="${Math.floor(x2Pixel)}"][y2*="${Math.floor(originY)}"]`)
-                        .should('be.visible');
-                });
-        });
-    },
-
-    /**
-    * This function verifies plotted points not exist on the number line on Edit tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].xRange - range of x coordinate
-    */
-    verifyPointsPlottedOnNumberLineNotExistSpecifyCorrectAnswer: (coordinates) => {
-        coordinates.forEach(({ x, xRange }) => {
-            numberLinePage.numberLineSpecifyCorrectAnswer()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const xPixel = originX + x * (graphWidth / xRange);
-                    cy.get(`.ngie-accordion .ngie-jxgbox svg ellipse[cx*="${Math.floor(xPixel)}"][cy*="${Math.floor(originY)}"][tabindex="0"]`)
-                        .should('not.exist');
-                });
-        });
-    },
-
-    verifyPointsPerResponseLabel: () => {
-        utilities.verifyInnerText(autoScoredScoringSectionMultiResponseType.pointsPerResponseLabel(), 'Points per response:\n-');
-        utilities.verifyElementVisibilityState(autoScoredScoringSectionMultiResponseType.pointsPerResponseLabel(), 'visible');
-    },
-
-    /**
-    * @param {number} optionIndex - The index of the option to verify the partial equal weights points per response score.
-    * @param {number} points - The expected points value to be verified.
-    * @description Verifies the partial equal weights points per response score for a specific option in the specify correct answer section for a multi-response type question.
-    */
-    verifyPartialEqualWeightsPointsPerResponseScore: (points) => {
-        utilities.verifyInnerText(numberLinePage.partialEqualWeightsPointsPerResponseScore(), `${points}`);
-    },
-
-    /**
-    * This function plots points on the number line on preview tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].xRange - range of x coordinate
-    */
-    plotPointOnNumberLinePreviewTab: (coordinates) => {
-        coordinates.forEach(({ x, xRange }) => {
-            numberLinePage.numberLinePreviewTab()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const xPixel = originX + x * (graphWidth / xRange);
-                    numberLinePage.numberLinePreviewTab()
-                        .click(xPixel, originY, { force: true });
-                });
-        });
-    },
-
-    /**
-    * This verifies plotted points on the number line on preview tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].xRange - range of x coordinate
-    */
-    verifyPointsPlottedOnNumberLinePreviewTab: (coordinates) => {
-        coordinates.forEach(({ x, xRange }) => {
-            numberLinePage.numberLinePreviewTab()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const xPixel = originX + x * (graphWidth / xRange);
-                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(0).find(`svg ellipse[cx*="${Math.floor(xPixel)}"][cy*="${Math.floor(originY)}"][tabindex="0"]`)
-                        .should('exist');
-                });
-        });
-    },
-
-    /**
-    * This function verifies points not exist on the number line on preview tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].xRange - range of x coordinate
-    */
-    verifyPointsNotExistOnNumberLinePreviewTab: (coordinates) => {
-        coordinates.forEach(({ x, xRange }) => {
-            numberLinePage.numberLinePreviewTab()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const xPixel = originX + x * (graphWidth / xRange);
-                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(0).find(`svg ellipse[cx*="${Math.floor(xPixel)}"][cy*="${Math.floor(originY)}"][tabindex="0"]`)
-                        .should('not.exist');
-                });
-        });
-    },
-
-    /**
-    * This function verifies correct points on the number line on Edit tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].xRange - range of x coordinate
-    */
-    verifyCorrectPointsOnNumberLinePreviewTab: (coordinates) => {
-        coordinates.forEach(({ x, xRange }) => {
-            numberLinePage.numberLinePreviewTab()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const xPixel = originX + x * (graphWidth / xRange);
-                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(0).find(`svg ellipse[cx*="${Math.floor(xPixel)}"][cy*="${Math.floor(originY)}"][tabindex="0"]`)
-                        .should('have.css', 'stroke', css.color.correctAnswer);
-                });
-        });
-    },
-
-    /**
-    * This function verifies incorrect points on the number line on preview tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].xRange - range of x coordinate
-    */
-    verifyIncorrectPointsOnNumberLinePreviewTab: (coordinates) => {
-        coordinates.forEach(({ x, xRange }) => {
-            numberLinePage.numberLinePreviewTab()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const xPixel = originX + x * (graphWidth / xRange);
-                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(0).find(`svg ellipse[cx*="${Math.floor(xPixel)}"][cy*="${Math.floor(originY)}"][tabindex="0"]`)
-                        .should('have.css', 'stroke', css.color.incorrectAnswer);
-                });
-        });
-    },
-
-    /**
-    * This function plots points on the number line on Edit tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x1 - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].x1Range - range of x coordinate
-    * @param {number} coordinates[].x2 - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].x2Range - range of x coordinate
-    */
-    verifyLineSegmentOnNumberLinePreviewTab: (coordinates) => {
-        coordinates.forEach(({ x1, x1Range, x2, x2Range }) => {
-            numberLinePage.numberLinePreviewTab()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const x1Pixel = originX + x1 * (graphWidth / x1Range);
-                    const x2Pixel = originX + x2 * (graphWidth / x2Range);
-                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(0).find(`[stroke-linecap="butt"][x1*="${Math.floor(x1Pixel)}"][y1*="${Math.floor(originY)}"][x2*="${Math.floor(x2Pixel)}"][y2*="${Math.floor(originY)}"]`)
-                        .should('be.visible');
-                });
-        });
-    },
-
-
-    /**
-    * This function verifies correct points on the number line on Edit tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x1 - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].x1Range - range of x coordinate
-    * @param {number} coordinates[].x2 - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].x2Range - range of x coordinate
-    */
-    verifyCorrectLineSegmentOnNumberLinePreviewTab: (coordinates) => {
-        coordinates.forEach(({ x1, x1Range, x2, x2Range }) => {
-            numberLinePage.numberLinePreviewTab()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const x1Pixel = originX + x1 * (graphWidth / x1Range);
-                    const x2Pixel = originX + x2 * (graphWidth / x2Range);
-                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(0).find(`[stroke-linecap="butt"][x1*="${Math.floor(x1Pixel)}"][y1*="${Math.floor(originY)}"][x2*="${Math.floor(x2Pixel)}"][y2*="${Math.floor(originY)}"]`)
-                        .should('have.css', 'stroke', css.color.correctAnswer);
-                });
-        });
-    },
-
-    /**
-    * This function verifies incorrect points on the number line on Edit tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x1 - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].x1Range - range of x coordinate
-    * @param {number} coordinates[].x2 - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].x2Range - range of x coordinate
-    */
-    verifyIncorrectLineSegmentOnNumberLinePreviewTab: (coordinates) => {
-        coordinates.forEach(({ x1, x1Range, x2, x2Range }) => {
-            numberLinePage.numberLinePreviewTab()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const x1Pixel = originX + x1 * (graphWidth / x1Range);
-                    const x2Pixel = originX + x2 * (graphWidth / x2Range);
-                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(0).find(`[stroke-linecap="butt"][x1*="${Math.floor(x1Pixel)}"][y1*="${Math.floor(originY)}"][x2*="${Math.floor(x2Pixel)}"][y2*="${Math.floor(originY)}"]`)
-                        .should('have.css', 'stroke', css.color.incorrectAnswer);
-                });
-        });
-    },
-
-    /**
-    * This function verifies points does not exist on the number line on Edit tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x1 - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].x1Range - range of x coordinate
-    * @param {number} coordinates[].x2 - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].x2Range - range of x coordinate
-    */
-    verifyLineSegmentOnNumberLineNotExistPreviewTab: (coordinates) => {
-        coordinates.forEach(({ x1, x1Range, x2, x2Range }) => {
-            numberLinePage.numberLinePreviewTab()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const x1Pixel = originX + x1 * (graphWidth / x1Range);
-                    const x2Pixel = originX + x2 * (graphWidth / x2Range);
-                    cy.get(`[class*="PreviewTabstyles__ContentWrapper"] .ngie-jxgbox svg [stroke-linecap="butt"][x1*="${Math.floor(x1Pixel)}"][y1*="${Math.floor(originY)}"][x2*="${Math.floor(x2Pixel)}"][y2*="${Math.floor(originY)}"]`)
-                        .should('not.exist');
-                });
-        });
-    },
-
-    /**
-     * @description This function selects the tool option from graph
-     * @param {string} toolOption aria label of the tool option to be selected
-     */
-    selectNumberLineToolOptionPreviewTab: (toolOption) => {
-        numberLinePage.numberLineToolOptionPreviewTab(toolOption)
-            .click();
-    },
-
-    /**
-    * @description This function verifies the tool option is in selected state
-    * @param {string} toolOption aria label of the tool option to be verified selected
-    */
-    verifyToolOptionSelectedPreviewTab: (toolOptionAriaLabel) => {
-        numberLinePage.numberLineToolOptionPreviewTab(toolOptionAriaLabel)
-            .should('have.class', 'single-select-toggle-button-selected');
-    },
-
-    /**
-    * @description This function verifies the tool option is not in selected state
-    * @param {string} toolOption aria label of the tool option to be verified not selected
-    */
-    verifyToolOptionNotSelectedPreviewTab: (toolOptionAriaLabelArray) => {
-        toolOptionAriaLabelArray.forEach((toolOptionAriaLabel) => {
-            numberLinePage.numberLineToolOptionPreviewTab(toolOptionAriaLabel)
-                .should('not.have.class', 'single-select-toggle-button-selected');
-        });
-    },
-
-    /**
-    * @description This function selects the control option from graph
-    * @param {string} controlOption aria label of the control option to be selected
-    */
-    selectNumberLineControlOptionPreviewTab: (controlOption) => {
-        numberLinePage.numberLineControlOptionPreviewTab(controlOption)
-            .click();
-    },
-
-    /**
-    * @description This function verifies the tool option is in selected state
-    * @param {string} toolOption aria label of the tool option to be verified selected
-    */
-    verifyToolOptionSelectedSpecifyCorrectAnswerSection: (toolOptionAriaLabel) => {
-        numberLinePage.numberLineToolOptionSpecifyCorrectAnswer(toolOptionAriaLabel)
-            .eq(0)
-            .should('have.class', 'single-select-toggle-button-selected');
-    },
-
-    /**
-     * @description This function verifies the tool option is not in selected state
-     * @param {string} toolOption aria label of the tool option to be verified not selected
-     */
-    verifyToolOptionNotSelectedSpecifyCorrectAnswerSection: (toolOptionAriaLabelArray) => {
-        toolOptionAriaLabelArray.forEach((toolOptionAriaLabel) => {
-            numberLinePage.numberLineToolOptionSpecifyCorrectAnswer(toolOptionAriaLabel)
-                .should('not.have.class', 'single-select-toggle-button-selected');
-        });
-    },
-    //Correct answer section 
-
-    /**
-    * This function verifies plotted points on the number line on c tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].xRange - range of x coordinate
-    */
-    verifyPointsPlottedOnNumberLineCorrectAnswerSection: (coordinates) => {
-        coordinates.forEach(({ x, xRange }) => {
-            numberLinePage.numberLineCorrectAnswerSection()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const xPixel = originX + x * (graphWidth / xRange);
-                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(1).find(`svg ellipse[cx*="${Math.floor(xPixel)}"][cy*="${Math.floor(originY)}"][pointer-events="visiblePainted"]`)
-                        .should('exist');
-                });
-        });
-    },
-
-    /**
-    * This function verifies correct plotted points on the number line on c tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].xRange - range of x coordinate
-    */
-    verifyCorrectPointsOnNumberLineCorrectAnswerSection: (coordinates) => {
-        coordinates.forEach(({ x, xRange }) => {
-            numberLinePage.numberLineCorrectAnswerSection()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const xPixel = originX + x * (graphWidth / xRange);
-                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(1).find(`svg ellipse[cx*="${Math.floor(xPixel)}"][cy*="${Math.floor(originY)}"][pointer-events="visiblePainted"]`)
-                        .should('have.css', 'stroke', css.color.correctAnswer);
-                });
-        });
-    },
-
-
-    /**
-    * This function verifies incorrect plotted points on the number line on c tab
-    * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-    * @param {number} coordinates[].x - x coordinate to be plotted on the graph
-    * @param {number} coordinates[].xRange - range of x coordinate
-    */
-    verifyIncorrectPointsOnNumberLineCorrectAnswerSection: (coordinates) => {
-        coordinates.forEach(({ x, xRange }) => {
-            numberLinePage.numberLineCorrectAnswerSection()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const xPixel = originX + x * (graphWidth / xRange);
-                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(1).find(`svg ellipse[cx*="${Math.floor(xPixel)}"][cy*="${Math.floor(originY)}"][pointer-events="visiblePainted"]`)
-                        .should('have.css', 'stroke', css.color.incorrectAnswer);
-                });
-        });
-    },
-
-    /**
-   * This function verifies line plotted points on the number line on c tab
-   * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-   * @param {number} coordinates[].x1 - x coordinate to be plotted on the graph
-   * @param {number} coordinates[].x1Range - range of x coordinate
-   * @param {number} coordinates[].x2 - x coordinate to be plotted on the graph
-   * @param {number} coordinates[].x2Range - range of x coordinate
-   */
-    verifyLineSegmentOnNumberLineCorrectAnswerSection: (coordinates) => {
-        coordinates.forEach(({ x1, x1Range, x2, x2Range }) => {
-            numberLinePage.numberLineCorrectAnswerSection()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const x1Pixel = originX + x1 * (graphWidth / x1Range);
-                    const x2Pixel = originX + x2 * (graphWidth / x2Range);
-                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(1).find(`[stroke-linecap="butt"][x1*="${Math.floor(x1Pixel)}"][y1*="${Math.floor(originY)}"][x2*="${Math.floor(x2Pixel)}"][y2*="${Math.floor(originY)}"]`)
-                        .should('be.visible');
-                });
-        });
-    },
-
-    /**
-   * This function verifies correct plotted points on the number line on c tab
-   * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-   * @param {number} coordinates[].x1 - x coordinate to be plotted on the graph
-   * @param {number} coordinates[].x1Range - range of x coordinate
-   * @param {number} coordinates[].x2 - x coordinate to be plotted on the graph
-   * @param {number} coordinates[].x2Range - range of x coordinate
-   */
-    verifyCorrectLineSegmentOnNumberLineCorrectAnswerSection: (coordinates) => {
-        coordinates.forEach(({ x1, x1Range, x2, x2Range }) => {
-            numberLinePage.numberLineCorrectAnswerSection()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const x1Pixel = originX + x1 * (graphWidth / x1Range);
-                    const x2Pixel = originX + x2 * (graphWidth / x2Range);
-                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(1).find(`[stroke-linecap="butt"][x1*="${Math.floor(x1Pixel)}"][y1*="${Math.floor(originY)}"][x2*="${Math.floor(x2Pixel)}"][y2*="${Math.floor(originY)}"]`)
-                        .should('have.css', 'stroke', css.color.correctAnswer);
-                });
-        });
-    },
-
-    /**
-   * This function verifies incorrect plotted points on the number line on c tab
-   * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-   * @param {number} coordinates[].x1 - x coordinate to be plotted on the graph
-   * @param {number} coordinates[].x1Range - range of x coordinate
-   * @param {number} coordinates[].x2 - x coordinate to be plotted on the graph
-   * @param {number} coordinates[].x2Range - range of x coordinate
-   */
-    verifyIncorrectLineSegmentOnNumberLineCorrectAnswerSection: (coordinates) => {
-        coordinates.forEach(({ x1, x1Range, x2, x2Range }) => {
-            numberLinePage.numberLineCorrectAnswerSection()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const x1Pixel = originX + x1 * (graphWidth / x1Range);
-                    const x2Pixel = originX + x2 * (graphWidth / x2Range);
-                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(1).find(`[stroke-linecap="butt"][x1*="${Math.floor(x1Pixel)}"][y1*="${Math.floor(originY)}"][x2*="${Math.floor(x2Pixel)}"][y2*="${Math.floor(originY)}"]`)
-                        .should('have.css', 'stroke', css.color.incorrectAnswer);
-                });
-        });
-    },
-
-    /**
-   * This function verifies plotted points not exist on the number line on c tab
-   * @param {Object[]} coordinates - An array containing x and y coordinates along with their ranges
-   * @param {number} coordinates[].x1 - x coordinate to be plotted on the graph
-   * @param {number} coordinates[].x1Range - range of x coordinate
-   * @param {number} coordinates[].x2 - x coordinate to be plotted on the graph
-   * @param {number} coordinates[].x2Range - range of x coordinate
-   */
-    verifyLineSegmentOnNumberLineNotExistCorrectAnswerSection: (coordinates) => {
-        coordinates.forEach(({ x1, x1Range, x2, x2Range }) => {
-            numberLinePage.numberLineCorrectAnswerSection()
-                .then(($graphElement) => {
-                    const graphWidth = $graphElement[0].clientWidth;
-                    const graphHeight = $graphElement[0].clientHeight;
-                    const originX = graphWidth / 2;
-                    const originY = graphHeight / 2;
-                    const x1Pixel = originX + x1 * (graphWidth / x1Range);
-                    const x2Pixel = originX + x2 * (graphWidth / x2Range);
-                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(1).find(`svg [stroke-linecap="butt"][x1*="${Math.floor(x1Pixel)}"][y1*="${Math.floor(originY)}"][x2*="${Math.floor(x2Pixel)}"][y2*="${Math.floor(originY)}"]`)
-                        .should('not.exist');
-                });
-        });
-    },
-
-    verifyPlotNumberLineSelected: () => {
-        numberLinePage.plotNumberLineToggleButton()
-            .should('have.attr', 'aria-selected', 'true');
-    },
-
-    verifyCorrectAnswerSectionNotExist: () => {
-        utilities.verifyElementVisibilityState(numberLinePage.numberLineCorrectAnswerSection(), 'notExist');
-    },
-
-    /**
-    * @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.verifyInnerText(numberLinePage.correctIncorrectAnswerTextWrapper(), `Your answer is\n${answerStatus}`)
-        numberLinePage.correctIncorrectAnswerTextWrapper()
-            .within(() => {
-                if (answerStatus === 'correct') {
-                    utilities.verifyElementVisibilityState(numberLinePage.correctIcon(), 'visible');
-                } else {
-                    utilities.verifyElementVisibilityState(numberLinePage.incorrectIcon(), 'visible');
-                }
-            });
-    }
-}
-
-const tests = {
-    ...resetPopupComponent.tests,
-    ...toolSettingsComponent.tests,
-    ...additionalSettingsAccessibilitySectionComponent.tests,
-    ...additionalSettingsPanel.tests,
-    ...studentViewSettingsLabelComponent.tests,
-    ...autoScoredStudentViewSettings.tests,
-    ...autoScoredSpecifyCorrectAnswerSection.tests,
-    ...createQuestionBasePage.tests,
-    ...commonComponents.tests,
-    ...autoScoredScoringPreviewTab.tests,
-    ...defaultToolDropdown.tests,
-    ...scoringSectionBaseEditTab.tests,
-    ...autoScoredScoringSectionMultiResponseType.tests,
-
-    verifyContentsOfSpecifyCorrectAnswerSection: () => {
-        it('When user selects a scoring type then in the \'Correct\' accordion, all the contents should be displayed', () => {
-            utilities.verifyElementVisibilityState(numberLinePage.numberLineSpecifyCorrectAnswer(), 'visible');
-            utilities.verifyElementVisibilityState(numberLinePage.numberLineToolOptionSpecifyCorrectAnswer(), 'visible');
-            utilities.verifyElementVisibilityState(numberLinePage.numberLineControlOptionSpecifyCorrectAnswer(), 'visible');
-            utilities.verifyElementVisibilityState(numberLinePage.numberLineTitleSpecifyCorrectAnswerSection(), 'exist');
-        });
-    },
-
-    /**
-   * 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 user should be able to plot points on number line in the specify correct answer section ${accordionName} accordion`, () => {
-            numberLinePage.steps.plotPointOnNumberLineSpecifyCorrectAnswer([{ x: 0, xRange: 20 }, { x: 1, xRange: 20 }]);
-            numberLinePage.steps.verifyPointsPlottedOnNumberLineSpecifyCorrectAnswer([{ x: 0, xRange: 20 }, { x: 1, xRange: 20 }]);
-        });
-
-        it(`When the user resets the number line in the ${accordionName} accordion, \'Error: Please set a correct answer.\' error message should be thrown along with an error icon on the \'${accordionName}\' accordion`, () => {
-            numberLinePage.steps.selectNumberLineControlOptionSpecifyCorrectAnswerSection('Reset');
-            numberLinePage.steps.confirmReset();
-            utilities.verifyElementVisibilityState(commonComponents.errorMessage(), 'visible');
-            utilities.verifyInnerText(commonComponents.errorMessage(), 'Error: Please set a correct answer.');
-            if (accordionName == 'Correct') {
-                autoScoredSpecifyCorrectAnswerSection.correctAnswerAccordion()
-                    .within(() => {
-                        utilities.verifyElementVisibilityState(autoScoredSpecifyCorrectAnswerSection.specifyCorrectAnswerErrorIcon(), 'visible');
-                    });
-            } else {
-                autoScoredSpecifyCorrectAnswerSection.alternativeAnswerAccordion()
-                    .within(() => {
-                        utilities.verifyElementVisibilityState(autoScoredSpecifyCorrectAnswerSection.specifyCorrectAnswerErrorIcon(), 'visible');
-                    });
-            };
-        });
-
-        autoScoredSpecifyCorrectAnswerSection.tests.verifyAutoScoredCorrectAnswerErrorMessageCSSAndA11y();
-
-        it('When the user plots on the number line then the error message should disappear', () => {
-            numberLinePage.steps.plotPointOnNumberLineSpecifyCorrectAnswer([{ x: 0, xRange: 20 }, { x: 1, xRange: 20 }]);
-            numberLinePage.steps.verifyPointsPlottedOnNumberLineSpecifyCorrectAnswer([{ x: 0, xRange: 20 }, { x: 1, xRange: 20 }]);
-        });
-
-        autoScoredSpecifyCorrectAnswerSection.tests.verifyAutoScoredPointsErrorMessageWhenPointsFieldIsEmpty(accordionName);
-
-        it('Accessibility of \'Correct\' accordion contents', { tags: 'a11y' }, () => {
-            cy.checkAccessibility(numberLinePage.numberLineSpecifyCorrectAnswer());
-        });
-    }
-
-}
-
-export const numberLinePage = {
-    ...selectors,
-    steps,
-    tests
-}