itemengine-cypress-automation 1.0.70 → 1.0.73

package/cypress/pages/createItemPage.js

@@ -1,5 +1,3 @@
-import utilities from "../support/helpers/utilities";
-
 const css = Cypress.env('css');
 
 const selectors = {
@@ -15,13 +13,7 @@ const selectors = {
     itemTitle: () => cy.get('.ItemLevel-Header'),
     tagsButton: () => cy.get('.ngie-button').contains('Tags'),
     tagsInputField: () => cy.get('.tags-chip-container'),
-    editItemPageWrapper: () => cy.get('.edit-wrapper'),
-    editItemReferenceId: () => cy.get('.edit-item-reference-id'),
-    applyChangesButton: () => cy.get('.ngie-btn-contained').contains('Apply changes'),
-    editTitleIcon: () => cy.get('.icon-pencil'),
-    titleInputField: () => cy.get('.edit-box-header-input-wrapper'),
-    submitButton: () => cy.get('[class*="StudentViewstyles__ButtonsWrapper"] button').eq(1),
-    studentViewReferenceId: () => cy.get('[class*="StudentViewstyles__ViewInfoWrapper"]')
+    settingsBtn: () => cy.get('.ngie-btn-link').eq(3)
 }
 
 const steps = {
@@ -39,23 +31,6 @@ const steps = {
         cy.visit('/item-engine/demo/create-item');
     },
 
-    /**
-   * @param {string} reference id of the question to be navigated 
-   * @description this function navigates to the edit item page of the 
-   */
-    navigateToEditItemUsingReferenceID: (reference) => {
-        cy.visit(`/item-engine/demo/edit-item/${utilities.base64Encoding(reference)}`);
-    },
-
-    navigateToEditItemPage: () => {
-        createItemPage.referenceId()
-            .invoke('text')
-            .then(text => {
-                const referenceId = text;
-                steps.navigateToEditItemUsingReferenceID(referenceId);
-            });
-    },
-
     verifyCreateItemContainerIsVisible: () => {
         createItemPage.createItemContainer()
             .should('be.visible');
@@ -80,60 +55,9 @@ const steps = {
             .should('have.text', arrayOfTags.sort().join(''));
     },
 
-    /**
-    * @param {string[]} arrayOfTags of text that need to enter in tags input field
-    * @description set tags for an item
-    */
-    setTags: (arrayOfTags) => {
-        steps.clickOnTagsButton()
-        for (let index = 0; index < arrayOfTags.length; index++) {
-            createItemPage.tagsInputField()
-                .type(`${arrayOfTags[index]}{enter}`);
-        }
-        createItemPage.applyChangesButton()
+    clickOnSettingsButton: () => {
+        createItemPage.settingsBtn()
             .click();
-    },
-
-    /**
-    * @param {string[]} value of text that need to enter in title input field
-    * @description this function enters text in title input field
-    */
-    enterTitle: (value) => {
-        createItemPage.titleInputField()
-            .type(value);
-    },
-
-    clickOnSubmitButton: () => {
-        createItemPage.submitButton()
-            .click();
-    },
-
-
-    navigateToStudentViewPage: () => {
-        createItemPage.referenceId()
-            .invoke('text')
-            .then(text => {
-                const referenceId = text;
-                steps.navigateToStudentViewUsingReferenceID(referenceId);
-            });
-    },
-
-    navigateToEditItemPageFromStudentView: () => {
-        createItemPage.studentViewReferenceId()
-            .invoke('text')
-            .then(text => {
-                let value = text;
-                let referenceId = value.split(':')[1].trim();
-                steps.navigateToEditItemUsingReferenceID(referenceId);
-            });
-    },
-
-    /**
-      * @param {string} reference id of the question to be navigated 
-      * @description this function navigates to the student view page
-      */
-    navigateToStudentViewUsingReferenceID: (reference) => {
-        cy.visit(`/item-engine/demo/render-item/student-view/${utilities.base64Encoding(reference)}`);
     }
 }
 

package/cypress/pages/dialogBoxBase.js

@@ -13,21 +13,16 @@ const selectors = {
 
 const steps = {
     allFieldsRequiredWarningPopupContents: () => {
-        dialogBoxBase.dialogBox()
-            .should('be.visible');
-        dialogBoxBase.dialogBoxTitle()
-            .verifyInnerText('Warning!');
-        dialogBoxBase.dialogBoxContent()
-            .verifyInnerText('Please fill the required fields.');
-        dialogBoxBase.buttonClose()
-            .should('be.visible');
+        utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'visible');
+        utilities.verifyInnerText(dialogBoxBase.dialogBoxTitle(), 'Warning!');
+        utilities.verifyInnerText(dialogBoxBase.dialogBoxContent(), 'Please fill the required fields.');
+        utilities.verifyElementVisibilityState(dialogBoxBase.closeButton(), 'visible');
     },
 
     closeWarningPopup: () => {
         dialogBoxBase.buttonClose()
             .click();
-        dialogBoxBase.dialogBox()
-            .should('not.exist');
+        utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'notExist');
     },
 
     clickOnAcceptButtonInDialogBox: () => {
@@ -46,21 +41,12 @@ const tests = {
         it('When user has made no edits and clicks on Save Question button, the user should get a warning popup', () => {
             createQuestionBasePage.saveQuestionButton()
                 .click();
-            dialogBoxBase.dialogBox()
-                .should('exist');
-            dialogBoxBase.dialogBoxTitle()
-                .verifyInnerText('Warning!');
-            dialogBoxBase.dialogBoxContent()
-                .verifyInnerText('Please fill the required fields.');
-            dialogBoxBase.buttonClose()
-                .should('be.visible');
+            dialogBoxBase.steps.allFieldsRequiredWarningPopupContents();
         });
 
         it('Warning popup should close on clicking the Close icon button', () => {
-            dialogBoxBase.buttonClose()
-                .click();
-            dialogBoxBase.dialogBox()
-                .should('not.exist');
+            dialogBoxBase.steps.closeWarningPopup();
+            utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'notExist');
         });
     },
 
@@ -71,7 +57,6 @@ const tests = {
             utilities.verifyInnerText(dialogBoxBase.buttonReject(), 'No, I\'d like to go back');
         });
 
-        //Failing due to https://redmine.zeuslearning.com/issues/542700
         it('CSS of popup', { tags: 'css' }, () => {
             utilities.verifyCSS(dialogBoxBase.dialogBox(), {
                 'background-color': css.color.defaultBackground,

package/cypress/pages/index.js

@@ -1,5 +1,4 @@
 export * from './multipleSelectionPage';
-export * from './singleSelectionPage';
 export * from './createItemPage';
 export * from './selectQuestionResourceToolPage';
 export * from './dialogBoxBase';
@@ -29,9 +28,7 @@ export * from './audioPlayerPage';
 export * from './highlightImagePage';
 export * from './fillInTheGapsOverImageDropdownPage';
 export * from './fillInTheGapsOverImageTextPage';
-export * from './multipleSelectionGridPage';
-export * from './singleSelectionGridPage';
-export * from './feedbackScalePage';
+export * from './itemPreviewSettingsPage';
 export * from './itemPreviewPage';
 export * from './studentViewPage';
 export * from './gradingViewPage';

package/cypress/pages/itemPreviewSettingsPage.js

@@ -0,0 +1,446 @@
+import utilities from "../support/helpers/utilities";
+import { createItemPage } from "./createItemPage";
+import { commonComponents } from "./components";
+
+const selectors = {
+    ...createItemPage,
+    headerWrapper: () => cy.get('.settings-header-wrapper'),
+    //HeadingSectionSelectors
+    settingsLabel: () => cy.get('.settings-label'),
+    cancelLabel: () => cy.get('.ngie-button').eq(0),
+    applyChangesLabel: () => cy.get('.ngie-button').eq(1),
+    //SideBySidePanelsSectionSelectors
+    sideBySidePanelsLabel: () => cy.get('[class*="SettingsTabstyles__PanelsWrapper"] .section-title-label'),
+    enableSideBySidePanelsCheckbox: () => cy.get('[data-ngie-testid="enable-side-by-side-panels-checkbox"] input'),
+    enableSideBySidePanelsLabel: () => cy.get('[data-ngie-testid="enable-side-by-side-panels-checkbox"] .MuiFormControlLabel-label'),
+    //SeparatorSectionSelectors
+    separatorsLabel: () => cy.get('[class*="SettingsTabstyles__SeparatorsWrapper"] .separator-title-label-cls'),
+    horizontalSeparatorsCheckbox: () => cy.get('[data-ngie-testid="horizontal-separator-line-between-questions-checkbox"] input'),
+    horizontalSeparatorLabel: () => cy.get('[data-ngie-testid="horizontal-separator-line-between-questions-checkbox"] .MuiFormControlLabel-label'),
+    horizontalIllustrator: () => cy.get('[class*="SettingsTabstyles__HorizontalSeparatorImg"]'),
+    verticalSeparatorWrapper: () => cy.get('[data-ngie-testid="vertical-separator-line-between-panels-checkbox"]'),
+    verticalSeparatorsCheckbox: () => cy.get('[data-ngie-testid="vertical-separator-line-between-panels-checkbox"] input'),
+    verticalSeparatorsLabel: () => cy.get('[data-ngie-testid="vertical-separator-line-between-panels-checkbox"] .MuiFormControlLabel-label'),
+    verticalSeparatorsIllustrator: () => cy.get('[class*="SettingsTabstyles__VerticalSeparatorImg"]'),
+    separatorsStyleLabel: () => cy.get('[class*="SettingsTabstyles__LabelTextWrapper"]'),
+    solidSeparatorStyleOption: () => cy.get('[data-ngie-testid="solid-toggle-button"]'),
+    dottedSeparatorStyleOption: () => cy.get('[data-ngie-testid="dotted-toggle-button"]'),
+    dashedSeparatorStyleOption: () => cy.get('[data-ngie-testid="dashed-toggle-button"]'),
+    separatorStyleWrapper: () => cy.get('[class*="SettingsTabstyles__SeparatorStyleWrapper"]'),
+    //SectionsSectionSelectors
+    sectionsLabel: () => cy.get('[class*="SettingsTabstyles__SectionsWrapper"] .section-title-label'),
+    enableSectionsCheckbox: () => cy.get('[data-ngie-testid="enable-sections-checkbox"] input'),
+    enableSectionsLabel: () => cy.get('[data-ngie-testid="enable-sections-checkbox"] .MuiFormControlLabel-label'),
+    enableSectionsInLabel: () => cy.get('[class*="SectionsComponentstyles__HeadWrapper"]').eq(0), //couldnt get unique
+    leftPanelCheckbox: () => cy.get('[data-ngie-testid="left-panel-checkbox"] input'),
+    leftPanelLabel: () => cy.get('[data-ngie-testid="left-panel-checkbox"] .MuiFormControlLabel-label'),
+    rightPanelCheckbox: () => cy.get('[data-ngie-testid="right-panel-checkbox"] input'),
+    rightPanelLabel: () => cy.get('[data-ngie-testid="right-panel-checkbox"] .MuiFormControlLabel-label'),
+    sectionsNavigationOrientationLabel: () => cy.get('.orientation-wrapper-cls [class*=SectionsComponentstyles__HeadWrapper]'),
+    horizontalRadioButton: () => cy.get('[class*="SectionsComponentstyles__OrientationWrapper"] input').eq(0),
+    horizontalLabel: () => cy.get('[class*="SectionsComponentstyles__OrientationWrapper"] .ngie-radio-label').eq(0),
+    verticalRadioButton: () => cy.get('[class*="SectionsComponentstyles__OrientationWrapper"] input').eq(1),
+    verticalLabel: () => cy.get('[class*="SectionsComponentstyles__OrientationWrapper"] .ngie-radio-label').eq(1),
+    sectionsNavigationStyleLabel: () => cy.get('[class*="SectionsComponentstyles__StyleWrapper"] [class*="SectionsComponentstyles__HeadWrapper"]'),
+    underlinedRadioButton: () => cy.get('[class*="SectionsComponentstyles__StyleWrapper"] input').eq(0),
+    underlinedLabel: () => cy.get('[class*="SectionsComponentstyles__StyleWrapper"] .ngie-radio-label').eq(0),
+    separatedUsingDividersRadioButton: () => cy.get('[class*="SectionsComponentstyles__StyleWrapper"] input').eq(1),
+    separatedUsingDividersLabel: () => cy.get('[class*="SectionsComponentstyles__StyleWrapper"] .ngie-radio-label').eq(1),
+    numberedRadioButton: () => cy.get('[class*="SectionsComponentstyles__StyleWrapper"] input').eq(2),
+    numberedLabel: () => cy.get('[class*="SectionsComponentstyles__StyleWrapper"] .ngie-radio-label').eq(2),
+    sectionsNavigationAlignmentLabel: () => cy.get('[class*="SectionsComponentstyles__AlignmentWrapper"] [class*="SectionsComponentstyles__HeadWrapper"]'),
+    leftAlignedRadioButton: () => cy.get('[class*="SectionsComponentstyles__AlignmentWrapper"] input').eq(0),
+    leftAlignedLabel: () => cy.get('[class*="SectionsComponentstyles__AlignmentWrapper"] .ngie-radio-label').eq(0),
+    centerAlignedRadioButton: () => cy.get('[class*="SectionsComponentstyles__AlignmentWrapper"]  input').eq(1),
+    centerAlignedLabel: () => cy.get('[class*="SectionsComponentstyles__AlignmentWrapper"] .ngie-radio-label').eq(1),
+    rightAlignedRadioButton: () => cy.get('[class*="SectionsComponentstyles__AlignmentWrapper"] input').eq(2),
+    rightAlignedLabel: () => cy.get('[class*="SectionsComponentstyles__AlignmentWrapper"] .ngie-radio-label').eq(2),
+    enableSectionsContentWrapper: () => cy.get('[class*="SectionsComponentstyles__SectionConfigWrapper"]'),
+    //SpacingSectionSelectors
+    spaceBetweenQuestionsLabel: () => cy.get('[class*="SettingsTabstyles__SpaceWrapper"] .section-title-label'),
+    spacingLabel: () => cy.get('#Spacing-dropdown-label'),
+    spacingDropdown: () => cy.get('#Spacing-select'),
+    spacingDropdownListOptions: (ariaLabel = null) => {
+        if (ariaLabel) {
+            return cy.get(`[aria-labelledby*="Spacing"][aria-labelledby*="dropdown-label"] li[role="option"][aria-label*="${ariaLabel}"]`)
+        } else {
+            return cy.get('[aria-labelledby*="Spacing"][aria-labelledby*="dropdown-label"] li[role="option"]')
+        }
+    },
+    //MultiLanguageSupportSectionSelectors
+    multiLanguageSupportLabel: () => cy.get('[class*="SettingsTabstyles__LanguageSupportWrapper"] .section-title-label'),
+    languagesCheckbox: () => cy.get('[data-ngie-testid="this-item-is-also-available-in-other-languages-checkbox"] input'),
+    languagesLabel: () => cy.get('[data-ngie-testid="this-item-is-also-available-in-other-languages-checkbox"] .MuiFormControlLabel-label'),
+    //AccessibilitySectionSelectors
+    accessibilityLabel: () => cy.get('[class*="SettingsTabstyles__AccessibilityWrapper"] .section-title-label'),
+    flagNonAccessibleCheckbox: () => cy.get('[data-ngie-testid="flag-this-item-as-non-accessible-checkbox"] input'),
+    flagNonAccessibleLabel: () => cy.get('[data-ngie-testid="flag-this-item-as-non-accessible-checkbox"] .MuiFormControlLabel-label'),
+    alternateAccessibleIdLabel: () => cy.get('.text-field-label'),
+    alternateAccessibleIdInputField: () => cy.get('.additional-option-placeholder-input input'),
+    //MiscellaneousSectionSelectors
+    miscellaneousLabel: () => cy.get('[class*="SettingsTabstyles__MiscellaneousWrapper"] .section-title-label'),
+    disableCutCopyAndPasteCheckbox: () => cy.get('[data-ngie-testid="disable-cut,-copy-and-paste-for-all-questions-checkbox"] input'),
+    disableCutCopyAndPasteLabel: () => cy.get('[data-ngie-testid="disable-cut,-copy-and-paste-for-all-questions-checkbox"] .MuiFormControlLabel-label '),
+    randomizeQuestionsOrderCheckbox: () => cy.get('[data-ngie-testid="randomize-questions-order-checkbox"] input'),
+    randomizeQuestionsOrderLabel: () => cy.get('[data-ngie-testid="randomize-questions-order-checkbox"] .MuiFormControlLabel-label'),
+    roundNegativeScoresToZeroCheckbox: () => cy.get('[data-ngie-testid="round-negative-scores-to-zero-checkbox"] input'),
+    roundNegativeScoresToZeroLabel: () => cy.get('[data-ngie-testid="round-negative-scores-to-zero-checkbox"] .MuiFormControlLabel-label')
+};
+
+const steps = {
+    ...createItemPage.steps,
+    
+    verifyEnableSideBySidePanelsCheckboxUnchecked: () => {
+        itemPreviewSettingsPage.enableSideBySidePanelsCheckbox()
+            .should('not.be.checked');
+    },
+
+    checkEnableSideBySidePanelsCheckbox: () => {
+        itemPreviewSettingsPage.enableSideBySidePanelsCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    verifyVerticalSeparatorIsEnabled: () => {
+        itemPreviewSettingsPage.verticalSeparatorsCheckbox()
+            .should('be.enabled');
+        itemPreviewSettingsPage.verticalSeparatorsLabel()
+            .should('not.have.class', 'Mui-disabled');
+    },
+
+    uncheckEnableSideBySidePanelsCheckbox: () => {
+        itemPreviewSettingsPage.enableSideBySidePanelsCheckbox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    verifyVerticalSeparatorIsDisabled: () => {
+        itemPreviewSettingsPage.verticalSeparatorsCheckbox()
+            .should('be.disabled');
+        itemPreviewSettingsPage.verticalSeparatorsLabel()
+            .should('have.class', 'Mui-disabled');
+    },
+
+    verifyHorizontalSeparatorCheckboxUnchecked: () => {
+        itemPreviewSettingsPage.horizontalSeparatorsCheckbox()
+            .should('not.be.checked');
+    },
+
+    verifyVerticalSeparatorCheckboxUnchecked: () => {
+        itemPreviewSettingsPage.verticalSeparatorsCheckbox()
+            .should('not.be.checked');
+    },
+
+    checkHorizontalSeparatorCheckbox: () => {
+        itemPreviewSettingsPage.horizontalSeparatorsCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    uncheckHorizontalSeparatorCheckbox: () => {
+        itemPreviewSettingsPage.horizontalSeparatorsCheckbox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    checkVerticalSeparatorCheckbox: () => {
+        itemPreviewSettingsPage.verticalSeparatorsCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    uncheckVerticalSeparatorCheckbox: () => {
+        itemPreviewSettingsPage.verticalSeparatorsCheckbox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    verifySeparatorStyleSectionContent: () => {
+        utilities.verifyInnerText(itemPreviewSettingsPage.separatorsStyleLabel(), 'Separator style');
+        utilities.verifyElementVisibilityState(itemPreviewSettingsPage.separatorsStyleLabel(), 'visible');
+        utilities.verifyInnerText(itemPreviewSettingsPage.solidSeparatorStyleOption(), 'Solid');
+        utilities.verifyElementVisibilityState(itemPreviewSettingsPage.solidSeparatorStyleOption(), 'visible');
+        utilities.verifyInnerText(itemPreviewSettingsPage.dottedSeparatorStyleOption(), 'Dotted');
+        utilities.verifyElementVisibilityState(itemPreviewSettingsPage.dottedSeparatorStyleOption(), 'visible');
+        utilities.verifyInnerText(itemPreviewSettingsPage.dashedSeparatorStyleOption(), 'Dashed');
+        utilities.verifyElementVisibilityState(itemPreviewSettingsPage.dashedSeparatorStyleOption(), 'visible');
+    },
+
+    verifyEnableSectionsCheckboxUnchecked: () => {
+        itemPreviewSettingsPage.enableSectionsCheckbox()
+            .should('not.be.checked');
+    },
+
+    checkEnableSectionsCheckbox: () => {
+        itemPreviewSettingsPage.enableSectionsCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    uncheckEnableSectionsCheckbox: () => {
+        itemPreviewSettingsPage.enableSectionsCheckbox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    verifyLeftPanelLabelAndCheckboxIsEnabled: () => {
+        itemPreviewSettingsPage.leftPanelCheckbox()
+            .should('be.enabled');
+        itemPreviewSettingsPage.leftPanelLabel()
+            .should('not.have.class', 'Mui-disabled');
+    },
+
+    verifyLeftPanelCheckboxIsSelected: () => {
+        itemPreviewSettingsPage.leftPanelCheckbox()
+            .should('be.checked')
+    },
+
+    verifyRightPanelLabelAndCheckboxIsEnabled: () => {
+        itemPreviewSettingsPage.rightPanelCheckbox()
+            .should('be.enabled');
+        itemPreviewSettingsPage.rightPanelLabel()
+            .should('not.have.class', 'Mui-disabled');
+    },
+
+    verifyLeftPanelLabelAndCheckboxIsDisabled: () => {
+        itemPreviewSettingsPage.leftPanelCheckbox()
+            .should('be.disabled');
+        itemPreviewSettingsPage.leftPanelLabel()
+            .should('have.class', 'Mui-disabled');
+    },
+
+    verifyRightPanelLabelAndCheckboxIsDisabled: () => {
+        itemPreviewSettingsPage.rightPanelCheckbox()
+            .should('be.disabled');
+        itemPreviewSettingsPage.rightPanelLabel()
+            .should('have.class', 'Mui-disabled');
+    },
+
+    verifyDisabledLeftPanelTooltip: () => {
+        itemPreviewSettingsPage.leftPanelCheckbox()
+            .trigger('mouseover', { force: true });
+        commonComponents.tooltipText()
+            .should('have.text', 'Please enable panels');
+        itemPreviewSettingsPage.leftPanelCheckbox()
+            .trigger('mouseout', { force: true });
+        commonComponents.tooltipText()
+            .should('not.exist');
+    },
+
+    verifyDisabledRightPanelTooltip: () => {
+        itemPreviewSettingsPage.rightPanelCheckbox()
+            .trigger('mouseover', { force: true });
+        commonComponents.tooltipText()
+            .should('have.text', 'Please enable panels');
+        itemPreviewSettingsPage.rightPanelCheckbox()
+            .trigger('mouseout', { force: true });
+        commonComponents.tooltipText()
+            .should('not.exist');
+    },
+
+    verifyVerticalNavigationOrientationIsEnabled: () => {
+        itemPreviewSettingsPage.verticalRadioButton()
+            .should('be.enabled');
+        itemPreviewSettingsPage.verticalLabel()
+            .parent()
+            .should('not.have.class', 'radio-option-disabled');
+    },
+
+    selectVerticalOrientationRadioButton: () => {
+        itemPreviewSettingsPage.verticalRadioButton()
+            .click();
+        itemPreviewSettingsPage.verticalRadioButton()
+            .should('be.checked');
+    },
+
+    verifySectionsNavigationStyleSectionIsDisabled: () => {
+        const sectionNavigationAlignmentOptionsLabel = [itemPreviewSettingsPage.leftAlignedLabel, itemPreviewSettingsPage.centerAlignedLabel, itemPreviewSettingsPage.rightAlignedLabel];
+        const sectionNavigationAlignmentOptionsRadioButton = [itemPreviewSettingsPage.leftAlignedRadioButton, itemPreviewSettingsPage.centerAlignedRadioButton, itemPreviewSettingsPage.rightAlignedRadioButton];
+        sectionNavigationAlignmentOptionsRadioButton.forEach((option) => {
+            option()
+                .should('be.disabled');
+        });
+        sectionNavigationAlignmentOptionsLabel.forEach((option) => {
+            option()
+                .parent()
+                .should('have.class', 'radio-option-disabled');
+        });
+    },
+
+    verifySectionsNavigationStyleSectionIsEnabled: () => {
+        const sectionNavigationAlignmentOptionsLabel = [itemPreviewSettingsPage.leftAlignedLabel, itemPreviewSettingsPage.centerAlignedLabel, itemPreviewSettingsPage.rightAlignedLabel];
+        const sectionNavigationAlignmentOptionsRadioButton = [itemPreviewSettingsPage.leftAlignedRadioButton, itemPreviewSettingsPage.centerAlignedRadioButton, itemPreviewSettingsPage.rightAlignedRadioButton];
+        sectionNavigationAlignmentOptionsRadioButton.forEach((option) => {
+            option()
+                .should('be.enabled');
+        });
+        sectionNavigationAlignmentOptionsLabel.forEach((option) => {
+            option()
+                .parent()
+                .should('not.have.class', 'radio-option-disabled');
+        });
+    },
+
+    selectHorizontalOrientationRadioButton: () => {
+        itemPreviewSettingsPage.horizontalRadioButton()
+            .click()
+            .should('be.checked');
+    },
+
+    verifyVerticalNavigationOrientationIsDisabled: () => {
+        itemPreviewSettingsPage.verticalRadioButton()
+            .should('be.disabled');
+        itemPreviewSettingsPage.verticalLabel()
+            .parent()
+            .should('have.class', 'radio-option-disabled');
+    },
+
+    verifyDisableCutCopyAndPasteCheckboxIsUnchecked: () => {
+        itemPreviewSettingsPage.disableCutCopyAndPasteCheckbox()
+            .should('not.be.checked');
+    },
+
+    verifyRandomizeQuestionsOrderCheckboxIsUnchecked: () => {
+        itemPreviewSettingsPage.randomizeQuestionsOrderCheckbox()
+            .should('not.be.checked');
+    },
+
+    verifyRoundNegativeScoresCheckboxIsUnchecked: () => {
+        itemPreviewSettingsPage.roundNegativeScoresToZeroCheckbox()
+            .should('not.be.checked');
+    },
+
+    checkDisableCutCopyAndPasteCheckbox: () => {
+        itemPreviewSettingsPage.disableCutCopyAndPasteCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    checkRoundNegativeScoresCheckbox: () => {
+        itemPreviewSettingsPage.roundNegativeScoresToZeroCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    checkRandomizeQuestionsOrderCheckbox: () => {
+        itemPreviewSettingsPage.randomizeQuestionsOrderCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    uncheckDisableCutCopyAndPasteCheckbox: () => {
+        itemPreviewSettingsPage.disableCutCopyAndPasteCheckbox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    uncheckRoundNegativeScoresCheckbox: () => {
+        itemPreviewSettingsPage.roundNegativeScoresToZeroCheckbox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    uncheckRandomizeQuestionsOrderCheckbox: () => {
+        itemPreviewSettingsPage.randomizeQuestionsOrderCheckbox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    verifyFlagThisItemNonAccessibleCheckboxIsUnchecked: () => {
+        itemPreviewSettingsPage.flagNonAccessibleCheckbox()
+            .should('not.be.checked');
+    },
+
+    checkFlagThisItemNonAccessibleCheckbox: () => {
+        itemPreviewSettingsPage.flagNonAccessibleCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    uncheckFlagThisItemNonAccessibleCheckbox: () => {
+        itemPreviewSettingsPage.flagNonAccessibleCheckbox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    /**
+     * @param {string} inputText text to be entered in Alternate accessible item ID input field
+     * @description this function is used to add input to the Alternate accessible item ID input field
+     */
+    verifyAlternateAccessibleIdInputFieldText: (inputText) => {
+        itemPreviewSettingsPage.alternateAccessibleIdInputField()
+            .type(`${inputText}`);
+        itemPreviewSettingsPage.alternateAccessibleIdInputField()
+            .should('have.attr', 'value', `${inputText}`);
+    },
+
+    verifyThisItemIsAlsoAvailableInOtherLanguagesCheckboxIsUnchecked: () => {
+        itemPreviewSettingsPage.languagesCheckbox()
+            .should('not.be.checked');
+    },
+
+    checkThisItemIsAlsoAvailableInOtherLanguagesCheckbox: () => {
+        itemPreviewSettingsPage.languagesCheckbox()
+            .click()
+            .should('be.checked');
+    },
+
+    uncheckThisItemIsAlsoAvailableInOtherLanguagesCheckbox: () => {
+        itemPreviewSettingsPage.languagesCheckbox()
+            .click()
+            .should('not.be.checked');
+    },
+
+    verifyHorizontalRadioButtonIsSelected: () => {
+        itemPreviewSettingsPage.horizontalRadioButton()
+            .should('be.checked');
+    },
+
+    verifyUnderlinedRadioButtonIsSelected: () => {
+        itemPreviewSettingsPage.underlinedRadioButton()
+            .should('be.checked');
+    },
+
+    verifyLeftAlignedRadioButtonIsSelected: () => {
+        itemPreviewSettingsPage.leftAlignedRadioButton()
+            .should('be.checked');
+    },
+
+    /**
+     * 
+     * @param {array} spacingOptionsArray array containing options of spacing dropdown list
+     * @description this function is used to verify inner text of expanded spacing dropdown list options
+     */
+    verifySpacingDropdownListOptions: (spacingOptionsArray) => {
+        spacingOptionsArray.forEach((option, count) => {
+            itemPreviewSettingsPage.spacingDropdownListOptions()
+                .eq(count)
+                .should('have.text', option);
+        });
+    },
+
+    verifyDefaultSpacingIsSelected: () => {
+        itemPreviewSettingsPage.spacingDropdown()
+            .contains('Default');
+    },
+
+    clickSpacingDropdownList: () => {
+        itemPreviewSettingsPage.spacingDropdown()
+            .click();
+    },
+
+    /**
+     * @param {string} spacingOption text is the option that has to be selected from expanded spacing dropdown list
+     * @description this function is used to select particular option from expanded spacing dropdown list
+     */
+    selectOptionFromSpacingDropdown: (spacingOption) => {
+        itemPreviewSettingsPage.spacingDropdownListOptions()
+            .contains(`${spacingOption}`)
+            .click();
+    }
+};
+
+export const itemPreviewSettingsPage = {
+    ...selectors,
+    steps
+};