itemengine-cypress-automation 1.0.78 → 1.0.80

package/cypress/pages/protractorPage.js

@@ -0,0 +1,289 @@
+import { commonComponents } from "./components";
+import { createItemPage } from "./createItemPage";
+import utilities from "../support/helpers/utilities";
+import { createQuestionBasePage, additionalSettingsPanel, measuringToolComponent, toolVisibilityComponent } from "./components";
+import { selectQuestionResourceToolPage } from "./selectQuestionResourceToolPage";
+import { dialogBoxBase } from "./dialogBoxBase";
+
+const selectors = {
+    ...commonComponents,
+    ...measuringToolComponent,
+    ...dialogBoxBase,
+    ...selectQuestionResourceToolPage,
+    ...createQuestionBasePage,
+    ...toolVisibilityComponent,
+    //edit tab
+    angleTypeLabel: () => cy.get('#Angle-type-dropdown-label'),
+    angleTypeDropdown: () => cy.get('#Angle-type-select'),
+    angleTypeDropdownOptionsList: (ariaLabel = null) => {
+        if (ariaLabel) {
+            return cy.get(`[aria-labelledby*="Angle-type-dropdown-label"][aria-labelledby*="dropdown-label"] li[role="option"][aria-label*="${ariaLabel}"]`)
+        } else {
+            return cy.get('[aria-labelledby*="Angle-type-dropdown-label"][aria-labelledby*="dropdown-label"] li[role="option"]')
+        }
+    },
+    allowStudentToResizeProtractorCheckbox: () => cy.get('[data-ngie-testid="allow-student-to-resize-protractor-checkbox"] input'),
+    allowStudentToResizeProtractorLabel: () => cy.get('[data-ngie-testid="allow-student-to-resize-protractor-checkbox"] .MuiFormControlLabel-label'),
+    alternativeTextLabel: () => cy.get('.text-label'),
+    protractorColorLabel: () => cy.get('[class*="Protractorstyle__ProtractorColorWrapper"] [class*="Protractorstyle__PropertyLabel"]'),
+    protractorVisibilityLabel: () => cy.get('[class*="Protractorstyle__PropertyVisibilityLabel"]'),
+    displayPointerForAngleMeasurementLabel: () => cy.get('[data-ngie-testid="display-pointer-for-angle-measurement-checkbox"] .MuiFormControlLabel-label'),
+    displayPointerForAngleMeasurementCheckbox: () => cy.get('[data-ngie-testid="display-pointer-for-angle-measurement-checkbox"] input'),
+    //preview tab
+    protractorInPreviewTab: () => cy.get('[class*="ProtractorComponentstyles__Container"] img'),
+    protractorResizeButtonPreviewTab: () => cy.get('[class*="ProtractorComponentstyles__ControlBtn"]'),
+    enlargeProtractorIconInPreviewTab: () => cy.get('[class*="ProtractorComponentstyles__ControlBtn"] #Resize_to_large'),
+    reduceProtractorIconInPreviewTab: () => cy.get('[class*="ProtractorComponentstyles__ControlBtn"] #Resize_to_small'),
+    protractorVisibilityButtonPreviewTab: () => cy.get('.protractor-button:visible'),
+    protractorVisibleImagePreviewTab: () => cy.get('.protractor-button #eye'),
+    protractorHideImagePreviewTab: () => cy.get('.protractor-button #Hide_cell'),
+    pointerForAngleMeasurementInPreviewTab: () => cy.get('.icon-pointer'),
+    showHideButtonForAngleMeasurementPointerInPreviewTab: () => cy.get('[aria-label*=pointer][class*="ProtractorComponentstyles__ControlBtn"]'),
+    pointerForAngleMeasurementShowImageInPreviewTab: () => cy.get('[class*="ProtractorComponentstyles__ControlBtn"] #Pointer'),
+    pointerForAngleMeasurementHideImageInPreviewTab: () => cy.get('[class*="ProtractorComponentstyles__ControlBtn"] #Pointer_off')
+}
+
+const steps = {
+    ...createQuestionBasePage.steps,
+    ...measuringToolComponent.steps,
+    ...dialogBoxBase.steps,
+    ...selectQuestionResourceToolPage.steps,
+    ...toolVisibilityComponent.steps,
+    ...commonComponents.steps,
+    expandAngleTypeDropdown: () => {
+        protractorPage.angleTypeDropdown()
+            .click();
+    },
+
+    /**
+     * @param {string[]} dropdownOptionsArray array containing options of angle type dropdown list
+     * @description this function is used to verify inner text of expanded dropdown list options
+     */
+    verifyAngleTypeDropdownListOptions: (dropdownOptionsArray) => {
+        dropdownOptionsArray.forEach((option, count) => {
+            protractorPage.angleTypeDropdownOptionsList()
+                .eq(count)
+                .should('have.text', option);
+        });
+    },
+
+    /**
+     * @param {string} option is the option to be selected from the expanded angle type dropdown list
+     * @description function selects option from the expanded angle type dropdown list
+     */
+    selectOptionFromAngleTypeDropdown: (option) => {
+        protractorPage.angleTypeDropdownOptionsList(option)
+            .click();
+    },
+
+    verifyAllowStudentToResizeProtractorCheckboxUnchecked: () => {
+        protractorPage.allowStudentToResizeProtractorCheckbox()
+            .should('not.be.checked');
+    },
+
+    verifyAllowStudentToResizeProtractorCheckboxChecked: () => {
+        protractorPage.allowStudentToResizeProtractorCheckbox()
+            .should('be.checked');
+    },
+
+    uncheckAllowStudentToResizeProtractorCheckbox: () => {
+        protractorPage.allowStudentToResizeProtractorCheckbox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    checkAllowStudentToResizeProtractorCheckbox: () => {
+        protractorPage.allowStudentToResizeProtractorCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    verifyDisplayPointerForAngleMeasurementCheckboxUnchecked: () => {
+        protractorPage.displayPointerForAngleMeasurementCheckbox()
+            .should('not.be.checked');
+    },
+
+    verifyDisplayPointerForAngleMeasurementCheckboxChecked: () => {
+        protractorPage.displayPointerForAngleMeasurementCheckbox()
+            .should('not.be.checked');
+    },
+
+    uncheckDisplayPointerForAngleMeasurementCheckbox: () => {
+        protractorPage.displayPointerForAngleMeasurementCheckbox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    checkDisplayPointerForAngleMeasurementCheckbox: () => {
+        protractorPage.displayPointerForAngleMeasurementCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    /**
+     * @param {number} colorIndex is the color block index selected for protractor 
+     * @param {number} opacity is the value for opacity of protractor
+     * @description function verifies background-color and opacity properties of protractor in preview tab
+     */
+    verifyPreviewTabColorAndOpacityOfProtractor: (colorIndex, opacity) => {
+        const bgColor = (opacity) => {
+            switch (colorIndex) {
+                case 0:
+                    return `rgba(255, 255, 255, ${opacity})`;
+                case 1:
+                    return `rgba(186, 201, 255, ${opacity})`;
+                case 2:
+                    return `rgba(128, 239, 255, ${opacity})`;
+                case 3:
+                    return `rgba(255, 238, 215, ${opacity})`;
+                case 4:
+                    return `rgba(255, 238, 78, ${opacity})`;
+                case 5:
+                    return `rgba(220, 223, 230, ${opacity})`;
+                default:
+                    return 'incorrect colorIndex';
+            }
+        };
+        protractorPage.protractorInPreviewTab()
+            .should('have.css', 'background-color', bgColor(opacity));
+    },
+
+    /**
+     * @param {string} altText is alternative text added
+     * @description this function verifies alternative text for protractor
+     */
+    verifyAlternativeTextInPreviewTab: (altText) => {
+        protractorPage.protractorInPreviewTab()
+            .should('have.attr', 'alt', altText);
+    },
+
+    verifyNoAlternativeTextPresentInPreview: () => {
+        protractorPage.protractorInPreviewTab()
+            .should('have.attr', 'alt', '');
+    },
+
+    verifyAcuteAngleTypeInPreviewTab: () => {
+        protractorPage.protractorInPreviewTab()
+            .should('have.attr', 'src')
+            .and('include', 'protractorAcute');
+    },
+
+    verifyAngleTypeIsObtuseInPreviewTab: () => {
+        protractorPage.protractorInPreviewTab()
+            .should('have.attr', 'src')
+            .and('include', 'protractorObtuse');
+    },
+
+    verifyAngleTypeIsBothAcuteAndObtuseInPreviewTab: () => {
+        protractorPage.protractorInPreviewTab()
+            .should('have.attr', 'src')
+            .and('not.include', 'protractorObtuse')
+            .and('not.include', 'protractorAcute');
+    },
+
+    verifyProtractorVisibleInPreviewTab: () => {
+        utilities.verifyElementVisibilityState(protractorPage.protractorInPreviewTab(), 'visible');
+    },
+
+    verifyProtractorNotExistInPreviewTab: () => {
+        utilities.verifyElementVisibilityState(protractorPage.protractorInPreviewTab(), 'notExist');
+    },
+
+    /**
+     * @param {("Small"|"Large")} size indicates icon on resize button in preview tab
+     * @description function verifies icon on protractor resize button
+     */
+    verifyPreviewTabProtractorResizeButtonVisibility: (size) => {
+        utilities.verifyElementVisibilityState(protractorPage.protractorResizeButtonPreviewTab(), 'visible');
+        if (size == 'Small') {
+            utilities.verifyElementVisibilityState(protractorPage.enlargeProtractorIconInPreviewTab(), 'visible');
+        } else {
+            utilities.verifyElementVisibilityState(protractorPage.reduceProtractorIconInPreviewTab(), 'visible');
+        }
+    },
+
+/**
+     * @param {("Small"|"Large")} size indicates size of protractor
+     * @description function verifies size of protractor
+     */
+    verifyProtractorSizeInPreviewTab: (size) => {
+        if (size == 'Small') {
+            protractorPage.protractorInPreviewTab()
+                .should('have.attr', 'width', '442')
+                .and('have.attr', 'height', '240');
+        }
+        else{
+            protractorPage.protractorInPreviewTab()
+                .should('have.attr', 'width', '663')
+                .and('have.attr', 'height', '360');
+        }
+    },
+
+    clickOnResizeButtonInPreviewTab: () => {
+        protractorPage.protractorResizeButtonPreviewTab()
+            .click();
+    },
+
+    /**
+     * @param {("Show"|"Hide")} visibility denotes the visibility on visibility button in preview tab
+     * @description function verifies the visibility button and its icon in preview tab
+     */
+    verifyPreviewTabProtractorVisibilityButtonLabel: (visibility) => {
+        utilities.verifyInnerText(protractorPage.protractorVisibilityButtonPreviewTab(), `${visibility} protractor`);
+        if (visibility == 'Hide') {
+            utilities.verifyElementVisibilityState(protractorPage.protractorHideImagePreviewTab(), 'visible');
+        } else {
+            utilities.verifyElementVisibilityState(protractorPage.protractorVisibleImagePreviewTab(), 'visible');
+        }
+    },
+
+    verifyPreviewTabProtractorVisibilityButtonDoesNotExist: () => {
+        utilities.verifyElementVisibilityState(protractorPage.protractorVisibilityButtonPreviewTab(), 'notExist');
+    },
+
+    clickOnProtractorVisibilityButton: () => {
+        protractorPage.protractorVisibilityButtonPreviewTab()
+            .click();
+    },
+
+    /**
+     * @param {("Show"|"Hide")} visibility of angle measurement pointer on protractor in preview tab
+     * @description function verifies visibility button of angle measurement pointer 
+     */
+    verifyPreviewTabAngleMeasurementPointerVisibility: (visibility) => {
+        utilities.verifyElementVisibilityState(protractorPage.showHideButtonForAngleMeasurementPointerInPreviewTab(), 'visible');
+        if (visibility == 'Hide') {
+            utilities.verifyElementVisibilityState(protractorPage.pointerForAngleMeasurementInPreviewTab(), 'notExist');
+            utilities.verifyElementVisibilityState(protractorPage.pointerForAngleMeasurementHideImageInPreviewTab(), 'visible');
+        } else {
+            utilities.verifyElementVisibilityState(protractorPage.pointerForAngleMeasurementInPreviewTab(), 'visible');
+            utilities.verifyElementVisibilityState(protractorPage.pointerForAngleMeasurementShowImageInPreviewTab(), 'visible');
+        }
+    },
+
+    verifyPreviewTabAngleMeasurementPointerDoesNotExist: () => {
+        utilities.verifyElementVisibilityState(protractorPage.pointerForAngleMeasurementInPreviewTab(), 'notExist');
+    },
+
+    verifyPreviewTabAngleMeasurementPointerShowHideButtonDoesNotExist: () => {
+        utilities.verifyElementVisibilityState(protractorPage.showHideButtonForAngleMeasurementPointerInPreviewTab(), 'notExist');
+    },
+
+    clickOnAngleMeasurementPointerShowHideButtonButton: () => {
+        protractorPage.showHideButtonForAngleMeasurementPointerInPreviewTab()
+            .click();
+    }
+}
+
+const tests = {
+    ...createQuestionBasePage.tests,
+    ...additionalSettingsPanel.tests,
+    ...commonComponents.tests,
+    ...dialogBoxBase.tests
+}
+
+export const protractorPage = {
+    ...selectors,
+    steps,
+    tests
+}