itemengine-cypress-automation 1.0.185-repoUpdate26April-b17eb46.0 → 1.0.185

package/cypress/pages/components/numberLineCommonComponent.js

@@ -1,36 +0,0 @@
-import utilities from "../../support/helpers/utilities";
-
-const selectors = {
-    numberLineSpecifyCorrectAnswer: () => cy.get('.ngie-accordion .ngie-jxgbox svg').eq(0),
-    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[display="inline"]'),
-    correctAnswersLabel: () => cy.get('[class*="AnswerLabel"]'),
-    correctIcon: () => cy.get('[data-icon="CorrectAnswer"]'),
-    incorrectIcon: () => cy.get('[data-icon="Incorrect"]'),
-    correctIncorrectAnswerTextWrapper: () => cy.get('[class*="CorrectIncorrectWrapper"]'),
-}
-
-const steps = {
-    /**
-        * @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(numberLineCommonComponent.correctIncorrectAnswerTextWrapper(), `Your answer is\n${answerStatus}`)
-        numberLineCommonComponent.correctIncorrectAnswerTextWrapper()
-            .within(() => {
-                if (answerStatus === 'correct') {
-                    utilities.verifyElementVisibilityState(numberLineCommonComponent.correctIcon(), 'visible');
-                } else {
-                    utilities.verifyElementVisibilityState(numberLineCommonComponent.incorrectIcon(), 'visible');
-                }
-            });
-    },
-}
-
-export const numberLineCommonComponent = {
-    ...selectors,
-    steps
-}

package/cypress/pages/components/styleAndLayoutCustomizationAccordionComponent.js

@@ -1,46 +0,0 @@
-import utilities from "../../support/helpers/utilities";
-
-const css = Cypress.env('css');
-
-const selectors = {
-    styleAndLayoutCustomizationAccordion: () => cy.get('.style-and-layout-customization-wrapper .MuiAccordionSummary-root'),
-}
-
-const steps = {
-    expandStyleAndLayoutCustomizationAccordion: () => {
-        styleAndLayoutCustomizationAccordionComponent.styleAndLayoutCustomizationAccordion()
-            .click()
-            .should('have.attr', 'aria-expanded', 'true');
-    },
-}
-
-const tests = {
-    verifyStyleAndLayoutCustomizationAccordionProperties: () => {
-        it('By default \'Style and layout customization\' accordion should be collapsed and by clicking on the \'Style and layout customization\' accordion, user should be able to expand the accordion', () => {
-            styleAndLayoutCustomizationAccordionComponent.styleAndLayoutCustomizationAccordion()
-                .should('have.attr', 'aria-expanded', 'false');
-            styleAndLayoutCustomizationAccordionComponent.steps.expandStyleAndLayoutCustomizationAccordion();
-        });
-
-        it('CSS of \'Style and layout customization\' accordion', { tags: 'css' }, () => {
-            utilities.verifyCSS(styleAndLayoutCustomizationAccordionComponent.styleAndLayoutCustomizationAccordion().find('.accordion_label'), {
-                'color': css.color.accordionLabel,
-                'font-size': css.fontSize.default,
-                'font-weight': css.fontWeight.bold
-            });
-            utilities.verifyCSS(styleAndLayoutCustomizationAccordionComponent.styleAndLayoutCustomizationAccordion().find('svg'), {
-                'fill': css.color.activeButtons
-            });
-        });
-
-        it('Accessibility of \'Style and layout customization\' accordion', { tags: 'a11y' }, () => {
-            cy.checkAccessibility(styleAndLayoutCustomizationAccordionComponent.styleAndLayoutCustomizationAccordion().parents('.style-and-layout-customization-wrapper'));
-        });
-    }
-}
-
-export const styleAndLayoutCustomizationAccordionComponent = {
-    ...selectors,
-    steps,
-    tests
-}

package/cypress/pages/numberLineLabelPage.js

@@ -1,333 +0,0 @@
-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
-}