itemengine-cypress-automation 1.0.484-skipFewTestsDueToBugs-81df73f.0 → 1.0.485-IEI-3121-c55fa67.0

package/cypress/e2e/ILC/NumberLine/thousandSeparatorSection.js

@@ -0,0 +1,51 @@
+import { numberLinePage } from "../../../pages";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+
+describe('Create item - Number line : Thousands separator section', () => {
+
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Thousands separator - Edit tab content', () => {
+        abortEarlySetup();
+        before(() => {
+            numberLinePage.steps.navigateToCreateQuestion('Number line');
+            cy.barsPreLoaderWait();
+            numberLinePage.steps.addTextInQuestionInstructionsInputField('Plot points on the number line');
+        });
+
+        numberLinePage.tests.verifyThousandSeparatorContent();
+    });
+
+    describe('Thousands separator - Edit tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            numberLinePage.steps.navigateToCreateQuestion('Number line');
+            cy.barsPreLoaderWait();
+            numberLinePage.steps.addTextInQuestionInstructionsInputField('Plot points on the number line');
+            numberLinePage.steps.enterTextInIntervalInputField(500);
+            numberLinePage.steps.enterTextInAnnotateEveryInputField(10);
+            numberLinePage.steps.enterTextInMinInputField(1000.5);
+            numberLinePage.steps.enterTextInMaxInputField(10000.5);
+        });
+
+        numberLinePage.tests.verifyThousandSeparatorFunctionality();
+    });
+
+    describe('Thousands separator - Preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            numberLinePage.steps.navigateToCreateQuestion('Number line');
+            cy.barsPreLoaderWait();
+            numberLinePage.steps.addTextInQuestionInstructionsInputField('Plot points on the number line');
+            numberLinePage.steps.enterTextInIntervalInputField(500);
+            numberLinePage.steps.enterTextInAnnotateEveryInputField(10);
+            numberLinePage.steps.enterTextInMinInputField(1000.5);
+            numberLinePage.steps.enterTextInMaxInputField(10000.5);
+            numberLinePage.steps.switchToPreviewTab();
+        });
+
+        numberLinePage.tests.verifyThousandSeparatorPreviewTabFunctionality();
+    });
+});

package/cypress/e2e/ILC/NumberLineLabel/thousandSeparatorSection.js

@@ -0,0 +1,54 @@
+import { numberLineLabelPage } from "../../../pages";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+
+describe('Create item - Number line : Thousands separator section', () => {
+
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Thousands separator - Edit tab content', () => {
+        abortEarlySetup();
+        before(() => {
+            numberLineLabelPage.steps.navigateToCreateQuestion('Number line');
+            cy.barsPreLoaderWait();
+            numberLineLabelPage.steps.navigateToLabelNumberLineTab();
+            numberLineLabelPage.steps.addTextInQuestionInstructionsInputField('Label on the number line');
+        });
+
+        numberLineLabelPage.tests.verifyThousandSeparatorContent();
+    });
+
+    describe('Thousands separator - Edit tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            numberLineLabelPage.steps.navigateToCreateQuestion('Number line');
+            cy.barsPreLoaderWait();
+            numberLineLabelPage.steps.navigateToLabelNumberLineTab();
+            numberLineLabelPage.steps.addTextInQuestionInstructionsInputField('Label on the number line');
+            numberLineLabelPage.steps.enterTextInIntervalInputField(500);
+            numberLineLabelPage.steps.enterTextInAnnotateEveryInputField(10);
+            numberLineLabelPage.steps.enterTextInMinInputField(1000.5);
+            numberLineLabelPage.steps.enterTextInMaxInputField(10000.5);
+        });
+
+        numberLineLabelPage.tests.verifyThousandSeparatorFunctionality();
+    });
+
+    describe('Thousands separator - Preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            numberLineLabelPage.steps.navigateToCreateQuestion('Number line');
+            cy.barsPreLoaderWait();
+            numberLineLabelPage.steps.navigateToLabelNumberLineTab();
+            numberLineLabelPage.steps.addTextInQuestionInstructionsInputField('Label on the number line');
+            numberLineLabelPage.steps.enterTextInIntervalInputField(500);
+            numberLineLabelPage.steps.enterTextInAnnotateEveryInputField(10);
+            numberLineLabelPage.steps.enterTextInMinInputField(1000.5);
+            numberLineLabelPage.steps.enterTextInMaxInputField(10000.5);
+            numberLineLabelPage.steps.switchToPreviewTab();
+        });
+
+        numberLineLabelPage.tests.verifyThousandSeparatorPreviewTabFunctionality();
+    });
+});

package/cypress/pages/components/numberLineCommonComponent.js

@@ -4,6 +4,12 @@ import { layoutSectionComponent } from "./layoutSectionComponent";
 import { commonComponents } from "./commonComponents";
 const lineSettingsOptions = ['Whole numbers', 'Decimals', 'Fractions', 'Mixed fractions'];
 const numbers = ['-9.50', "-\n19\n2", "-9\n1\n2"]
+const lineSettingsOption = ['Decimals', 'Fractions', 'Mixed fractions', 'Whole numbers'];
+const thousandsSeparatorOptions = ['Comma', 'Space', 'None'];
+const decimalValues =['6,000.5', '6 000.5', '6000.5']
+const fractionValues =['12001\n2', '12001\n2', '12001\n2']
+const mixedFractionValues =['6,000\n1\n2', '6 000\n1\n2', '6000\n1\n2']
+const wholeNumberValues =['1,000.5', '1 000.5', '1000.5']
 
 const selectors = {
     ...layoutSectionComponent,
@@ -30,6 +36,13 @@ const selectors = {
     // toleranceThresholdInputField: () => cy.get('[class*="AllocatedPointsstyles__PointsWrapper"] input'),
     pointsInputField: () => cy.get('.ngie-accordion-detail .points-input-field input[type="text"]'),
     pointsInputFieldForManualScoring: () => cy.get('.points-input-field input[type="text"]'),
+
+    //thousand separator section
+    thousandSeparatorLabel: () => cy.get('.number-line-grid-setting .single-select-toggle-group-title').eq(2),
+    thousandSeparatorToggleButtonContainer: () => cy.get('.number-line-grid-setting [class*="SingleSelectToggleGroupstyles__ButtonContainer"]').eq(2),
+    thousandSeparatorToggleButton: (ariaLabel) => {
+        return cy.get(`div[role="group"] button[aria-label="Thousands separator ${ariaLabel}"]`);
+    },
 }
 
 const steps = {
@@ -392,6 +405,69 @@ const steps = {
             .blur();
     },
 
+    /**
+     * Verifies that the toggle button with the specified ARIA label is selected.
+     * @param {string} ariaLabel - The ARIA label of the toggle button to verify.
+     */
+    verifyThousandSeparatorToggleButtonSelected: (ariaLabel) => {
+        numberLineCommonComponent.thousandSeparatorToggleButton(ariaLabel)
+            .should('have.attr', 'aria-pressed', 'true');
+    },
+
+    /**
+     * Selects the toggle button with the specified ARIA label.
+     * @param {string} ariaLabel - The ARIA label of the toggle button to select.
+     */
+    selectThousandSeparatorToggleButton: (ariaLabel) => {
+        numberLineCommonComponent.thousandSeparatorToggleButton(ariaLabel)
+            .click();
+    },
+
+    /**
+    * Verifies the label on the number line.
+    * @param {Array} values - An array of objects containing the value and index of each label.
+    */
+    verifyThousandSeparatorLabelOnNumberLineNumberLineSection: (values) => {
+        values.forEach(({ value, index }) => {
+            utilities.verifyInnerText(numberLineCommonComponent.numberLineNumberLineSection()
+                .parents('.ngie-jxgbox')
+                .find('.number-line-tick-font')
+                .eq(index)
+                , value
+            );
+        });
+    },
+
+    /**
+    * Verifies the label on the number line PreviewTab.
+    * @param {Array} values - An array of objects containing the value and index of each label.
+    */
+    verifyThousandSeparatorLabelOnNumberLineNumberLineSectionPreviewTab: (values) => {
+        values.forEach(({ value, index }) => {
+            utilities.verifyInnerText(numberLineCommonComponent.numberLinePreviewTab()
+                .parents('.ngie-jxgbox')
+                .find('.number-line-tick-font')
+                .eq(index)
+                , value
+            );
+        });
+    },
+
+    /**
+     * Verifies the label on the number line in specify correct answer section.
+     * @param {Array} values - An array of objects containing the value and index of each label.
+     */
+    verifyThousandSeparatorLabelOnNumberLineSpecifyCorrectAnswerSection: (values) => {
+        values.forEach(({ value, index }) => {
+            utilities.verifyInnerText(numberLineCommonComponent.numberLineSpecifyCorrectAnswer()
+                .parents('.ngie-jxgbox')
+                .find('.number-line-tick-font')
+                .eq(index)
+                , value
+            );
+        });
+    },
+
 }
 
 const tests = {
@@ -819,6 +895,75 @@ const tests = {
     //         numberLineCommonComponent.steps.setToleranceThresholdValue(2);
     //     });
     // }
+
+    verifyThousandSeparatorContent: () => {
+        it(`Thousand separator label and 3 options ${thousandsSeparatorOptions} should be displayed and by default ${thousandsSeparatorOptions[0]} should be selected`, () => {
+            utilities.verifyInnerText(numberLineCommonComponent.thousandSeparatorLabel(), 'Thousands separator');
+            utilities.verifyElementVisibilityState(numberLineCommonComponent.thousandSeparatorLabel(), 'visible');
+            utilities.verifyElementVisibilityState(numberLineCommonComponent.thousandSeparatorToggleButtonContainer(), 'visible');
+            thousandsSeparatorOptions.forEach((label) => {
+                utilities.verifyInnerText(numberLineCommonComponent.thousandSeparatorToggleButton(label), label);
+                utilities.verifyElementVisibilityState(numberLineCommonComponent.thousandSeparatorToggleButton(label), 'visible');
+            });
+            numberLineCommonComponent.steps.verifyThousandSeparatorToggleButtonSelected(thousandsSeparatorOptions[2]);
+        });
+    },
+
+    verifyThousandSeparatorFunctionality: () => {
+        lineSettingsOption.forEach((option, index) => {
+            thousandsSeparatorOptions.forEach((thousandsOption, innerIndex) => {
+                it(`When user selects ${option} in line settings section and selects ${thousandsOption} in thousands separator section, then number displayed on number line should be updated to ${thousandsOption} in number line section and specify correct answer section`, () => {
+                    numberLineCommonComponent.steps.selectLineSettingsToggleButton(option);
+                    numberLineCommonComponent.steps.verifyLineSettingsToggleButtonSelected(option);
+                    numberLineCommonComponent.steps.selectThousandSeparatorToggleButton(thousandsOption);
+                    numberLineCommonComponent.steps.verifyThousandSeparatorToggleButtonSelected(thousandsOption);
+                    if (option === 'Decimals') {
+                        numberLineCommonComponent.steps.verifyThousandSeparatorLabelOnNumberLineNumberLineSection([{ value: decimalValues[innerIndex], index: 10 }]);
+                        numberLineCommonComponent.steps.verifyThousandSeparatorLabelOnNumberLineSpecifyCorrectAnswerSection([{ value: decimalValues[innerIndex], index: 10 }]);
+                    }
+                    else if (option === 'Fractions')  {
+                        numberLineCommonComponent.steps.verifyThousandSeparatorLabelOnNumberLineNumberLineSection([{ value: fractionValues[innerIndex], index: 10 }]);
+                        numberLineCommonComponent.steps.verifyThousandSeparatorLabelOnNumberLineSpecifyCorrectAnswerSection([{ value: fractionValues[innerIndex], index: 10 }]);
+                    }
+                    else if (option === 'Mixed fractions')  {
+                        numberLineCommonComponent.steps.verifyThousandSeparatorLabelOnNumberLineNumberLineSection([{ value: mixedFractionValues[innerIndex], index: 10 }]);
+                        numberLineCommonComponent.steps.verifyThousandSeparatorLabelOnNumberLineSpecifyCorrectAnswerSection([{ value: mixedFractionValues[innerIndex], index: 10 }]);
+                    }
+                     else {
+                        numberLineCommonComponent.steps.verifyThousandSeparatorLabelOnNumberLineNumberLineSection([{ value: wholeNumberValues[innerIndex], index: 0 }]);
+                        numberLineCommonComponent.steps.verifyThousandSeparatorLabelOnNumberLineSpecifyCorrectAnswerSection([{ value: wholeNumberValues[innerIndex], index: 0 }]);
+                    }
+                });
+            });
+        });
+    },
+
+    verifyThousandSeparatorPreviewTabFunctionality: () => {
+        lineSettingsOption.forEach((option, index) => {
+            thousandsSeparatorOptions.forEach((thousandsOption, innerIndex) => {
+                it(`When user selects ${option} in line settings section and selects ${thousandsOption} in thousands separator section, then number displayed on number line should be updated to ${thousandsOption} in preview tab`, () => {
+                    numberLineCommonComponent.steps.switchToEditTab();
+                    numberLineCommonComponent.steps.selectLineSettingsToggleButton(option);
+                    numberLineCommonComponent.steps.verifyLineSettingsToggleButtonSelected(option);
+                    numberLineCommonComponent.steps.selectThousandSeparatorToggleButton(thousandsOption);
+                    numberLineCommonComponent.steps.verifyThousandSeparatorToggleButtonSelected(thousandsOption);
+                    numberLineCommonComponent.steps.switchToPreviewTab();
+                    if (option === 'Decimals') {
+                        numberLineCommonComponent.steps.verifyThousandSeparatorLabelOnNumberLineNumberLineSectionPreviewTab([{ value: decimalValues[innerIndex], index: 10 }]);
+                    }
+                    else if (option === 'Fractions') {
+                        numberLineCommonComponent.steps.verifyThousandSeparatorLabelOnNumberLineNumberLineSectionPreviewTab([{ value: fractionValues[innerIndex], index: 10 }]);
+                    }
+                    else if (option === 'Mixed fractions') {
+                        numberLineCommonComponent.steps.verifyThousandSeparatorLabelOnNumberLineNumberLineSectionPreviewTab([{ value: mixedFractionValues[innerIndex], index: 10 }]);
+                    }
+                    else {
+                        numberLineCommonComponent.steps.verifyThousandSeparatorLabelOnNumberLineNumberLineSectionPreviewTab([{ value: wholeNumberValues[innerIndex], index: 0 }]);
+                    }
+                });
+            });
+        });
+    }
 }
 
 export const numberLineCommonComponent = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "itemengine-cypress-automation",
-  "version": "1.0.484-skipFewTestsDueToBugs-81df73f.0",
+  "version": "1.0.485-IEI-3121-c55fa67.0",
   "description": "",
   "main": "index.js",
   "scripts": {