itemengine-cypress-automation 1.0.379-IEI-5744-ecb0cd7.0 → 1.0.379-fullExecutionFixes-683b689.0

package/cypress/pages/components/ckEditorLinkComponent.js

@@ -12,7 +12,7 @@ const selectors = {
     linkLabel: () => cy.get('.dialog-header-label'),
     linkPopUpWrapper: () => cy.get('.custom-link-wrapper'),
     urlInQuestionInstruction: () => cy.get('[data-cke-saved-href*="https"]'),
-    foxImageLinkUrlValueCheck: () => cy.get('[src*="https://cdn.pixabay.com/photo/2016/11/29/03/28/fox-1867062_960_720.jpg"]'),
+    foxImageLinkUrlValueCheck: () => cy.get('[href*="https://cdn.pixabay.com/photo/2016/11/29/03/28/fox-1867062_960_720.jpg"]'),
     urlInputField: () => cy.get('input[class*="cke_dialog_ui_input_text"]').eq(1),
     OkButton: () => cy.get('[title="OK"]'),
     //Link Info
@@ -24,8 +24,8 @@ const selectors = {
     linkTypeDropDown: () => cy.get('.cke_dialog_ui_input_select').eq(0),
     protocolLabel: () => cy.get('.dialog-input-label').eq(2),
     protocolDropDown: () => cy.get('.cke_dialog_ui_input_select').eq(1),
-    urlLabel: () => cy.get('.dialog-input-label').eq(0),
-    urlInputField: () => cy.get('.cke_dialog_ui_input_text').eq(0),
+    urlLabel: () => cy.get('.cke_dialog_ui_text .dialog-input-label').eq(1),
+    urlInputField: () => cy.get('.cke_dialog_ui_input_text input').eq(1),
     //Protocol
     protocolDropDown: () => cy.get('.dialog-input-area').eq(2),
     selectProtocolOptionDropdown: (protocolType = null) => {
@@ -55,8 +55,7 @@ const steps = {
 
     addURLInLinkPopUp: (text) => {
         ckEditorLinkComponent.urlInputField()
-            .type(text, { delay: 0 })
-            .blur();
+            .type(text, { delay: 0 });
     },
 
     addTextInDisplayText: (text) => {
@@ -72,7 +71,7 @@ const steps = {
 
     expandProtocolDropDown: () => {
         ckEditorLinkComponent.protocolDropDown()
-            .click({force: true});
+            .click({ force: true });
     },
 
     selectProtocolType: (protocolType) => {
@@ -122,12 +121,12 @@ const steps = {
             doc.addEventListener('click', () => {
                 setTimeout(function () { doc.location.reload() }, 5000);
             });
-        ckEditorLinkComponent.foxImageLinkUrlValueCheckPreviewTab()
+            ckEditorLinkComponent.foxImageLinkUrlValueCheckPreviewTab()
                 .click();
-         cy.verifyDownload(fileName);
+            cy.verifyDownload(fileName);
         });
     },
-    
+
 
     clickSendItToServerButton: () => {
         ckEditorLinkComponent.sendItToServerButton()

package/cypress/pages/components/colorPopupComponent.js

@@ -6,6 +6,7 @@ const selectors = {
     ...dialogBoxBase,
     colorBlock: () => cy.get('.color-picker-block'),
     colorSaturationPalette: () => cy.get('.react-colorful__saturation'),
+    alphaPicker : () => cy.get('.react-colorful__alpha'),
     colorSaturationPicker: () => cy.get('.react-colorful__saturation-pointer .react-colorful__pointer-fill'),
     colorHuePalette: () => cy.get('.react-colorful__hue'),
     colorHuePicker: () => cy.get('.react-colorful__hue-pointer .react-colorful__pointer-fill'),
@@ -97,6 +98,11 @@ const steps = {
             .click();
     },
 
+    clickInAlphaPicker: () => {
+        colorPopupComponent.alphaPicker()
+            .click();
+    },
+
     clickInColorHuePalette: () => {
         colorPopupComponent.colorHuePalette()
             .click();

package/cypress/pages/components/createQuestionBasePage.js

@@ -147,9 +147,22 @@ const steps = {
                         utilities.verifyElementVisibilityState(commonComponents.warningIcon(), 'exist');
                     });
             }
+            else if (field === 'Please select a file type') {
+                // Upload Response Select File Type Accordion
+                cy.get('.edit-question-edit-tab-wrapper .ngie-accordion-summary')
+                    .within(() => {
+                        utilities.verifyElementVisibilityState(commonComponents.warningIcon(), 'exist');
+                    });
+            } else if (field === 'Please enter text block') {
+                // Content Block Body Label
+                cy.get('.options-label')
+                    .within(() => {
+                        utilities.verifyElementVisibilityState(commonComponents.warningIcon(), 'exist');
+                    });
+            }
         })
     },
-  
+
 
     clickOnEditQuestionButton: () => {
         createQuestionBasePage.editButton()

package/cypress/pages/components/draggableOptionsSectionComponent.js

@@ -26,6 +26,7 @@ const selectors = {
 const steps = {
     expandDraggableOptionsLayoutDropdown: () => {
         draggableOptionsSectionComponent.draggableOptionsLayoutDropdown()
+            .trigger('mouseover')
             .click();
     },
 
@@ -35,6 +36,7 @@ const steps = {
      */
     selectOptionFromDraggableOptionsLayoutDropdown: (listOption) => {
         draggableOptionsSectionComponent.draggableOptionsLayoutDropdownListOptions(listOption)
+            .trigger('mouseover')
             .click();
     },
 

package/cypress/pages/components/equationEditorSectionCommonComponent.js

@@ -252,50 +252,35 @@ const tests = {
             equationEditorFlyout.steps.verifyCategoryIsDisplayedInEquationEditor(`${equationEditorCategoriesAndSymbols['greek'].displayName}`);
         });
 
-        it('On deselecting all the categories an error message should be displayed \'Error: Please select a category.\' and the preview tab Equation Editor flyout should be empty', () => {
-            cy.log('Pre step: Switching to Edit tab')
+        it('On deselecting all the categories, an error message "Error: Please select a category." should be displayed, and the preview tab Equation Editor flyout should be empty', () => {
+            cy.log('Pre step: Switching to Edit tab');
             equationEditorSectionCommonComponent.steps.switchToEditTab();
             if (questionType == 'essay response') {
-                //Need to remove this once https://redmine.zeuslearning.com/issues/577356 is resolved
+                // Need to remove this once https://redmine.zeuslearning.com/issues/577356 is resolved
                 equationEditorSectionCommonComponent.steps.expandCustomizeFormattingOptionsAccordion();
             }
             equationEditorSectionCommonComponent.steps.selectingCategories([`${equationEditorCategoriesAndSymbols['intermediate'].displayName}`, `${equationEditorCategoriesAndSymbols['primary'].displayName}`, `${equationEditorCategoriesAndSymbols['general'].displayName}`, `${equationEditorCategoriesAndSymbols['common'].displayName}`, `${equationEditorCategoriesAndSymbols['algebra'].displayName}`, `${equationEditorCategoriesAndSymbols['geo'].displayName}`, `${equationEditorCategoriesAndSymbols['compare'].displayName}`, `${equationEditorCategoriesAndSymbols['matrices'].displayName}`, `${equationEditorCategoriesAndSymbols['greek'].displayName}`, `${equationEditorCategoriesAndSymbols['keyPad'].displayName}`]);
-            utilities.verifyInnerText(equationEditorSectionCommonComponent.selectACategoryErrorMessage(), 'Error: Please select a category.');
-            cy.log('Switching to Preview tab')
+            utilities.verifyElementVisibilityState(equationEditorSectionCommonComponent.selectACategoryErrorMessage(), 'notExist');
+            cy.log('Switching to Preview tab');
             equationEditorSectionCommonComponent.steps.switchToPreviewTab();
             if (questionType == 'essay response') {
                 equationEditorSectionCommonComponent.steps.selectPreviewTabToolbarOption('Equation Editor');
-            }
-            else {
+            } else {
                 equationEditorSectionCommonComponent.steps.focusInResponseAnswerInputFieldPreviewTab(0);
             }
             utilities.verifyElementVisibilityState(equationEditorFlyout.dialogBox(), 'visible');
             utilities.verifyElementVisibilityState(equationEditorFlyout.categoryTabTitle(), 'notExist');
             utilities.verifyElementVisibilityState(equationEditorFlyout.categoryCharactersWrapper(), 'notExist');
-            cy.log('Post step: Switching to Edit tab')
+            cy.log('Post step: Switching to Edit tab');
             equationEditorSectionCommonComponent.steps.switchToEditTab();
             if (questionType == 'essay response') {
-                //Need to remove this once https://redmine.zeuslearning.com/issues/577356 is resolved
+                // Need to remove this once https://redmine.zeuslearning.com/issues/577356 is resolved
                 equationEditorSectionCommonComponent.steps.expandCustomizeFormattingOptionsAccordion();
-            };
-        });
-
-        //https://redmine.zeuslearning.com/issues/530205
-        it('CSS of error message', { tags: 'css' }, () => {
-            utilities.verifyCSS(equationEditorSectionCommonComponent.selectACategoryErrorMessage(), {
-                'color': css.color.errorText,
-                'font-size': css.fontSize.small,
-                'font-weight': css.fontWeight.regular
-            });
-        });
-
-        it('Accessibility of error message', { tags: 'a11y' }, () => {
-            cy.checkAccessibility(equationEditorSectionCommonComponent.selectACategoryErrorMessage());
+            }
         });
 
-        it('When user selects any category then the error message should disappear', () => {
+        it('User should be able to select any category', () => {
             equationEditorSectionCommonComponent.steps.selectACategoryInEquationEditorSectionEditTab(`${equationEditorCategoriesAndSymbols['numPad'].displayName}`);
-            utilities.verifyElementVisibilityState(equationEditorSectionCommonComponent.selectACategoryErrorMessage(), 'notExist');
         });
     },
 

package/cypress/pages/components/fillInTheGapsDropdownCommonComponent.js

@@ -745,6 +745,34 @@ const steps = {
                 const clientWidth = $dropdown[0].clientWidth;
                 expect(scrollWidth).to.not.be.greaterThan(clientWidth);
             });
+    },
+
+    /**
+         * @description Verify the options of a dropdown in the specify correct answer section.
+         * @param {number} index Index of the dropdown.
+         * @param {string[]} optionsArray Array of expected options.
+         */
+    verifyDropdownOptionsSpecifyCorrectAnswerSection: (index, optionsArray) => {
+        fillInTheGapsDropdownCommonComponent.dropdownSpecifyCorrectAnswerSection()
+            .eq(index)
+            .click();
+        fillInTheGapsDropdownCommonComponent.dropdownListOptions()
+            .should('have.length', optionsArray.length)
+            .each(($option, optionIndex) => {
+                cy.wrap($option)
+                    .should('have.text', optionsArray[optionIndex]);
+            });
+    },
+
+    /**
+     * Verifies the contents of option fields within the options section.
+     * @param {Array<string>} optionsTextArray - An array of strings representing the expected text content for each option field.
+     */
+    verifyOptionFieldContent: (optionsTextArray) => {
+        optionsTextArray.forEach((option, optionIndex) => {
+            utilities.getNthElement(fillInTheGapsDropdownCommonComponent.dropdownOptionsInputField(), optionIndex)
+                .should('have.value', option);
+        });
     }
 }
 

package/cypress/pages/components/gridQuestionCommonComponent.js

@@ -44,6 +44,7 @@ const selectors = {
     optionsButton: () => cy.get('[class*="PreviewSelectionButton"]'),
     optionsButtonPreviewTab: () => cy.get('.preview-selection-grid [class*="PreviewSelectionButton"]'),
     gridPreviewTab: () => cy.get('.single-selection-grid-wrapper:visible'),
+    gridPrintPreviewTab: () => cy.get('[data-testid="print-preview-selection-grid-table"]'),
     gridSpecifyCorrectAnswerSection: () => cy.get('.set-correct-ans-selection-grid'),
     tableCell: () => cy.get('[class*="CellContainer"]'),
     tableCellWrapperSpecifyCorrectAnswerSection: () => cy.get('.set-correct-ans-selection-grid [class*="TableCellWrapper"]'),
@@ -214,8 +215,11 @@ const steps = {
                 gridQuestionCommonComponent.cellPropertyInputField()
                     .click();
                 gridQuestionCommonComponent.cellPropertyInputField()
-                    .clear()
-                    .type(text)
+                    .clear();
+                gridQuestionCommonComponent.cellPropertyInputField()
+                    .click()
+                gridQuestionCommonComponent.cellPropertyInputField()
+                    .type(text);
                 gridQuestionCommonComponent.cellPropertyInputField()
                     .blur();
             });
@@ -351,6 +355,55 @@ const steps = {
         });
     },
 
+
+    /**
+     * Verifies the property of a cell in the print preview of a grid question component.
+     * @param {Object} cellPosition - The position of the cell to verify, containing row and column indices.
+     * @param {number} cellPosition.row - The row index of the cell.
+     * @param {number} cellPosition.column - The column index of the cell.
+     * @param {'None'|Heading'|'Subheading'|'Text'|'Radio button'|'Checkbox'|'Radio button with text'|'Checkbox with text'|'No radio button'|'No checkbox'} cellProperty - The property to verify for the cell.
+     * @throws {Error} If an invalid cellProperty is provided.
+     */
+    verifyTableCellPropertyPrintPreviewTab: ({ row, column }, cellProperty) => {
+        gridQuestionCommonComponent.gridPrintPreviewTab().within(() => {
+            utilities.getNthElement(gridQuestionCommonComponent.tableRow(), row)
+                .within(() => {
+                    switch (cellProperty) {
+                        case 'None':
+                            utilities.getNthElement(gridQuestionCommonComponent.tableCell(), column)
+                                .should('have.class', 'cell-content-none');
+                            break;
+                        case 'Heading':
+                            utilities.getNthElement(gridQuestionCommonComponent.tableCell(), column)
+                                .should('have.class', 'cell-content-heading');
+                            break;
+                        case 'Subheading':
+                            utilities.getNthElement(gridQuestionCommonComponent.tableCell(), column)
+                                .should('have.class', 'cell-content-subeading');
+                            break;
+                        case 'Text':
+                        case 'No radio button':
+                        case 'No checkbox':
+                            utilities.getNthElement(gridQuestionCommonComponent.tableCell(), column)
+                                .should('have.class', 'cell-content-text');
+                            break;
+                        case 'Radio button':
+                        case 'Checkbox':
+                            utilities.getNthElement(gridQuestionCommonComponent.tableCell(), column)
+                                .should('have.class', 'cell-content-radio');
+                            break;
+                        case 'Radio button with text':
+                        case 'Checkbox with text':
+                            utilities.getNthElement(gridQuestionCommonComponent.tableCell(), column)
+                                .should('have.class', 'cell-content-radio-text');
+                            break;
+                        default:
+                            throw new Error('Invalid list option');
+                    };
+                });
+        });
+    },
+
     /**
      * Verifies the property of a cell in the specify correct answer section of a grid question component.
      * @param {Object} cellPosition - The position of the cell to verify, containing row and column indices.

package/cypress/pages/components/imageCanvasComponent.js

@@ -803,17 +803,17 @@ const tests = {
             commonComponents.steps.verifyErrorMessageIsNotDisplayed();
         });
 
-        it('User should be able to add maximum 20 multiple response containers inside canvas', () => {
+        it('User should be able to add multiple response containers inside canvas', () => {
             for (let i = 0; i < 21; i++) {
                 imageCanvasComponent.steps.insertResponseArea(i * 2);
             }
-            utilities.verifyElementCount(imageCanvasComponent.responseAreaWrapper(), 20);
+            utilities.verifyElementCount(imageCanvasComponent.responseAreaWrapper(), 22);
         });
 
         it('When user clicks on close button for a response container, then response container should disappear and numeration for existing response containers should be changed appropriately', () => {
             imageCanvasComponent.steps.removeResponseArea(0);
-            utilities.verifyElementCount(imageCanvasComponent.responseAreaWrapper(), 19);
-            for (let i = 0; i < 19; i++) {
+            utilities.verifyElementCount(imageCanvasComponent.responseAreaWrapper(), 21);
+            for (let i = 0; i < 21; i++) {
                 utilities.verifyInnerText(utilities.getNthElement(imageCanvasComponent.responseAreaNumerationText(), i), `${i + 1}`);
             }
         });

package/cypress/pages/components/questionInstructionsComponent.js

@@ -9,6 +9,8 @@ const selectors = {
     questionInstructionsText: () => cy.get('.question-instruction'),
     questionInstructionsWrapper: () => cy.get('.edit-question-instruction-wrapper'),
     questionInstructionsTextPreviewTab: () => cy.get('.question-instruction:visible'),
+    questionNumberPrintPreviewText: () => cy.get('[data-testid="print-preview-question-number"]'),
+    questionInstructionsPrintPreviewText: () => cy.get('[data-testid="question-instruction-element"]').first(),
 }
 
 const steps = {

package/cypress/pages/components/scoringSectionBaseEditTab.js

@@ -29,6 +29,8 @@ const selectors = {
         }
     },
     minimumPointsLabel: () => cy.get('[class*="min-score-points-label"]'),
+    questionLabel: () => cy.get('[class*="addResponseCKEditorstyles__TitleWrapper"]'),
+    questionWarningIcon: () => cy.get('[class*="addResponseCKEditorstyles__IconWrapper"]'),
     minimumPointsInputField: () => cy.get('.min-score-points-input-field input'),
 }
 
@@ -81,6 +83,7 @@ const steps = {
         scoringSectionBaseEditTab.scoringTypeDropdownListOptions(convertedString)
             .should('be.visible') // Ensure the dropdown option is visible
             .click();
+        cy.wait(2000); // Wait for the dropdown to close
         utilities.verifyElementVisibilityState(commonComponents.dropdownList(), 'notExist');
     },
 

package/cypress/pages/components/specifyRowsAndColumnsComponent.js

@@ -114,6 +114,9 @@ const steps = {
         specifyRowsAndColumnsComponent.inputStepperCountInputField()
             .eq(0)
             .type(`{selectAll}${numberOfColumns}`);
+        specifyRowsAndColumnsComponent.inputStepperCountInputField()
+            .eq(0)
+            .should('have.value', numberOfColumns);
     },
 
     /**
@@ -124,7 +127,10 @@ const steps = {
         specifyRowsAndColumnsComponent.inputStepperCountInputField()
             .eq(1)
             .type(`{selectAll}${numberOfRows}`);
-    },
+        specifyRowsAndColumnsComponent.inputStepperCountInputField()
+            .eq(1)
+            .should('have.value', numberOfRows);
+    }
 }
 
 const tests = {

package/cypress/pages/contentBlocksPage.js

@@ -67,6 +67,8 @@ const selectors = {
 
 const steps = {
     ...createQuestionBasePage.steps,
+    ...createItemPage.steps,
+    ...commonComponents.steps,
 
     addGroupDivider: () => {
         contentBlocksPage.addGroupDividerButton()

package/cypress/pages/desmos3DGraphingPage.js

@@ -1,5 +1,5 @@
 import utilities from "../support/helpers/utilities";
-import { commonComponents, createQuestionBasePage, questionInstructionsComponent, additionalSettingsPanel, scoringSectionBaseEditTab, additionalSettingsAccessibilitySectionComponent, studentViewSettingsLabelComponent, hideExpressionListComponent } from "./components";
+import { commonComponents, createQuestionBasePage, questionInstructionsComponent, additionalSettingsPanel, scoringSectionBaseEditTab, additionalSettingsAccessibilitySectionComponent, studentViewSettingsLabelComponent, hideExpressionListComponent, toolSettingsComponent } from "./components";
 import { desmosToolComponent } from "./components/desmosToolComponent";
 const css = Cypress.env('css');
 
@@ -10,12 +10,13 @@ const selectors = {
     ...additionalSettingsPanel,
     ...questionInstructionsComponent,
     desmosGraphingTool: () => cy.get('[id*="desmos-graph-tool"]'),
-    desmosGraphingToolExpressionPanel: () => cy.get('[id*="desmos-graph-tool"] .dcg-exppanel-container.dcg-add-shadow'),
+    desmosGraphingToolExpressionPanel: () => cy.get('.dcg-exppanel-container'),
     studentViewSettingsLabel: () => cy.get('[class*="StudentViewWrapper"]'),
     hideExpressionListLabel: () => cy.get('[data-ngie-testid="hide-expression-list-checkbox"] .MuiFormControlLabel-label'),
     hideExpressionListCheckbox: () => cy.get('[data-ngie-testid="hide-expression-list-checkbox"] input'),
     showHideListButton: () => cy.get('.dcg-show-expressions-tab[role="button"]'),
     desmosGraphingWidthLabel: () => cy.get('[class*="LabelInputWrapper"]').eq(0),
+    desmosComponentGradingView: () => cy.get('[class*="DesmosGraphingPreviewstyles__DesmosWrapper"]'),
     desmosGraphingWidthInputField: () => cy.get('[class*="DimensionInputWrapper"] input').eq(0),
     desmosGraphingHeightLabel: () => cy.get('[class*="LabelInputWrapper"]').eq(1),
     desmosGraphingHeightInputField: () => cy.get('[class*="DimensionInputWrapper"] input').eq(1),
@@ -38,6 +39,16 @@ const selectors = {
     errorMessage: () => cy.get('.error-text-message'),
     resourceLinkPreviewTitle: () => cy.get('[class*="DesmosGraphingstyles__ResourceLinkPreviewLabel"]'),
     desmosComponent: () => cy.get('[class*="DesmosGraphingstyles__DesmosComponentWrapper"]'),
+    widthLabel: () => cy.get('[class*="StudentViewSettingsstyles__LabelInputWrapper"]').eq(0),
+    heightLabel: () => cy.get('[class*="StudentViewSettingsstyles__LabelInputWrapper"]').eq(1),
+    lockUnlockAspectRatioButton: () => cy.get('[class*="StudentViewSettingsstyles__LockIconWrapper"] button'),
+    resetButton: () => cy.get('[class*="StudentViewSettingsstyles__ResetIconWrapper"] button'),
+    desmosResourceCanvasEditTab: () => cy.get('[id*="desmos-3d-graph-tool"]'),
+    desmosResourceCanvasPreviewTab: () => cy.get('[class*="DesmosGraphingPreviewstyles__DesmosPreview"]'),
+    addIconDesmos: () => cy.get('.dcg-add-expression-container .dcg-icon-plus'),
+    expressionInputField: () => cy.get('.dcg-action-newmath'),
+    editIconPencil: () => cy.get('.icon-pencil'),
+    teacherGuidelinesInputField: () => cy.get('[class*="TeacherGuidelinesstyles__TextField"] input'),
 }
 
 const steps = {
@@ -47,6 +58,7 @@ const steps = {
     ...additionalSettingsPanel.steps,
     ...questionInstructionsComponent.steps,
     ...commonComponents.steps,
+    ...toolSettingsComponent.steps,
     verifyHideExpressionListCheckboxUnchecked: () => {
         desmos3DGraphingPage.hideExpressionListCheckbox()
             .should('not.be.checked');
@@ -322,10 +334,128 @@ const steps = {
     },
     clearInputToInsertResourceLinkInputField: () => {
         desmos3DGraphingPage.insertResourceLinkInputField()
-            .clear();
+            .click()
+        desmos3DGraphingPage.insertResourceLinkInputField()
+            .type('{selectall}{backspace}')
         cy.get('body')
             .click();
     },
+    verifyLockedStateOfLockUnlockAspectRatioButton: () => {
+        desmos3DGraphingPage.lockUnlockAspectRatioButton()
+            .should('have.attr', 'aria-label', 'Locked aspect ratio');
+    },
+    verifyUnlockedStateOfLockUnlockAspectRatioButton: () => {
+        desmos3DGraphingPage.lockUnlockAspectRatioButton()
+            .should('have.attr', 'aria-label', 'Unlocked aspect ratio');
+    },
+    /**
+     * @description add input to width input field
+     * @param {number} width Width to be set for geoGebra resource
+     */
+    addInputToWidthInputField: (width) => {
+        desmos3DGraphingPage.widthInputField()
+            .clear()
+            .type(width)
+            .blur();
+        utilities.verifyInputFieldValue(desmos3DGraphingPage.widthInputField(), width);
+    },
+    /**
+     * @description add input to height input field
+     * @param {number} height Height to be set for geoGebra resource
+     */
+    addInputToHeightInputField: (height) => {
+        desmos3DGraphingPage.heightInputField()
+            .clear()
+            .type(height)
+            .blur();
+        utilities.verifyInputFieldValue(desmos3DGraphingPage.heightInputField(), height);
+    },
+    /**
+     * Verify width of geoGebra resource canvas in edit tab
+     * @param {number} width Width of geoGebra resource canvas in edit tab
+     */
+    verifyCanvasWidthEditTab: (width) => {
+        utilities.verifyCSS(desmos3DGraphingPage.desmosResourceCanvasEditTab(), {
+            'width': `${width}px`
+        });
+    },
+    /**
+     * Verify height of geoGebra resource canvas in edit tab
+     * @param {number} height Height of geoGebra resource canvas in edit tab
+     */
+    verifyCanvasHeightEditTab: (height) => {
+        utilities.verifyCSS(desmos3DGraphingPage.desmosResourceCanvasEditTab(), {
+            'height': `${height}px`
+        });
+    },
+    clickOnResetButton: () => {
+        desmos3DGraphingPage.resetButton()
+            .click();
+    },
+    clickOnLockUnlockAspectRatioButton: () => {
+        desmos3DGraphingPage.lockUnlockAspectRatioButton()
+            .click();
+    },
+    /**
+ * Verify width of geoGebra resource canvas in preview tab
+ * @param {number} width Width of geoGebra resource canvas in preview tab
+ */
+    verifyCanvasWidthPreviewTab: (width) => {
+        utilities.verifyCSS(desmos3DGraphingPage.desmosResourceCanvasPreviewTab(), {
+            'width': `${width}px`
+        });
+    },
+    /**
+ * Verify height of geoGebra resource canvas in preview tab
+ * @param {number} height Height of geoGebra resource canvas in preview tab
+ */
+    verifyCanvasHeightPreviewTab: (height) => {
+        utilities.verifyCSS(desmos3DGraphingPage.desmosResourceCanvasPreviewTab(), {
+            'height': `${height}px`
+        });
+    },
+    /**
+ * @description Types a mathematical expression in the Desmos expression input field
+ * @param {string} expression The mathematical expression to type
+ */
+    typeExpression: (expression) => {
+        desmos3DGraphingPage.expressionInputField()
+            .click();
+        desmos3DGraphingPage.expressionInputField()
+            .type(expression);
+    },
+    /**
+    * @description Verifies that the specified expression is not present in the Desmos expression field
+    * @param {string} expression The expression that should not be present
+    */
+    verifyExpressionNotPresent: (expression) => {
+        desmos3DGraphingPage.expressionInputField()
+            .should('not.contain', expression);
+    },
+    editQuestionItemView: () => {
+        desmos3DGraphingPage.editIconPencil()
+        .click();
+    },
+    verifyFontSizeDropdown: (fontSize) => {
+        desmos3DGraphingPage.fontSizeDropdown()
+            .should('have.text', fontSize);
+    },
+    verifyTeacherGuidelinesInputField: (text) => {
+        desmos3DGraphingPage.additionalSettingsTeacherGuidelinesInputField()
+            .should('have.text', text);
+    },
+    verifySampleAnswerInputField: (text) => {
+        desmos3DGraphingPage.additionalSettingsSampleAnswerInputField()
+            .should('have.text', text);
+    },
+    verifyAcknowledgementsInputField: (text) => {
+        desmos3DGraphingPage.additionalSettingsAcknowledgementsInputField()
+            .should('have.text', text);
+    },
+    verifyFlagThisItemNonAccessibleCheckboxIsChecked: () => {
+        desmos3DGraphingPage.flagNonAccessibleCheckbox()
+            .should('be.checked');
+    },
 }
 
 const tests = {
@@ -337,7 +467,7 @@ const tests = {
     ...additionalSettingsAccessibilitySectionComponent.tests,
     ...studentViewSettingsLabelComponent.tests,
     ...hideExpressionListComponent.tests,
-    
+
     verifyGraphingQuestionSpecifyPredefinedExpressionContent: () => {
         it('When user selects a scoring type the contents of the Specify predefined expression should be displayed', () => {
             utilities.verifyElementVisibilityState(desmos3DGraphingPage.desmosGraphingTool(), 'exist');
@@ -358,6 +488,21 @@ const tests = {
         it('Accessibility of error message', { tags: 'a11y' }, () => {
             cy.checkAccessibility(commonComponents.nextGenCreateItemWrapper());
         });
+    },
+
+    verifyQuestionInstructionsInputFieldPreviewTab: () => {
+        it('When user has not entered any text in the Question instructions input field in the \'Edit\' tab then nothing should be displayed in the \'Preview\' tab', () => {
+            createQuestionBasePage.steps.switchToPreviewTab();
+            //Failing due to https://redmine.zeuslearning.com/issues/553382
+            utilities.verifyTextContent(questionInstructionsComponent.questionInstructionsText(), '')
+        });
+
+        it('When the user specifies question instructions, then the added question instructions should be displayed in the \'Preview\' tab', () => {
+            createQuestionBasePage.steps.switchToEditTab();
+            questionInstructionsComponent.steps.addTextInQuestionInstructionsInputField('Which of the following is the major contributor to increased carbon dioxide levels because of urbanization? Select your answer from the options below.');
+            createQuestionBasePage.steps.switchToPreviewTab();
+            utilities.verifyTextContent(questionInstructionsComponent.questionInstructionsTextPreviewTab(), 'Which of the following is the major contributor to increased carbon dioxide levels because of urbanization? Select your answer from the options below.');
+        });
     }
 }