itemengine-cypress-automation 1.0.45 → 1.0.47

package/cypress/e2e/ILC/DragAndDropIntoCategories/dragAndDropIntoCategoriesScoringFiles/groupedOptionsAllOrNothingAlternatePointsGreaterThanCorrectPoints.js

@@ -22,7 +22,7 @@ describe('Create Item page - drag and drop into categories: Preview tab scoring
             dragAndDropIntoCategoriesPage.steps.clickAndDropDraggableOptionInCategoryCellOfSetCorrectAnswerSection('Whale', 2);
             dragAndDropIntoCategoriesPage.steps.clickAndDropDraggableOptionInCategoryCellOfSetCorrectAnswerSection('Parrot', 2);
             dragAndDropIntoCategoriesPage.steps.clickAndDropDraggableOptionInCategoryCellOfSetCorrectAnswerSection('Ostrich', 3);
-            dragAndDropIntoCategoriesPage.steps.allotPoints(5);
+            dragAndDropIntoCategoriesPage.steps.allotPoints(15);
             dragAndDropIntoCategoriesPage.steps.expandAdditonalSettings();
             dragAndDropIntoCategoriesPage.steps.checkAllowStudentsToCheckAnswerCheckbox();
             dragAndDropIntoCategoriesPage.steps.switchToPreviewTab();

package/cypress/e2e/ILC/DragAndDropIntoCategories/dragAndDropIntoCategoriesScoringFiles/groupedOptionsAllOrNothingCorrectPointsEqualToAlternatePoints.js

@@ -22,7 +22,7 @@ describe('Create Item page - drag and drop into categories: Preview tab scoring
             dragAndDropIntoCategoriesPage.steps.clickAndDropDraggableOptionInCategoryCellOfSetCorrectAnswerSection('Whale', 2);
             dragAndDropIntoCategoriesPage.steps.clickAndDropDraggableOptionInCategoryCellOfSetCorrectAnswerSection('Parrot', 2);
             dragAndDropIntoCategoriesPage.steps.clickAndDropDraggableOptionInCategoryCellOfSetCorrectAnswerSection('Ostrich', 3);
-            dragAndDropIntoCategoriesPage.steps.allotPoints(5);
+            dragAndDropIntoCategoriesPage.steps.allotPoints(10);
             dragAndDropIntoCategoriesPage.steps.expandAdditonalSettings();
             dragAndDropIntoCategoriesPage.steps.checkAllowStudentsToCheckAnswerCheckbox();
             dragAndDropIntoCategoriesPage.steps.switchToPreviewTab();

package/cypress/e2e/ILC/DragAndDropIntoCategories/dragAndDropIntoCategoriesScoringFiles/standardAllOrNothingCorrectPointsEqualToAlternatePoints.js

@@ -22,7 +22,7 @@ describe('Create Item page - drag and drop into categories: Preview tab Scoring
             dragAndDropIntoCategoriesPage.steps.clickAndDropDraggableOptionInCategoryCellOfSetCorrectAnswerSection('Whale', 2);
             dragAndDropIntoCategoriesPage.steps.clickAndDropDraggableOptionInCategoryCellOfSetCorrectAnswerSection('Parrot', 2);
             dragAndDropIntoCategoriesPage.steps.clickAndDropDraggableOptionInCategoryCellOfSetCorrectAnswerSection('Ostrich', 3);
-            dragAndDropIntoCategoriesPage.steps.allotPoints(5);
+            dragAndDropIntoCategoriesPage.steps.allotPoints(15);
             dragAndDropIntoCategoriesPage.steps.expandAdditonalSettings();
             dragAndDropIntoCategoriesPage.steps.checkAllowStudentsToCheckAnswerCheckbox();
             dragAndDropIntoCategoriesPage.steps.switchToPreviewTab();

package/cypress/e2e/ILC/DragAndDropIntoCategories/dragAndDropIntoCategoriesScoringFiles/standardAllOrNothingCorrectPointsGreaterThanAlternatePoints.js

@@ -22,7 +22,7 @@ describe('Create Item page - drag and drop into categories: Preview tab Scoring
             dragAndDropIntoCategoriesPage.steps.clickAndDropDraggableOptionInCategoryCellOfSetCorrectAnswerSection('Whale', 2);
             dragAndDropIntoCategoriesPage.steps.clickAndDropDraggableOptionInCategoryCellOfSetCorrectAnswerSection('Parrot', 2);
             dragAndDropIntoCategoriesPage.steps.clickAndDropDraggableOptionInCategoryCellOfSetCorrectAnswerSection('Ostrich', 3);
-            dragAndDropIntoCategoriesPage.steps.allotPoints(5);
+            dragAndDropIntoCategoriesPage.steps.allotPoints(10);
             dragAndDropIntoCategoriesPage.steps.expandAdditonalSettings();
             dragAndDropIntoCategoriesPage.steps.checkAllowStudentsToCheckAnswerCheckbox();
             dragAndDropIntoCategoriesPage.steps.switchToPreviewTab();

package/cypress/e2e/ILC/FillInTheGapsOverImageText/fillInTheGapsOverImageTextAddResponseContainer.js

@@ -0,0 +1,221 @@
+import { fillInTheGapsOverImageTextPage } from "../../../pages";
+import { uploadImageSectionComponent } from "../../../pages/components";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+const css = Cypress.env('css');
+
+describe('Create item page - Fill in the gaps over image - text: Add response container, response container', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Add response container button', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Fill in the gaps over image - text question type');
+            fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image - text');
+            cy.barsPreLoaderWait();
+        });
+
+        it('By default the \'Add response container\' button should not exist', () => {
+            utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.addResponseContainerButton(), 'notExist');
+        });
+
+        it('When the user has uploaded an image in image section, then \'Add response container\' button should be displayed', () => {
+            fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
+            fillInTheGapsOverImageTextPage.steps.clickOnImagePopupOkButton();
+            utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.addResponseContainerButton(), 'visible');
+        });
+
+        it('When the user clicks on \'Add response container\' button, then response container should be added over the uploaded image with numeration', () => {
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.verifyResponseContainerIsDisplayedInImageSection(0);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseContainerNumerationInImageSection(0);
+        });
+
+        it('When the user clicks on add \'Add response container\' button a second response container in image section should be displayed with proper numeration', () => {
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.verifyResponseContainerNumerationInImageSection(1);
+        });
+
+        it('When the user clicks on the close button on the response container, then the response container should be removed from the image', () => {
+            fillInTheGapsOverImageTextPage.steps.clickOnResponseContainerCloseButton(0);
+            utilities.verifyElementCount(fillInTheGapsOverImageTextPage.responseContainer(), 1);
+        });
+
+        it('The remaining response container and its options for response section should be displayed with proper updated numeration', () => {
+            fillInTheGapsOverImageTextPage.steps.verifyResponseContainerIsDisplayedInImageSection(0);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseContainerNumerationInImageSection(0);
+        });
+    });
+
+    describe('Add response container - set correct answer section', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Fill in the gaps over image - text question type');
+            fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image - text');
+            cy.barsPreLoaderWait();
+            fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
+            fillInTheGapsOverImageTextPage.steps.clickOnImagePopupOkButton();
+        });
+
+        it('When the user has not added any response container over the uploaded image, response label and response fields should not be displayed in the set correct answer section', () => {
+            utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.setCorrectAnswerResponseFieldLabel(), 'notExist');
+            utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.responseFieldSetCorrectAnswerSection(), 'notExist');
+        });
+
+        it('When the user adds a response container over the uploaded image, then a label \'Response #\' and its respective response field should be displayed in the set correct answer section', () => {
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.verifyResponseFieldLabelInSetCorrectAnswerSection(0);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseFieldIsDisplayedInSetCorrectAnswerSection(0);
+        });
+
+        it('When the user adds second response container in image section, then a label \'Response #\' and its respective response field should be displayed in the set correct answer section for the newly added response container with appropriate numeration', () => {
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.verifyResponseFieldLabelInSetCorrectAnswerSection(1);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseFieldIsDisplayedInSetCorrectAnswerSection(1);
+            utilities.verifyElementCount(fillInTheGapsOverImageTextPage.setCorrectAnswerResponseFieldLabel(), 2);
+            utilities.verifyElementCount(fillInTheGapsOverImageTextPage.responseFieldSetCorrectAnswerSection(), 2);
+        });
+
+        it('When the user removes a response container in the image section, then the label and response field for the removed response container should also be removed in the set correct answer section and the remaining label and response field in the set correct answer section should be displayed with proper updated numeration', () => {
+            fillInTheGapsOverImageTextPage.steps.clickOnResponseContainerCloseButton(0);
+            utilities.verifyElementCount(fillInTheGapsOverImageTextPage.setCorrectAnswerResponseFieldLabel(), 1);
+            utilities.verifyElementCount(fillInTheGapsOverImageTextPage.responseFieldSetCorrectAnswerSection(), 1);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseFieldLabelInSetCorrectAnswerSection(0);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseFieldIsDisplayedInSetCorrectAnswerSection(0);
+        });
+    });
+
+    describe('Add response container - preview tab', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to fill in the gaps over image - text question type');
+            fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image - text');
+            cy.barsPreLoaderWait();
+            fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
+            fillInTheGapsOverImageTextPage.steps.clickOnImagePopupOkButton();
+        });
+
+        it('When the user has not added any response container over the uploaded image, then response field should not be displayed in preview tab', () => {
+            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
+            utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.responseFieldPreviewTab(), 'notExist');
+        });
+
+        it('When the user adds a response container over the uploaded image, then a response field should be displayed in preview tab', () => {
+            fillInTheGapsOverImageTextPage.steps.switchToEditTab();
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageTextPage.steps.verifyResponseFieldIsDisplayedInPreviewTab(0);
+        });
+
+        it('When the user adds a second response container in image section, then a second response field should also be displayed in preview tab', () => {
+            fillInTheGapsOverImageTextPage.steps.switchToEditTab();
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageTextPage.steps.verifyResponseFieldIsDisplayedInPreviewTab(1);
+            utilities.verifyElementCount(fillInTheGapsOverImageTextPage.responseFieldPreviewTab(), 2);
+        });
+
+        it('When the user removes a response container in image section, then the respective response field should also be removed from the image in preview tab', () => {
+            fillInTheGapsOverImageTextPage.steps.switchToEditTab();
+            fillInTheGapsOverImageTextPage.steps.clickOnResponseContainerCloseButton(0);
+            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
+            utilities.verifyElementCount(fillInTheGapsOverImageTextPage.responseFieldPreviewTab(), 1);
+        });
+
+        it('When the user has added response container in edit tab, then in preview tab it should be positioned in the same way as it is positioned in edit tab', () => {
+            fillInTheGapsOverImageTextPage.steps.switchToEditTab();
+            let coordinatesOfResponse1 = fillInTheGapsOverImageTextPage.steps.getResponseContainerPositionCoordinates(0);
+            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
+            fillInTheGapsOverImageTextPage.steps.verifyResponseFieldPositionCoordinatesInPreviewTab(0, coordinatesOfResponse1);
+        });
+    });
+
+    describe('Response container', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('fill in the gaps over image - text');
+            fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image - text');
+            cy.barsPreLoaderWait();
+            fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
+            uploadImageSectionComponent.steps.unlockAspectRatio();
+            fillInTheGapsOverImageTextPage.steps.updateImageHeight(300);
+            fillInTheGapsOverImageTextPage.steps.clickOnImagePopupOkButton();
+        });
+
+        it('When the user adds response container over the image, response container should be displayed with pointer, numeric count and close button', () => {
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.verifyResponseContainerPointerInImageSection(0);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseContainerNumerationInImageSection(0);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseContainerCloseButtonInImageSection(0);
+        });
+
+        //Failing due to https://redmine.zeuslearning.com/issues/547543
+        it('CSS of \'Response container\' in image section', { tags: 'css' }, () => {
+            utilities.verifyCSS(fillInTheGapsOverImageTextPage.responseContainerPointer().find('circle'), {
+                'fill': css.color.responseContainerPointer
+            });
+            utilities.verifyCSS(fillInTheGapsOverImageTextPage.responseContainerNumeration(), {
+                'color': css.color.text,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.semibold
+            });
+            fillInTheGapsOverImageTextPage.responseContainerChevronDownArrow()
+                .verifyPseudoClassBeforeProperty('color', css.color.secondaryBtn);
+            utilities.verifyCSS(fillInTheGapsOverImageTextPage.responseContainerCloseButton(), {
+                'background-color': css.color.secondaryBtnBg,
+                'border': `1px solid ${css.color.activeComponentBorder}`
+            });
+            utilities.verifyCSS(fillInTheGapsOverImageTextPage.responseContainerCloseButton().find('.X-mark-icon'), {
+                'fill': css.color.activeButtons,
+            });
+        });
+
+        it('Accessibility of \'Response container\' in image section', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(fillInTheGapsOverImageTextPage.responseContainer().parents('.image-container'));
+        });
+
+        it('When the user adds multiple response containers such that their combined width(including padding around the response containers) is less than the width of the uploaded image i.e. in this case 2 response containers, then the response containers should be displayed in the same line', () => {
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.verifyResponseContainerVerticalPosition(1, 0);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseContainerVerticalPosition(1, 1);
+        });
+
+        it('When the user adds multiple response containers such that their combined width(including padding around the response containers) is more than the width of the uploaded image i.e. in this case 3 response containers, then the response container which exceeds the image width(3rd response container) should be displayed below the previously added response containers', () => {
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.verifyResponseContainerVerticalPosition(1, 0);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseContainerVerticalPosition(1, 1);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseContainerVerticalPosition(2, 2);
+        });
+
+        it('When the user removes a response container using the close button, then the position of the remaining response containers should not be changed', () => {
+            let coordinatesOfResponse1 = fillInTheGapsOverImageTextPage.steps.getResponseContainerPositionCoordinates(0);
+            let coordinatesOfResponse2 = fillInTheGapsOverImageTextPage.steps.getResponseContainerPositionCoordinates(2);
+            fillInTheGapsOverImageTextPage.steps.clickOnResponseContainerCloseButton(1);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseContainerPositionCoordinates(0, coordinatesOfResponse1);
+            fillInTheGapsOverImageTextPage.steps.verifyResponseContainerPositionCoordinates(1, coordinatesOfResponse2);
+        });
+
+        //Failing due to - https://redmine.zeuslearning.com/issues/547537
+        it('When the user adds 15 response containers in the image section, then a snackbar with text \'You have reached the maximum number of tokens that can be added\' and a \'CLOSE\' button should be displayed', () => {
+            for (let numeration = 3; numeration < 16; numeration++) {
+                fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            };
+            utilities.verifyInnerText(fillInTheGapsOverImageTextPage.snackbar(), 'You have reached the maximum number of tokens that can be added.');
+            utilities.verifyInnerText(fillInTheGapsOverImageTextPage.snackbarCloseButton(), 'CLOSE');
+        });
+
+        fillInTheGapsOverImageTextPage.tests.verifyMaximumNumberOfTokensSnackbarCSSandA11y();
+
+        it('When the user clicks on snackbar \'CLOSE\' button, the snackbar should disappear', () => {
+            //Add pre-step to remove and add response container
+            cy.log('Pre-step: Remove and add a response container to make the snackbar appear again');
+            fillInTheGapsOverImageTextPage.steps.clickOnResponseContainerCloseButton(14);
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.closeSnackBar();
+        });
+
+        fillInTheGapsOverImageTextPage.tests.verifyDisabledStateOfAddResponseContainerButton();
+    });
+});