itemengine-cypress-automation 1.0.83 → 1.0.85

package/cypress/pages/components/essayResponseCommonComponents.js

@@ -1,16 +1,24 @@
 import utilities from "../../support/helpers/utilities";
+import { commonComponents } from "./commonComponents";
 
 const selectors = {
     //Basic section
-    setWordLimitLabel: () => cy.get('[class*="EssayResponseComponentstyles__PropertyLabel"]'),
-    setWordLimitInputField: () => cy.get('.essay-response-question-word-limit-setting-wrapper input[type="text"]'),
-    displayWordLimitLabel: () => cy.get('[id="Display-Word-Limit-dropdown-label"]'),
-    displayWordLimitDropdown: () => cy.get('#Display-word-limit-select'),
-    displayWordLimitDropdownListOptions: (optionIndex) => cy.get('.dropdown-list-ul [role="option"]').eq(optionIndex),
-    allowSubmissionOverWordLimitLabel: () => cy.get('.essay-response-question-word-limit-check-box-form-group').eq(0),
-    allowSubmissionOverWordLimitCheckbox: () => cy.get('.essay-response-question-word-limit-check-box-form-group [type="checkbox"]').eq(0),
-    showWordCountLabel: () => cy.get('.essay-response-question-word-limit-check-box-form-group').eq(1),
-    showWordCountCheckbox: () => cy.get('.essay-response-question-word-limit-check-box-form-group [type="checkbox"]').eq(1),
+    setLimitLabel: () => cy.get('[class*="SetLimitWrapper"] .essay-response-word-limit-label'),
+    minimumLimitLabel: () => cy.get('.min-max-input-wrapper .essay-response-word-limit-label').eq(0),
+    maximumLimitLabel: () => cy.get('.min-max-input-wrapper .essay-response-word-limit-label').eq(1),
+    minMaxLabelAndInputFieldWrapper: () => cy.get('min-max-input-wrapper'),
+    minimumLimitInputField: () => cy.get('.min-max-input-wrapper input').eq(0),
+    maximumLimitInputField: () => cy.get('.min-max-input-wrapper input').eq(1),
+    wordRadioButton: () => cy.get('input[aria-label="Word"]'),
+    wordLabel: () => cy.get('[aria-label="Word"].ngie-radio-label'),
+    characterRadioButton: () => cy.get('input[aria-label="Character"]'),
+    characterLabel: () => cy.get('[aria-label="Character"].ngie-radio-label'),
+    noneRadioButton: () => cy.get('input[aria-label="None"]'),
+    noneLabel: () => cy.get('[aria-label="None"].ngie-radio-label'),
+    alwaysShowMaxLimitLabel: () => cy.get('[data-ngie-testid="always-show-maximum-limit-checkbox"] .MuiFormControlLabel-label'),
+    alwaysShowMaxLimitCheckbox: () => cy.get('[data-ngie-testid="always-show-maximum-limit-checkbox"] input'),
+    alwaysShowMinLimitLabel: () => cy.get('[data-ngie-testid="always-show-minimum-limit-checkbox"] .MuiFormControlLabel-label'),
+    alwaysShowMinLimitCheckBox: () => cy.get('[data-ngie-testid="always-show-minimum-limit-checkbox"] input'),
     previewTabToolbarWrapper: () => cy.get('.toolbar-overlay'),
     previewTabToolbarOption: (formattingOption = null) => {
         if (formattingOption) {
@@ -35,13 +43,118 @@ const selectors = {
     spellCheckCheckbox: () => cy.get('[data-ngie-testid="spell-check-checkbox"] input'),
     customSpecialCharacterLabel: () => cy.get('[class*="InlineTextFieldWithDebouncestyles__PropertyLabel"]').eq(1),
     customSpecialCharacterInputField: () => cy.get('input[aria-label="Custom Special Characters"]'),
-    wordLimitReachedWarningMessage: () => cy.get('[data-at="limit-reached"]'),
+    limitReachedWarningMessageContainer: () => cy.get('.disabled-wrapper-cls'),
+    limitReachedWarningMessage: () => cy.get('.disabled-wrapper-cls [class*="DisabledTextWrapper"]'),
     //Preview tab
     responseField: () => cy.get('[title="Enter your response to the question here."]'),
     responseFieldWordCount: () => cy.get('[class*="InputLimitLabelWrapper"]'),
 }
 
 const steps = {
+    /**
+     * @param {number} maxLimit value to be entered in maximum limit input field
+     * @description this function enters and verifies the value in maximum limit input field
+     */
+    setMaximumLimit: (maxLimit) => {
+        essayResponseCommonComponents.maximumLimitInputField()
+            .clear()
+            .type(maxLimit)
+            .blur()
+            .should('have.value', maxLimit);
+
+    },
+
+    /**
+     * @param {number} minLimit value to be entered in minimum limit input field
+     * @description this function enters and verifies the value in minimum limit input field
+     */
+    setMinimumLimit: (minLimit) => {
+        essayResponseCommonComponents.minimumLimitInputField()
+            .clear()
+            .type(minLimit)
+            .blur()
+            .should('have.value', minLimit)
+    },
+
+    clearAndFocusOutOfMaximumLimitInputField: () => {
+        essayResponseCommonComponents.maximumLimitInputField()
+            .clear()
+            .blur();
+    },
+
+    clearAndFocusOutOfMinimumLimitInputField: () => {
+        essayResponseCommonComponents.minimumLimitInputField()
+            .clear()
+            .blur();
+    },
+
+    /**
+     * @param {number} maxLimit value of maximum input field
+     * @description this function verifies the value in maximum limit input field
+     */
+    verifyMaximumLimitInputField: (maxLimit) => {
+        essayResponseCommonComponents.maximumLimitInputField()
+            .should('have.value', maxLimit)
+    },
+
+
+    verifyMaximumLimitErrorMessage: () => {
+        utilities.verifyInnerText(commonComponents.errorMessage().eq(1), 'Error: Maximum limit must be greater than or equal to Minimum limit.');
+        utilities.verifyElementVisibilityState(commonComponents.errorMessage().eq(1), 'visible');
+    },
+
+    verifyMinimumLimitErrorMessage: () => {
+        utilities.verifyInnerText(commonComponents.errorMessage().eq(0), 'Error: Minimum limit must be less than or equal to Maximum limit.');
+        utilities.verifyElementVisibilityState(commonComponents.errorMessage().eq(0), 'visible');
+    },
+
+    /**
+     * @param {number} minLimit value of minimum input field
+     * @description this function verifies the value in minimum limit input field
+     */
+    verifyMinimumLimitInputField: (minLimit) => {
+        essayResponseCommonComponents.minimumLimitInputField()
+            .should('have.value', minLimit)
+    },
+
+    verifyWordRadioButtonChecked: () => {
+        essayResponseCommonComponents.wordRadioButton()
+            .should('be.checked');
+    },
+
+    verifyCharacterRadioButtonUnchecked: () => {
+        essayResponseCommonComponents.characterRadioButton()
+            .should('not.be.checked');
+    },
+
+    verifyNoneRadioButtonUnchecked: () => {
+        essayResponseCommonComponents.noneRadioButton()
+            .should('not.be.checked');
+    },
+
+    checkCharacterRadioButton: () => {
+        essayResponseCommonComponents.characterRadioButton()
+            .click()
+            .should('be.checked');
+    },
+
+    checkNoneRadioButton: () => {
+        essayResponseCommonComponents.noneRadioButton()
+            .click()
+            .should('be.checked');
+    },
+
+    verifyAlwaysShowMaximumLimitCheckboxIsChecked: () => {
+        essayResponseCommonComponents.alwaysShowMaxLimitCheckbox()
+            .should('be.checked');
+    },
+
+    checkAlwaysShowMinimumLimitCheckbox: () => {
+        essayResponseCommonComponents.alwaysShowMinLimitCheckBox()
+            .click()
+            .should('be.checked');
+    },
+
     //TODO: need to improve this, we are passing two parameters here, only one should suffice
     openAndSelectOptionFromDisplayWordLimitDropdown: (optionIndex, optionName) => {
         essayResponseCommonComponents.displayWordLimitDropdown()
@@ -52,14 +165,6 @@ const steps = {
             .should('have.text', optionName);
     },
 
-    setWordLimit: (wordLimit) => {
-        essayResponseCommonComponents.setWordLimitInputField()
-            .clear()
-            .type(wordLimit)
-            .blur()
-            .should('have.value', wordLimit);
-    },
-
     enterTextInResponseField: (textContent) => {
         essayResponseCommonComponents.steps.enterInputInResponseField(textContent);
         essayResponseCommonComponents.steps.verifyResponseFieldInput(textContent);
@@ -70,6 +175,16 @@ const steps = {
             .type(textContent);
     },
 
+    clearResponseField: () => {
+        essayResponseCommonComponents.responseField()
+            .clear();
+    },
+
+    focusOutOfResponseField: () => {
+        essayResponseCommonComponents.responseField()
+            .blur();
+    },
+
     verifyResponseFieldInput: (textContent) => {
         essayResponseCommonComponents.responseField()
             .find('p')
@@ -78,16 +193,38 @@ const steps = {
 
     /**
      * @description this function verifies word limit in the preview tab
-     * @param {number} wordLimit as set in the set limit section
+     * @param {string} wordLimit as set in the set limit section
      */
     verifyResponseFieldWordCount: (wordLimit) => {
-        utilities.verifyInnerText(essayResponseCommonComponents.responseFieldWordCount(), `Maximum ${wordLimit} words`);
+        utilities.verifyInnerText(essayResponseCommonComponents.responseFieldWordCount(), wordLimit);
+    },
+
+    /**
+     * @description this function verifies word maximum/minimum limit in the preview tab
+     * @param {string} maxLimit as set in the set limit section
+     * @param {string} minLimit as set in the set limit section
+     */
+    verifyWordLimitInPreviewTab: (maxLimit, minLimit = null) => {
+        if (minLimit !== null) {
+            utilities.verifyInnerText(essayResponseCommonComponents.responseFieldWordCount(), `${minLimit}-${maxLimit} words required`);
+        }
+        else {
+            utilities.verifyInnerText(essayResponseCommonComponents.responseFieldWordCount(), `Maximum ${maxLimit} words`);
+        };
     },
 
-    verifyWordLimitReachedWarningMessage: () => {
-        essayResponseCommonComponents.wordLimitReachedWarningMessage()
-            .should('have.text', 'Word limit reached')
-            .and('be.visible');
+    /**
+     * @description this function verifies word maximum/minimum limit in the preview tab
+     * @param {string} maxLimit as set in the set limit section
+     * @param {string} minLimit as set in the set limit section
+     */
+    verifyCharacterLimitInPreviewTab: (maxLimit, minLimit = null) => {
+        if (minLimit !== null) {
+            utilities.verifyInnerText(essayResponseCommonComponents.responseFieldWordCount(), `${minLimit}-${maxLimit} characters required`);
+        }
+        else {
+            utilities.verifyInnerText(essayResponseCommonComponents.responseFieldWordCount(), `Maximum ${maxLimit} characters`);
+        };
     },
 
     resetPreviewTabResponseField: () => {
@@ -116,7 +253,7 @@ const steps = {
                     .should('have.attr', 'title', defaultFormattingOptions[count])
                     .and('be.visible');
             });
-        essayResponseCommonComponents.previewTabToolbarOption(toolbarOption)
+        essayResponseCommonComponents.previewTabToolbarOption('Decrease Indent')
             .next()
             .should('have.attr', 'role', 'separator')
             .should('be.visible');
@@ -136,6 +273,19 @@ const steps = {
                 .click()
                 .should('have.attr', 'aria-pressed', 'true');
         }
+    },
+
+    verifyLimitReachedWarningMessageNotExist: () => {
+        utilities.verifyElementVisibilityState(essayResponseCommonComponents.limitReachedWarningMessage(), 'notExist');
+    },
+
+    /**
+     * @description this function verifies warning text for limit reached
+     * @param {string} warningText warning message displayed
+     */
+    verifyLimitReachedWarningMessage: (warningText) => {
+        utilities.verifyElementVisibilityState(essayResponseCommonComponents.limitReachedWarningMessage(), 'visible');
+        utilities.verifyInnerText(essayResponseCommonComponents.limitReachedWarningMessage(), warningText);
     }
 }
 

package/cypress/pages/components/figOverImageCanvasComponent.js

@@ -1,10 +1,27 @@
 import utilities from "../../support/helpers/utilities";
 import { backgroundImageUploadComponent } from "./backgroundImageUploadComponent";
+import { createQuestionBasePage } from "./createQuestionBasePage";
 
 const selectors = {
     insertResponseAreaButton: () => cy.get('button[aria-label*="insert"]').eq(0),
     selectResponseAreaButton: () => cy.get('button[aria-label*="select"]').eq(0),
+    canvas: () => cy.get('[class*="Canvasstyle__DragAndDropCanvas"]'),
+    canvasInPreviewTab: () => cy.get('[class*="PreviewTabstyles__ContentWrapper"] [class*="Canvasstyle__DragAndDropCanvas"]'),
     canvasImage: () => cy.get('.canvas-image'),
+    canvasImageInPreviewTab: () => cy.get('[class*="PreviewTabstyles__ContentWrapper"] .canvas-image'),
+    imagePropertiesLabel: () => cy.get('[class*="ImagePropertiesstyles__SectionLabel"]'),
+    fillImageToCanvasLabel: () => cy.get('[data-ngie-testid="fill-image-to-canvas-checkbox"] .MuiFormControlLabel-label'),
+    fillImageToCanvasCheckbox: () => cy.get('[data-ngie-testid="fill-image-to-canvas-checkbox"] input'),
+    imageAlignmentLabel: () => cy.get('.image-alignment-wrapper [class*="OptionsContainerstyles__LabelWrapper"]'),
+    topLeftAlignmentButton: () => cy.get('[data-ngie-testid="top-left-toggle-button"]'),
+    centerAlignmentButton: () => cy.get('.image-alignment-wrapper [data-ngie-testid="center-toggle-button"]'),
+    topRightAlignmentButton: () => cy.get('[data-ngie-testid="top-right-toggle-button"]'),
+    canvasWidthLabel: () => cy.get('.common-text-wrapper .additional-settings-label').eq(0),
+    canvasWidthInputField: () => cy.get('.common-text-wrapper .text-field').eq(0),
+    canvasHeightLabel: () => cy.get('.common-text-wrapper .additional-settings-label').eq(1),
+    canvasHeightInputField: () => cy.get('.common-text-wrapper .text-field').eq(1),
+    imageAlternativeTextLabel: () => cy.get('[class*="InlineTextFieldWithDebouncestyles__PropertyLabel"]'),
+    imageAlternativeTextInputField: () => cy.get('[class*="ImagePropertiesstyles__AltTextWrapper"] input'),
     canvasImagePreviewTab: () => cy.get('.background-image'),
     removeDropzoneButton: () => cy.get('.remove-button')
 }
@@ -36,6 +53,246 @@ const steps = {
         cy.wait(2000);
     },
 
+    verifyImageIsUploadedInPreviewTab: () => {
+        utilities.verifyElementVisibilityState(figOverImageCanvasComponent.canvasImageInPreviewTab(), 'visible')
+    },
+
+    verifyCanvasImageNotExist: () => {
+        utilities.verifyElementVisibilityState(figOverImageCanvasComponent.canvasImage(), 'notExist');
+    },
+
+    verifyFillImageToCanvasCheckboxUnchecked: () => {
+        figOverImageCanvasComponent.fillImageToCanvasCheckbox()
+            .should('not.be.checked');
+    },
+
+    verifyFillImageToCanvasCheckboxChecked: () => {
+        figOverImageCanvasComponent.fillImageToCanvasCheckbox()
+            .should('be.checked');
+    },
+
+    checkFillImageToCanvasCheckbox: () => {
+        figOverImageCanvasComponent.fillImageToCanvasCheckbox()
+            .click();
+        steps.verifyFillImageToCanvasCheckboxChecked();
+    },
+
+    uncheckFillImageToCanvasCheckbox: () => {
+        figOverImageCanvasComponent.fillImageToCanvasCheckbox()
+            .click();
+        steps.verifyFillImageToCanvasCheckboxUnchecked();
+    },
+
+    verifyCanvasImageTopLeftAligned: () => {
+        figOverImageCanvasComponent.canvasImage()
+            .should('have.css', 'top', '0px')
+            .and('have.css', 'left', '0px');
+    },
+
+    verifyCanvasImageTopLeftAlignedInPreviewTab: () => {
+        figOverImageCanvasComponent.canvasImageInPreviewTab()
+            .should('have.css', 'top', '0px')
+            .and('have.css', 'left', '0px');
+    },
+
+    verifyCanvasImageTopRightAligned: () => {
+        figOverImageCanvasComponent.canvasImage()
+            .should('have.css', 'top', '0px')
+            .and('not.have.css', 'left', '0px');
+    },
+
+    verifyCanvasImageTopRightAlignedInPreviewTab: () => {
+        figOverImageCanvasComponent.canvasImageInPreviewTab()
+            .should('have.css', 'top', '0px')
+            .and('not.have.css', 'left', '0px');
+    },
+
+    verifyCanvasImageCenterAligned: () => {
+        figOverImageCanvasComponent.canvasImage()
+            .should('not.have.css', 'top', '0px')
+            .and('not.have.css', 'left', '0px');
+    },
+
+    verifyCanvasImageCenterAlignedInPreviewTab: () => {
+        figOverImageCanvasComponent.canvasImageInPreviewTab()
+            .should('not.have.css', 'top', '0px')
+            .and('not.have.css', 'left', '0px');
+    },
+
+    selectTopLeftImageAlignment: () => {
+        figOverImageCanvasComponent.topLeftAlignmentButton()
+            .click();
+        figOverImageCanvasComponent.topLeftAlignmentButton()
+            .should('have.attr', 'aria-pressed', 'true');
+    },
+
+    selectTopRightImageAlignment: () => {
+        figOverImageCanvasComponent.topRightAlignmentButton()
+            .click();
+        figOverImageCanvasComponent.topRightAlignmentButton()
+            .should('have.attr', 'aria-pressed', 'true');
+    },
+
+    selectCenterImageAlignment: () => {
+        figOverImageCanvasComponent.centerAlignmentButton()
+            .click();
+        figOverImageCanvasComponent.centerAlignmentButton()
+            .should('have.attr', 'aria-pressed', 'true');
+    },
+
+    /**
+     * @param {number} value holds opacity value for image
+     * @description function verifies opacity value for image
+     */
+    verifyOpacityValueForCanvasImage: (value) => {
+        figOverImageCanvasComponent.canvasImage()
+            .should('have.attr', 'opacity', value);
+    },
+
+     /**
+     * @param {number} value holds opacity value for image
+     * @description function verifies opacity value for image
+     */
+     verifyOpacityValueForCanvasImageInPreviewTab: (value) => {
+        figOverImageCanvasComponent.canvasImageInPreviewTab()
+            .should('have.attr', 'opacity', value);
+    },
+
+    /**
+     * @param {string} text text to be added in input field
+     * @description this function adds text in input field and then verifies it
+     */
+    enterAndVerifyImageAlternativeTextInInputField: (text) => {
+        figOverImageCanvasComponent.imageAlternativeTextInputField()
+            .type(text);
+        figOverImageCanvasComponent.imageAlternativeTextInputField()
+            .should('have.value', text);
+    },
+
+    /**
+     * @param {string} text alternative text for canvas image
+     * @description this function verifies text for canvas image
+     */
+    verifyImageAlternativeTextInPreviewTab: (text) => {
+        figOverImageCanvasComponent.canvasImageInPreviewTab()
+            .should('have.attr', 'alt', text);
+    },
+
+    /**
+     * @param {string} text alternative text for canvas image
+     * @description this function verifies text for canvas image
+     */
+    verifyImageAlternativeTextPresentInEditTab: (text) => {
+        figOverImageCanvasComponent.canvasImage()
+            .should('have.attr', 'alt', text);
+    },
+
+    clearImageAlternativeTextInputFieldText: () => {
+        figOverImageCanvasComponent.imageAlternativeTextInputField()
+            .clear();
+    },
+
+    verifyNoImageAlternativeTextPresentInPreviewTab: () => {
+        figOverImageCanvasComponent.canvasImageInPreviewTab()
+            .should('have.attr', 'alt', '');
+    },
+
+    verifyNoImageAlternativeTextPresentInEditTab: () => {
+        figOverImageCanvasComponent.canvasImage()
+            .should('have.attr', 'alt', '');
+    },
+
+    verifyImageFitsToCanvas: () => {
+        figOverImageCanvasComponent.canvasWidthInputField()
+            .invoke('attr', 'value')
+            .then((value) => {
+                figOverImageCanvasComponent.canvasImage().should('have.css', 'width', `${value}px`);
+            });
+    },
+
+    verifyImageDoesNotFitToCanvas: () => {
+        figOverImageCanvasComponent.canvasHeightInputField()
+            .invoke('attr', 'value')
+            .then((value) => {
+                figOverImageCanvasComponent.canvasImage().should('have.css', 'height', `${value}px`);
+            });
+    },
+
+    verifyImageFitsToCanvasInPreviewTab: () => {
+        createQuestionBasePage.steps.switchToEditTab();
+        figOverImageCanvasComponent.canvasWidthInputField()
+            .invoke('attr', 'value')
+            .then((value) => {
+                createQuestionBasePage.steps.switchToPreviewTab();
+                figOverImageCanvasComponent.canvasImageInPreviewTab().should('have.css', 'width', `${value}px`);
+            });
+    },
+
+    verifyImageDoesNotFitToCanvasInPreviewTab: () => {
+        createQuestionBasePage.steps.switchToEditTab();
+        figOverImageCanvasComponent.canvasHeightInputField()
+            .invoke('attr', 'value')
+            .then((value) => {
+                createQuestionBasePage.steps.switchToPreviewTab();
+                figOverImageCanvasComponent.canvasImageInPreviewTab().should('have.css', 'height', `${value}px`);
+            });
+    },
+
+    /**
+     * @param {number} width holds value of width attribute
+     * @description function updates canvas width in input field
+     */
+    updateCanvasWidth: (width) => {
+        figOverImageCanvasComponent.canvasWidthInputField()
+            .clear()
+            .type(width);
+    },
+
+    /**
+     * @param {number} height holds value of height attribute
+     * @description function updates canvas height in input field
+     */
+    updateCanvasHeight: (height) => {
+        figOverImageCanvasComponent.canvasHeightInputField()
+            .clear()
+            .type(height);
+    },
+
+    /**
+     * @param {*} width width of canvas
+     * @description this function verifies width of canvas
+     */
+    verifyCanvasWidth: (width) => {
+        figOverImageCanvasComponent.canvas()
+            .should('have.attr', 'width', width);
+    },
+
+    /**
+     * @param {*} height height of canvas
+     * @description this function verifies height of canvas
+     */
+    verifyCanvasHeight: (height) => {
+        figOverImageCanvasComponent.canvas()
+            .should('have.css', 'height', `${height}px`);
+    },
+
+    /**
+     * @param {*} width width of canvas
+     * @description this function verifies width of canvas
+     */
+    verifyCanvasWidthInPreviewTab: (width) => {
+        figOverImageCanvasComponent.canvasInPreviewTab()
+            .should('have.attr', 'width', width);
+    },
+
+    /**
+     * @param {*} height height of canvas
+     * @description this function verifies height of canvas
+     */
+    verifyCanvasHeightInPreviewTab: (height) => {
+        figOverImageCanvasComponent.canvasInPreviewTab()
+            .should('have.css', 'height', `${height}px`);
+    },
     /**
      * @description this function removes a dropzone from the canvas
      * @param {number} index of the dropzone to be removed

package/cypress/pages/components/imageActionsComponent.js

@@ -0,0 +1,30 @@
+const selectors = {
+    lockAspectRatioButton: () => cy.get('[class*="lock-reset"] button').eq(0),
+    resetDimensionsButton: () => cy.get('[class*="lock-reset"] button').eq(1),
+}
+
+const steps = {
+    unlockAspectRatio: () => {
+        imageActionsComponent.lockAspectRatioButton()
+            .click();
+        imageActionsComponent.lockAspectRatioButton()
+            .should('have.attr', 'aria-label', 'Unlocked aspect ratio');
+    },
+
+    lockAspectRatio: () => {
+        imageActionsComponent.lockAspectRatioButton()
+            .click();
+        imageActionsComponent.lockAspectRatioButton()
+            .should('have.attr', 'aria-label', 'Locked aspect ratio');
+    },
+
+    resetDimensions: () => {
+        imageActionsComponent.resetDimensionsButton()
+            .click();
+    },
+}
+
+export const imageActionsComponent = {
+    ...selectors,
+    steps
+}

package/cypress/pages/components/index.js

@@ -37,17 +37,17 @@ export * from './measuringToolComponent';
 export * from './toolVisibilityComponent';
 export * from './randomizeOptionsComponent';
 export * from './lockUnlockOptionsComponent';
-export * from './toolSettingsComponent';
 export * from './maximumCapacityPerDropzoneComponent';
-export * from './measuringToolComponent';
 export * from './toolSettingsComponent';
 export * from './draggableOptionContainer';
 export * from './allowMultipleInstancesOfSameDraggableOptionComponent';
+export * from './questionInputFieldComponent';
+export * from './studentViewSettingsLabelComponent';
 export * from './backgroundImageUploadComponent';
 export * from './figOverImageCanvasComponent';
 export * from './correctIncorrectAnswerLabelComponent';
 export * from './acceptedStudentInputComponent';
-export * from './questionInputFieldComponent';
-export * from './studentViewSettingsLabelComponent';
 export * from './draggableOptionsSectionComponent';
-export * from './enableOuterBorderComponent';
+export * from './enableOuterBorderComponent';
+export * from './opacityComponent';
+export * from './imageActionsComponent';

package/cypress/pages/components/measuringToolComponent.js

@@ -17,9 +17,6 @@ const selectors = {
         }
     },
     rotationButtonInPreviewTab: () => cy.get('.icon-rotate'),
-    opacityLabel: () => cy.get('.MuiGrid-align-items-xs-center [class*="PropertyLabel"]'),
-    opacityInputField: () => cy.get('.MuiGrid-align-items-xs-center .text-input-field input'),
-    opacitySlider: () => cy.get('.MuiGrid-align-items-xs-center .opacity-slider'),
     toolColorBlock: () => cy.get('[class*="ColorBlockWrapper"] .MuiToggleButton-root')
 }
 
@@ -107,57 +104,6 @@ const steps = {
         utilities.verifyElementVisibilityState(measuringToolComponent.rotationButtonInPreviewTab(), 'exist');
     },
 
-    verifyDefaultOpacityLabelSliderAndInputField: () => {
-        utilities.verifyInnerText(measuringToolComponent.opacityLabel(), 'Opacity');
-        utilities.verifyElementVisibilityState(measuringToolComponent.opacityLabel(), 'visible');
-        utilities.verifyElementVisibilityState(measuringToolComponent.opacitySlider(), 'visible')
-        measuringToolComponent.steps.verifyOpacitySliderValue(40);
-        measuringToolComponent.steps.verifyOpacityInputFieldValue(40);
-        utilities.verifyElementVisibilityState(measuringToolComponent.opacityInputField(), 'visible');
-    },
-
-    /**
-     * @param {number} value holds value of input field
-     * @description function verifies value in input field
-     */
-    verifyOpacityInputFieldValue: (value) => {
-        measuringToolComponent.opacityInputField()
-            .should('have.value', value);
-    },
-
-    verifyMaxOpacitySliderValue: () => {
-        measuringToolComponent.opacitySlider()
-            .find('[role="slider"]')
-            .should('have.attr', 'aria-valuemax', 100);
-    },
-
-    /**
-     * @param {number} value holds value of slider
-     * @description function verifies value in slider
-     */
-    verifyOpacitySliderValue: (value) => {
-        measuringToolComponent.opacitySlider()
-            .find('input')
-            .should('have.value', value);
-    },
-
-    /**
-     * @param {number} value holds value to be added in input field
-     * @description function adds value in input field
-     */
-    enterInputToOpacityInputField: (value) => {
-        measuringToolComponent.opacityInputField()
-            .clear()
-            .type(value);
-        measuringToolComponent.opacityInputField()
-            .should('have.value', value);
-    },
-
-    clickOnOpacitySlider: () => {
-        measuringToolComponent.opacitySlider()
-            .click();
-    },
-
     /**
      * @param {number} colorIndex index for color block
      * @description function verifies selected state of color block