itemengine-cypress-automation 1.0.184-e2e-execution-crash-3b9d0d0.0 → 1.0.185-repoUpdate26April-b17eb46.0

package/cypress/pages/matchingPage.js

@@ -955,7 +955,7 @@ const steps = {
         draggableOptionsSectionComponent.steps.addGroup();
         draggableOptionsSectionComponent.steps.addGroupTitle(groupTitle);
         for (let i = 0; i < numOptionsToAdd; i++) {
-            matchingPage.steps.addOptionButton();
+            matchingPage.steps.addOption();
         }
         matchingPage.steps.enterTextInOptionInputField(optionArray);
     },

package/cypress/pages/multipleSelectionPage.js

@@ -25,6 +25,7 @@ const selectors = {
     optionsText: () => cy.get('.mcq-label'),
     optionsCheckboxWrapperSpecifyCorrectAnswerSection: () => cy.get('[data-ngie-testid="response-option-checkbox"]:visible'),
     optionsCheckboxWrapperPreviewTab: () => cy.get('[class*="question-preview-wrapper"] [data-ngie-testid="response-option-checkbox"]:visible'),
+    penaltyPointsForEachIncorrectOptionInputField: () => cy.get('.penlty-points-input-field input'),
     //TODO: Need to update below selectors, once https://redmine.zeuslearning.com/issues/553983 gets resolved
     optionsCheckbox: () => cy.get('[data-ngie-testid="response-option-checkbox"]:visible [type="checkbox"]'),
     optionsCheckboxPreviewTab: () => cy.get('[class*="question-preview-wrapper"] [data-ngie-testid="response-option-checkbox"] [type="checkbox"]'),
@@ -545,7 +546,28 @@ const steps = {
             .eq(index)
             .parents('.ngie-checkbox')
             .should('have.class', 'checkbox-option-disabled');
-    }
+    },
+
+    /**
+     * Verifies the penalty points value for each incorrect option in the multiple selection question.
+     * @param {number} points - The expected penalty points value for each incorrect option.
+     */
+    verifyPenaltyPointsForEachIncorrectOptionValue: (points) => {
+        multipleSelectionPage.penaltyPointsForEachIncorrectOptionInputField()
+            .should('have.value', points);
+    },
+
+    /**
+     * Allots penalty points for each incorrect option in the multiple selection question.
+     * @param {number} points - The penalty points to be allotted for each incorrect option.
+     */
+    allotPenaltyPointsForEachIncorrectOption: (points) => {
+        multipleSelectionPage.penaltyPointsForEachIncorrectOptionInputField()
+            .clear()
+            .type(`${points}`)
+            .should('have.value', points)
+            .blur();
+    },
 }
 
 const tests = {

package/cypress/pages/numberLineLabelPage.js

@@ -0,0 +1,333 @@
+import constants from '../fixtures/constants';
+import utilities from '../support/helpers/utilities';
+import { createQuestionBasePage, questionInstructionsComponent, scoringSectionBaseEditTab, ckEditorToolbar, equationEditorFlyout, autoScoredScoringPreviewTab, autoScoredStudentViewSettings, numberLineCommonComponent, autoScoredSpecifyCorrectAnswerSection, autoScoredScoringSectionMultiResponseType } from './components';
+const css = Cypress.env('css');
+
+const selectors = {
+    ...questionInstructionsComponent,
+    ...numberLineCommonComponent,
+    //Label section
+    labelInputField: () => cy.get('.edit-question-enter-option-form-element [role="textbox"]'),
+    addLabelButton: () => cy.get('.inline-add-option-button-wrapper button'),
+    labelNumberLineTab: () => cy.get('[data-ngie-testid="label-number-line-tab"]'),
+    //Specify correct answer section
+    draggableLabelsSpecifyCorrectAnswer: () => cy.get('.label-tool'),
+
+    //Preview tab 
+    draggableLabelsPreviewTab: () => cy.get('[class*="question-preview-wrapper"] .label-tool'),
+    labelContainerPreviewTab: () => cy.get('[class*="question-preview-wrapper"] .items-container'),
+
+    //Correct answer section
+    numberLineCorrectAnswerSection: () => cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox svg').eq(2),
+    numberLinePointCorrectAnswerSection: () => cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').last().find('svg ellipse[display="inline"]')
+}
+
+const steps = {
+    ...createQuestionBasePage.steps,
+    ...questionInstructionsComponent.steps,
+    ...scoringSectionBaseEditTab.steps,
+    ...ckEditorToolbar.steps,
+    ...equationEditorFlyout.steps,
+    ...autoScoredScoringPreviewTab.steps,
+    ...autoScoredStudentViewSettings.steps,
+    ...numberLineCommonComponent.steps,
+    ...autoScoredSpecifyCorrectAnswerSection.steps,
+    ...autoScoredScoringSectionMultiResponseType.steps,
+
+    navigateToLabelNumberLineTab: () => {
+        numberLineLabelPage.labelNumberLineTab()
+            .click();
+    },
+
+    addLabel: () => {
+        numberLineLabelPage.addLabelButton()
+            .click()
+    },
+
+    /**
+     * This function is used to focus in the label input field
+     * @param {number} index of the label input field
+     */
+    focusInLabelInputField: (index) => {
+        utilities.getNthElement(numberLineLabelPage.labelInputField(), index)
+            .click();
+    },
+
+    /**
+    * @param {number} index of label input field
+    * @param {string} textContent to enter text in the label input field
+    */
+    enterTextInLabelInputField: (index, textContent) => {
+        numberLineLabelPage.labelInputField()
+            .eq(index)
+            .type(textContent)
+    },
+
+    enterTextInMultipleLabelInputFields: (labelsArray) => {
+        labelsArray.forEach((label, index) => {
+            numberLineLabelPage.labelInputField()
+                .eq(index)
+                .type(label)
+                .blur()
+                .should('have.text', label)
+        });
+    },
+
+    //Specify correct answer section
+    /**
+     * This function clicks and drops label on the specify correct answer section line
+     * @param {string} label to be dropped on the number line
+     * @param {(horizontal|vertical)} orientation of the number line
+     * @param {number} range of the number line
+     * @param {number} coordinate of the number line to drop the label
+     */
+    clickAndDropLabelOnNumberLineSpecifyCorrectAnswer: (label, orientation, range, coordinate) => {
+        numberLineLabelPage.draggableLabelsSpecifyCorrectAnswer()
+            .contains(label)
+            .click();
+        numberLineLabelPage.numberLineSpecifyCorrectAnswer()
+            .then(($graphElement) => {
+                const graphWidth = $graphElement[0].clientWidth;
+                const graphHeight = 180;
+                const originX = graphWidth / 2;
+                const originY = graphHeight / 2;
+                if (orientation === 'horizontal') {
+                    const xPixel = originX + coordinate * (graphWidth / range);
+                    numberLineLabelPage.numberLineSpecifyCorrectAnswer()
+                        .click(xPixel, originY, { force: true });
+                } else {
+                    const yPixel = originY - coordinate * (graphWidth / range);
+                    numberLineLabelPage.numberLineSpecifyCorrectAnswer()
+                        .click(originX, yPixel, { force: true });
+                }
+            });
+    },
+
+    /**
+    * This function verifies plotted points on the number line on the Edit tab.
+    * @param {number} range - The range of x coordinates.
+    * @param {number[]} coordinates - An array containing x coordinates to be plotted on the graph.
+    */
+    verifyPointsPlottedOnNumberLineSpecifyCorrectAnswer: (range, coordinates) => {
+        coordinates.forEach(x => {
+            numberLineLabelPage.numberLineSpecifyCorrectAnswer()
+                .then(($graphElement) => {
+                    let graphWidth = $graphElement[0].clientWidth;
+                    const originX = graphWidth / 2;
+                    const xPixel = originX + x * (graphWidth / range);
+                    cy.get(`.ngie-accordion .ngie-jxgbox svg ellipse[cx*="${Math.floor(xPixel)}"]`)
+                        .should('exist');
+                });
+        });
+    },
+
+    /**
+     * @description Verifies that the image in the Preview tab has the correct source and alt text.
+     * @param {number} index - The index of the option in the Preview tab.
+     */
+    verifyImageInPreviewTab: (index) => {
+        numberLineLabelPage.draggableLabelsPreviewTab()
+            .eq(index)
+            .find('img')
+            .should('have.attr', 'src', constants.foxImageLink)
+            .and('have.attr', 'alt', constants.foxImageAltText);
+    },
+
+    /**
+     * @description Verifies that the bold text in the Preview tab is correct.
+     * @param {number} index - The index of the option in the Preview tab.
+     */
+    verifyBoldTextInPreviewTab: (index) => {
+        numberLineLabelPage.draggableLabelsPreviewTab()
+            .eq(index)
+            .find('strong')
+            .should('have.text', 'This is a bold option');
+    },
+
+    /**
+     * @description Verifies that the equation text in the Preview tab is correct.
+     * @param {number} index - The index of the option in the Preview tab.
+     */
+    verifyEquationTextInPreviewTab: (index) => {
+        numberLineLabelPage.draggableLabelsPreviewTab()
+            .eq(index)
+            .find('[role="math"]')
+            .should('have.attr', 'aria-label', constants.CKEditorInputFieldEnteredEquationAriaLabel)
+            .contains(constants.CKEditorInputFieldEnteredEquationText);
+    },
+
+    /**
+     * This function verifies the text content of label
+     * @param {number} index of the draggable label
+     * @param {string} textContent of the label
+     */
+    verifyLabelTextContentPreviewTab: (index, textContent) => {
+        utilities.verifyInnerText(utilities.getNthElement(numberLineLabelPage.draggableLabelsPreviewTab(), index), textContent)
+    },
+
+    //Preview tab
+    /**
+     * This function clicks and drops label on the specify correct answer section line
+     * @param {string} label to be dropped on the number line
+     * @param {(horizontal|vertical)} orientation of the number line
+     * @param {number} range of the number line
+     * @param {number} coordinate of the number line to drop the label
+     */
+    clickAndDropLabelOnNumberLinePreviewTab: (label, orientation, range, coordinate) => {
+        numberLineLabelPage.draggableLabelsPreviewTab()
+            .contains(label)
+            .click();
+        numberLineLabelPage.numberLinePreviewTab()
+            .then(($graphElement) => {
+                const graphWidth = $graphElement[0].clientWidth;
+                const graphHeight = 120;
+                const originX = graphWidth / 2;
+                const originY = graphHeight / 2;
+                if (orientation === 'horizontal') {
+                    const xPixel = originX + coordinate * (graphWidth / range);
+                    numberLineLabelPage.numberLinePreviewTab()
+                        .click(xPixel, originY, { force: true });
+                } else {
+                    const yPixel = originY - coordinate * (graphWidth / range);
+                    numberLineLabelPage.numberLinePreviewTab()
+                        .click(originX, yPixel, { force: true });
+                }
+            });
+    },
+
+    /**
+   * This function verifies plotted points on the number line on the preview tab.
+   * @param {number} range - The range of x coordinates.
+   * @param {number[]} coordinates - An array containing x coordinates to be plotted on the graph.
+   */
+    verifyPointsPlottedOnNumberLinePreviewTab: (range, coordinates) => {
+        coordinates.forEach(x => {
+            numberLineLabelPage.numberLinePreviewTab()
+                .then(($graphElement) => {
+                    const graphWidth = $graphElement[0].clientWidth;
+                    const originX = graphWidth / 2;
+                    const xPixel = originX + x * (graphWidth / range);
+                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(0).find(`svg ellipse[cx*="${Math.floor(xPixel)}"]`)
+                        .should('exist');
+                });
+        });
+    },
+
+    /**
+   * This function verifies plotted points on the number line on the preview tab.
+   * @param {number} range - The range of x coordinates.
+   * @param {number[]} coordinates - An array containing x coordinates to be plotted on the graph.
+   */
+    verifyIncorrectResponseOnNumberLinePreviewTab: (label, range, coordinate) => {
+        numberLineLabelPage.numberLinePreviewTab()
+            .then(($graphElement) => {
+                const graphWidth = $graphElement[0].clientWidth;
+                const originX = graphWidth / 2;
+                const xPixel = originX + coordinate * (graphWidth / range);
+                cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(0).find(`svg ellipse[cx*="${Math.floor(xPixel)}"]`)
+                    .should('have.css', 'stroke', css.color.incorrectAnswer);
+            });
+        numberLineLabelPage.numberLinePreviewTab()
+            .parents('.ngie-jxgbox')
+            .within(() => {
+                numberLineLabelPage.draggableLabelsSpecifyCorrectAnswer()
+                    .contains(label)
+                    .should('have.class', 'icon-incorrect-cross')
+                    .should('have.css', 'border', `1px solid ${css.color.incorrectAnswer}`)
+                    .verifyPseudoClassBeforeProperty('color', css.color.incorrectAnswer);
+            });
+    },
+
+    /**
+   * This function verifies plotted points on the number line on the preview tab.
+   * @param {number} range - The range of x coordinates.
+   * @param {number[]} coordinates - An array containing x coordinates to be plotted on the graph.
+   */
+    verifyCorrectResponseOnNumberLinePreviewTab: (label, range, coordinate) => {
+        numberLineLabelPage.numberLinePreviewTab()
+            .then(($graphElement) => {
+                const graphWidth = $graphElement[0].clientWidth;
+                const originX = graphWidth / 2;
+                const xPixel = originX + coordinate * (graphWidth / range);
+                cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(0).find(`svg ellipse[cx*="${Math.floor(xPixel)}"]`)
+                    .should('have.css', 'stroke', css.color.correctAnswer);
+            });
+        numberLineLabelPage.numberLinePreviewTab()
+            .parents('.ngie-jxgbox')
+            .within(() => {
+                numberLineLabelPage.draggableLabelsSpecifyCorrectAnswer()
+                    .contains(label)
+                    .should('have.class', 'icon-correct-tick')
+                    .should('have.css', 'border', `1px solid ${css.color.correctAnswer}`)
+                    .verifyPseudoClassBeforeProperty('color', css.color.correctAnswer);
+            });
+    },
+
+    /**
+    * This function verifies plotted points on the number line do not exist on the preview tab.
+    * @param {number} range - The range of x coordinates.
+    * @param {number[]} coordinates - An array containing x coordinates to be plotted on the graph.
+    */
+    verifyPointsNotExistOnNumberLinePreviewTab: (range, coordinates) => {
+        coordinates.forEach(x => {
+            numberLineLabelPage.numberLinePreviewTab()
+                .then(($graphElement) => {
+                    const graphWidth = $graphElement[0].clientWidth;
+                    const originX = graphWidth / 2;
+                    const xPixel = originX + x * (graphWidth / range);
+                    cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(0).find(`svg ellipse[cx*="${Math.floor(xPixel)}"]`)
+                        .should('not.exist');
+                });
+        });
+    },
+
+    //Correct answer section
+    /**
+   * 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} range - range of x coordinate
+   */
+    verifyCorrectResponseOnNumberLineCorrectAnswerSection: (label, range, coordinate) => {
+        numberLineLabelPage.numberLineCorrectAnswerSection()
+            .then(($graphElement) => {
+                const graphWidth = $graphElement[0].clientWidth;
+                const originX = graphWidth / 2;
+                const xPixel = originX + coordinate * (graphWidth / range);
+                cy.get('[class*="question-preview-wrapper"] .ngie-jxgbox').eq(1).find(`svg ellipse[cx*="${Math.floor(xPixel)}"][display="inline"]`)
+                    .should('have.css', 'stroke', css.color.correctAnswer);
+            });
+        numberLineLabelPage.numberLineCorrectAnswerSection()
+            .parents('.ngie-jxgbox')
+            .within(() => {
+                numberLineLabelPage.draggableLabelsSpecifyCorrectAnswer()
+                    .contains(label)
+                    .should('have.class', 'icon-correct-tick')
+                    .should('have.css', 'border', `1px solid ${css.color.correctAnswer}`)
+                    .verifyPseudoClassBeforeProperty('color', css.color.correctAnswer);
+            });
+    },
+
+    /**
+     * This function verifies the label in container and is disabled
+     * @param {string} label in the container
+     */
+    verifyLabelIsDisabledForGradingView: (label) => {
+        numberLineLabelPage.draggableLabelsPreviewTab()
+            .contains(label)
+            .should('have.class', 'disable-label-tool');
+    },
+
+    verifyCorrectAnswerSectionNotExist: () => {
+        utilities.verifyElementVisibilityState(numberLineLabelPage.numberLineCorrectAnswerSection(), 'notExist');
+    }
+}
+
+const tests = {
+    ...autoScoredScoringPreviewTab.tests
+}
+
+export const numberLineLabelPage = {
+    ...selectors,
+    steps,
+    tests
+}