itemengine-cypress-automation 1.0.203-31stMayFixes-16985aa.0 → 1.0.204-graphQLUpdate-b0c0036.0

package/cypress/e2e/ILC/ImageHighlight/singleMultipleSelection.js

@@ -0,0 +1,99 @@
+import { imageHighlightPage } from "../../../pages";
+import { uploadImageSectionComponent, singleMultipleSelectionModeComponent } from "../../../pages/components";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+
+const flowerHighlightRegion = [[30, 10], [30, 20], [45, 20], [45, 10]];
+const branchesHighlightRegion = [[45, 45], [45, 55], [57, 55], [57, 45]];
+const leafHighlightRegion = [[26, 26], [26, 36], [48, 36], [48, 26]];
+
+describe('image Highlight: Set correct answer toggles', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Single Multiple selection: Edit tab content', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to image highlight question type');
+            imageHighlightPage.steps.navigateToCreateQuestion('image highlight');
+        });
+
+        singleMultipleSelectionModeComponent.tests.verifySingleMultipleSelectionModeContentCSSandA11y();
+    });
+
+    describe('Single Multiple selection: Edit tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to image highlight question type');
+            imageHighlightPage.steps.navigateToCreateQuestion('image highlight');
+            uploadImageSectionComponent.steps.uploadFile('highlightImage.jpg');
+            imageHighlightPage.steps.verifyImageUploadedInSpecifyPossibleOptionsSection();
+            imageHighlightPage.steps.verifyImageUploadedSpecifyCorrectAnswer();
+            imageHighlightPage.steps.highlightRegionInImage(flowerHighlightRegion);
+            imageHighlightPage.steps.highlightRegionInImage(branchesHighlightRegion);
+            imageHighlightPage.steps.highlightRegionInImage(leafHighlightRegion);
+        });
+
+        it('When the user selects the \'Single selection\' toggle button then the user should be able to highlight only one region in the \'Specify correct answer\' section', () => {
+            singleMultipleSelectionModeComponent.steps.selectSingleSelectionToggle();
+            imageHighlightPage.steps.highlightARegionInSpecifyCorrectAnswerSection(0);
+            imageHighlightPage.steps.verifySelectedHighlightRegionInSetCorrectAnswerSection(0);
+            imageHighlightPage.steps.highlightARegionInSpecifyCorrectAnswerSection(1);
+            imageHighlightPage.steps.verifySelectedHighlightRegionInSetCorrectAnswerSection(1);
+            imageHighlightPage.steps.verifyRegionIsNotHighlightedInSetCorrectAnswerSection(0);
+        });
+
+        it('When the user selects the \'Multiple selection\' toggle button then the user should be able to highlight multiple regions in the \'Specify correct answer\' section', () => {
+            singleMultipleSelectionModeComponent.steps.selectMultipleSelectionToggle();
+            imageHighlightPage.steps.highlightARegionInSpecifyCorrectAnswerSection(0);
+            imageHighlightPage.steps.highlightARegionInSpecifyCorrectAnswerSection(2);
+            imageHighlightPage.steps.verifySelectedHighlightRegionInSetCorrectAnswerSection(0);
+            imageHighlightPage.steps.verifySelectedHighlightRegionInSetCorrectAnswerSection(1);
+            imageHighlightPage.steps.verifySelectedHighlightRegionInSetCorrectAnswerSection(2);
+        });
+
+        it('When the user selects \'Single selection\' toggle button after highlighting multiple regions using the \'Multiple selection\' option then the last selected regions should be unselected and only one region should be left selected', () => {
+            singleMultipleSelectionModeComponent.steps.selectSingleSelectionToggle();
+            imageHighlightPage.steps.verifySelectedHighlightRegionInSetCorrectAnswerSection(1);
+            imageHighlightPage.steps.verifyRegionIsNotHighlightedInSetCorrectAnswerSection(0);
+            imageHighlightPage.steps.verifyRegionIsNotHighlightedInSetCorrectAnswerSection(2);
+        });
+    });
+
+    describe('Single Multiple selection: Preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to image highlight question type');
+            imageHighlightPage.steps.navigateToCreateQuestion('image highlight');
+            uploadImageSectionComponent.steps.uploadFile('highlightImage.jpg');
+            imageHighlightPage.steps.verifyImageUploadedInSpecifyPossibleOptionsSection();
+            imageHighlightPage.steps.verifyImageUploadedSpecifyCorrectAnswer();
+            imageHighlightPage.steps.highlightRegionInImage(flowerHighlightRegion);
+            imageHighlightPage.steps.highlightRegionInImage(branchesHighlightRegion);
+            imageHighlightPage.steps.highlightRegionInImage(leafHighlightRegion);
+        });
+
+        it('When the user selects the \'Single selection\' toggle button then the user should be able to highlight only one region in the \'Preview tab\' section', () => {
+            singleMultipleSelectionModeComponent.steps.selectSingleSelectionToggle();
+            imageHighlightPage.steps.switchToPreviewTab();
+            imageHighlightPage.steps.highlightARegionInPreviewTab(0);
+            imageHighlightPage.steps.verifySelectedHighlightRegionInPreviewTab(0);
+            imageHighlightPage.steps.highlightARegionInPreviewTab(1);
+            imageHighlightPage.steps.verifySelectedHighlightRegionInPreviewTab(1);
+            imageHighlightPage.steps.verifyRegionIsNotHighlightedPreviewTab(0);
+        });
+
+        it('When the user selects the \'Multiple selection\' toggle button then the user should be able to highlight multiple regions in the \'Preview tab\' section', () => {
+            imageHighlightPage.steps.switchToEditTab();
+            singleMultipleSelectionModeComponent.steps.selectMultipleSelectionToggle();
+            imageHighlightPage.steps.switchToPreviewTab();
+            imageHighlightPage.steps.highlightARegionInPreviewTab(0);
+            imageHighlightPage.steps.highlightARegionInPreviewTab(1);
+            imageHighlightPage.steps.highlightARegionInPreviewTab(2);
+            imageHighlightPage.steps.verifySelectedHighlightRegionInPreviewTab(0);
+            imageHighlightPage.steps.verifySelectedHighlightRegionInPreviewTab(1);
+            imageHighlightPage.steps.verifySelectedHighlightRegionInPreviewTab(2);
+        });
+    });
+});

package/cypress/e2e/ILC/MultipleSelectionGridNew/additionalSettings.js

@@ -0,0 +1,89 @@
+import { multipleSelectionGridPage } from "../../../pages";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+
+describe('Multiple selection grid - Additional settings', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Additional settings: Row style and layout section - Row numeration edit tab contents', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandAdditionalSettings();
+        });
+
+        multipleSelectionGridPage.tests.verifyRowNumerationContents();
+    });
+
+    describe('Additional settings: Row style and layout section - Row numeration specify correct answer section', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandAdditionalSettings();
+        });
+
+        multipleSelectionGridPage.tests.verifyRowNumerationEditTabFunctionality();
+    });
+
+    describe('Additional settings: Row style and layout section - Row numeration preview tab', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandAdditionalSettings();
+        });
+
+        multipleSelectionGridPage.tests.verifyRowNumerationPreviewTabFunctionality();
+    });
+
+    describe('Additional settings: Row style and layout section - Option alignment in cell: Specify correct answer', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandAdditionalSettings();
+        });
+
+        multipleSelectionGridPage.tests.verifyOptionAlignmentInCellContentsAndFunctionalityEditTab();
+    });
+
+    describe('Additional settings: Row style and layout section - Option alignment in cell: Preview tab', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandAdditionalSettings();
+            multipleSelectionGridPage.steps.switchToPreviewTab();
+        });
+
+        multipleSelectionGridPage.tests.verifyOptionAlignmentInCellFunctionalityPreviewTab();
+    });
+
+    describe('Additional settings: ARIA label for row headers - Contents in edit tab', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandAdditionalSettings();
+            multipleSelectionGridPage.steps.addInputToRowInputStepper(2);
+        });
+
+        multipleSelectionGridPage.tests.verifyARIALabelContentsAndFunctionalityEditTab();
+    });
+
+    describe('Additional settings: ARIA label for row headers - functionality in preview tab', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandAdditionalSettings();
+            multipleSelectionGridPage.steps.addInputToRowInputStepper(2);
+            multipleSelectionGridPage.steps.switchToPreviewTab();
+        });
+
+        multipleSelectionGridPage.tests.verifyARIALabelFunctionalityPreviewTab();
+    });
+});

package/cypress/e2e/ILC/MultipleSelectionGridNew/styleAndLayoutCustomizationBorderProperties.js

@@ -0,0 +1,53 @@
+import { multipleSelectionGridPage } from "../../../pages";
+import { colorPopupComponent } from "../../../pages/components";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+
+describe('Multiple selection grid - Additional settings', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Style and Layout customization accordion: Enable outer border for question edit tab contents and functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        multipleSelectionGridPage.tests.verifyEnableOuterBorderContentAndFunctionalityEditTab();
+    });
+
+    describe('Style and Layout customization accordion: Enable outer border for question preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        multipleSelectionGridPage.tests.verifyEnableOuterBorderFunctionalityPreviewTab();
+    });
+
+    describe('Style and Layout customization accordion: Inner border for question edit tab contents and functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        multipleSelectionGridPage.tests.verifyInnerBorderContentAndFunctionalityEditTab();
+    });
+
+    describe('Style and Layout customization accordion: Inner border for question preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        multipleSelectionGridPage.tests.verifyInnerBorderFunctionalityPreviewTab();
+    });
+});

package/cypress/e2e/ILC/MultipleSelectionGridNew/styleAndLayoutCustomizationGridProperties.js

@@ -0,0 +1,98 @@
+import { multipleSelectionGridPage } from "../../../pages";
+import { colorPopupComponent } from "../../../pages/components";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+
+describe('Multiple selection grid - Additional settings', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Style and Layout customization accordion: Fill color edit tab contents and functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        multipleSelectionGridPage.tests.verifyFillColorContentsAndFunctionalityEditTab();
+    });
+
+    describe('Style and Layout customization accordion: Fill color preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        multipleSelectionGridPage.tests.verifyFillColorFunctionalityPreviewTab();
+    });
+
+    describe('Style and Layout customization accordion: Border color edit tab contents and functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        multipleSelectionGridPage.tests.verifyBorderColorContentsAndFunctionalityEditTab();
+    });
+
+    describe('Style and Layout customization accordion: Border color preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+            multipleSelectionGridPage.steps.switchToPreviewTab();
+        });
+
+        multipleSelectionGridPage.tests.verifyBorderColorFunctionalityPreviewTab();
+    });
+
+    describe('Color popup functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        it('When the user clicks on the \'Edit color\' present in an \'Fill color\' popup, then a select color popup should be displayed', () => {
+            multipleSelectionGridPage.steps.editColor(0);
+            colorPopupComponent.steps.verifyColorPopupIsDisplayed();
+        });
+
+        colorPopupComponent.tests.verifyColorPopupSelectColorTitle();
+
+        colorPopupComponent.tests.verifySaturationAndOpacityGradientPalette('rgb(255, 255, 255)');
+
+        colorPopupComponent.tests.verifyColorHuePaletteAndHexInputField('rgb(255, 0, 0)', '#ffffff');
+
+        colorPopupComponent.tests.verifyColorPopupFunctionality();
+    });
+
+    describe('Color popup - Updating the selected color', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        multipleSelectionGridPage.tests.verifyColorPopupUpdateColorFunctionality();
+    });
+
+    describe('Color popup - \'Cancel\' and \'Ok\' buttons', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        multipleSelectionGridPage.tests.verifyColorPopupCancelOkButtonFunctionality();
+    });
+});

package/cypress/e2e/ILC/MultipleSelectionGridNew/styleAndLayoutCustomizationLayoutProperties.js

@@ -0,0 +1,89 @@
+import { multipleSelectionGridPage } from "../../../pages";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+
+describe('Multiple selection grid - Additional settings', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Style and Layout customization accordion', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+        });
+
+        multipleSelectionGridPage.tests.verifyStyleAndLayoutCustomizationAccordionProperties();
+
+        it('\'Layout\' label should be displayed', () => {
+            utilities.verifyInnerText(multipleSelectionGridPage.layoutLabel(), 'Layout')
+        });
+    });
+
+    describe('Style and Layout customization accordion: Row spacing and Column spacing edit tab contents and functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        multipleSelectionGridPage.tests.verifyRowAndColumnSpacingContentAndFunctionalityEditTab();
+    });
+
+    describe('Style and Layout customization accordion: Row spacing and Column spacing preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        multipleSelectionGridPage.tests.verifyRowAndColumnSpacingFunctionalityPreviewTab();
+    });
+
+    describe('Style and Layout customization accordion: Cell minimum height edit tab contents and functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        multipleSelectionGridPage.tests.verifyCellMinimumHeightContentAndFunctionalityEditTab();
+    });
+
+    describe('Style and Layout customization accordion: Cell minimum height preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        multipleSelectionGridPage.tests.verifyCellMinimumHeightFunctionalityPreviewTab();
+    });
+
+    describe('Style and Layout customization accordion: Column dimensions edit tab contents and functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait()
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        multipleSelectionGridPage.tests.verifyColumnDimensionsContentsAndFunctionalityPreviewTab();
+    });
+
+    describe('Style and Layout customization accordion: Column dimensions preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionGridPage.steps.navigateToCreateQuestion('multiple selection grid');
+            cy.barsPreLoaderWait();
+            multipleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        multipleSelectionGridPage.tests.verifyColumnDimensionsFunctionalityPreviewTab();
+    });
+});

package/cypress/e2e/ILC/SingleSelectionGridNew/styleAndLayoutCustomizationBorderProperties.js

@@ -0,0 +1,54 @@
+import { singleSelectionGridPage } from "../../../pages";
+import { colorPopupComponent } from "../../../pages/components";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+
+describe('Multiple selection grid - Additional settings', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Style and Layout customization accordion: Enable outer border for question edit tab contents and functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            singleSelectionGridPage.steps.navigateToCreateQuestion('single selection grid');
+            cy.barsPreLoaderWait();
+            singleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        singleSelectionGridPage.tests.verifyEnableOuterBorderContentAndFunctionalityEditTab();
+    });
+
+    describe('Style and Layout customization accordion: Enable outer border for question preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            singleSelectionGridPage.steps.navigateToCreateQuestion('single selection grid');
+            cy.barsPreLoaderWait();
+            singleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        singleSelectionGridPage.tests.verifyEnableOuterBorderFunctionalityPreviewTab();
+    });
+
+    describe('Style and Layout customization accordion: Inner border for question edit tab contents and functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            singleSelectionGridPage.steps.navigateToCreateQuestion('single selection grid');
+            cy.barsPreLoaderWait();
+            singleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        singleSelectionGridPage.tests.verifyInnerBorderContentAndFunctionalityEditTab();
+    });
+
+    describe('Style and Layout customization accordion: Inner border for question preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            singleSelectionGridPage.steps.navigateToCreateQuestion('single selection grid');
+            cy.barsPreLoaderWait();
+            singleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        singleSelectionGridPage.tests.verifyInnerBorderFunctionalityPreviewTab();
+    });
+});

package/cypress/e2e/ILC/SingleSelectionGridNew/styleAndLayoutCustomizationLayoutProperties.js

@@ -0,0 +1,90 @@
+import { singleSelectionGridPage } from "../../../pages";
+import { colorPopupComponent } from "../../../pages/components";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+
+describe('Multiple selection grid - Additional settings', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Style and Layout customization accordion', () => {
+        abortEarlySetup();
+        before(() => {
+            singleSelectionGridPage.steps.navigateToCreateQuestion('single selection grid');
+            cy.barsPreLoaderWait();
+        });
+
+        singleSelectionGridPage.tests.verifyStyleAndLayoutCustomizationAccordionProperties();
+
+        it('\'Layout\' label should be displayed', () => {
+            utilities.verifyInnerText(singleSelectionGridPage.layoutLabel(), 'Layout')
+        });
+    });
+
+    describe('Style and Layout customization accordion: Row spacing and Column spacing edit tab contents and functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            singleSelectionGridPage.steps.navigateToCreateQuestion('single selection grid');
+            cy.barsPreLoaderWait();
+            singleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        singleSelectionGridPage.tests.verifyRowAndColumnSpacingContentAndFunctionalityEditTab();
+    });
+
+    describe('Style and Layout customization accordion: Row spacing and Column spacing preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            singleSelectionGridPage.steps.navigateToCreateQuestion('single selection grid');
+            cy.barsPreLoaderWait();
+            singleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        singleSelectionGridPage.tests.verifyRowAndColumnSpacingFunctionalityPreviewTab();
+    });
+
+    describe('Style and Layout customization accordion: Cell minimum height edit tab contents and functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            singleSelectionGridPage.steps.navigateToCreateQuestion('single selection grid');
+            cy.barsPreLoaderWait();
+            singleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        singleSelectionGridPage.tests.verifyCellMinimumHeightContentAndFunctionalityEditTab();
+    });
+
+    describe('Style and Layout customization accordion: Cell minimum height preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            singleSelectionGridPage.steps.navigateToCreateQuestion('single selection grid');
+            cy.barsPreLoaderWait();
+            singleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        singleSelectionGridPage.tests.verifyCellMinimumHeightFunctionalityPreviewTab();
+    });
+
+    describe('Style and Layout customization accordion: Column dimensions edit tab contents and functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            singleSelectionGridPage.steps.navigateToCreateQuestion('single selection grid');
+            cy.barsPreLoaderWait()
+            singleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        singleSelectionGridPage.tests.verifyColumnDimensionsContentsAndFunctionalityPreviewTab();
+    });
+
+    describe('Style and Layout customization accordion: Column dimensions preview tab functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            singleSelectionGridPage.steps.navigateToCreateQuestion('single selection grid');
+            cy.barsPreLoaderWait();
+            singleSelectionGridPage.steps.expandStyleAndLayoutCustomizationAccordion();
+        });
+
+        singleSelectionGridPage.tests.verifyColumnDimensionsFunctionalityPreviewTab();
+    });
+});