itemengine-cypress-automation 1.0.78 → 1.0.79

package/cypress/e2e/ILC/EditTabSettingPage/itemPreviewSettingsTabFunctionality.js

@@ -0,0 +1,410 @@
+import { itemPreviewSettingsPage } from "../../../pages/itemPreviewSettingsPage";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+const css = Cypress.env('css');
+
+describe('Item preview: Settings tab - functionality', () => {
+    before('', () => {
+        cy.loginAs('admin');
+    });
+
+    describe('Functionality of \'Enable side by side panels\' section', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Item preview settings tab');
+            itemPreviewSettingsPage.steps.navigateToCreateItemPage();
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+        });
+
+        it('When user checks \'Enable side by side panels\' checkbox and clicks on \'Apply changes\', then two panels should be displayed in \'Edit tab\'', () => {
+            itemPreviewSettingsPage.steps.checkEnableSideBySidePanelsCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyPanelCount(2);
+            itemPreviewSettingsPage.steps.verifyAddQuestionAndAddResourceButton(0);
+            itemPreviewSettingsPage.steps.verifyAddQuestionAndAddResourceButton(1);
+        });
+
+        it('User should be able to add questions or resource and tools in both the panels', () => {
+            itemPreviewSettingsPage.steps.clickOnAddQuestion(0);
+            itemPreviewSettingsPage.steps.selectQuestionType('short text response');
+            itemPreviewSettingsPage.steps.createBasicShortTextResponseQuestion('shortTextResponseHeading', 2, 'Answer');
+            itemPreviewSettingsPage.steps.clickOnAddResource(1);
+            itemPreviewSettingsPage.steps.selectResourceType('passage');
+            itemPreviewSettingsPage.steps.createBasicPassageResourceAndTool('Heading', 'Passage heading');
+        });
+
+        it('When user has added question in the left panel, then it should be displayed in the left panel ', () => {
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 0, questionTitle: 'Short text response', questionInstructions: 'shortTextResponseHeading', panel: 0 });
+        });
+
+        it('When user has added resource and tool in the right panel, then it should be displayed in the right panel', () => {
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 0, questionTitle: 'Passage', questionInstructions: 'Passage heading', panel: 1 });
+        });
+
+        it('When user unchecks \'Enable side by side panels\' checkbox, then only one panel should be displayed and and added questions or resource and tools should be displayed inline', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.uncheckEnableSideBySidePanelsCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyQuestionsCount(2);
+            itemPreviewSettingsPage.steps.verifyPanelCount(1);
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 0, questionTitle: 'Short text response', questionInstructions: 'shortTextResponseHeading', panel: 0 });
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 1, questionTitle: 'Passage', questionInstructions: 'Passage heading', panel: 0 });
+        });
+
+        it('When user checks \'Enable side by side panels\' checkbox again, then \'Edit tab\' should be displayed with two panels, the left panel should be prefilled with added questions and resource tools and right panel should have \'Add question\' and \'Add resource and tool\' buttons', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.checkEnableSideBySidePanelsCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyPanelCount(2);
+            itemPreviewSettingsPage.steps.verifyQuestionsExistInLeftPanel();
+            itemPreviewSettingsPage.steps.verifyQuestionsDoNotExistInRightPanel();
+        });
+
+        it('Accessibility of panels', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(itemPreviewSettingsPage.panelWrapper().parents('.edit-wrapper'));
+        });
+    });
+
+    describe('Functionality of \'Separator\' section', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Item preview settings tab');
+            itemPreviewSettingsPage.steps.navigateToCreateItemPage();
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.checkEnableSideBySidePanelsCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.clickOnAddQuestion(0);
+            itemPreviewSettingsPage.steps.selectQuestionType('short text response');
+            itemPreviewSettingsPage.steps.createBasicShortTextResponseQuestion('LeftPanelQuestion', 2, 'Answer');
+            itemPreviewSettingsPage.steps.clickOnAddResource(0);
+            itemPreviewSettingsPage.steps.selectResourceType('passage');
+            itemPreviewSettingsPage.steps.createBasicPassageResourceAndTool('LeftPanelResource', 'Passage heading');
+            itemPreviewSettingsPage.steps.clickOnAddQuestion(1);
+            itemPreviewSettingsPage.steps.selectQuestionType('short text response');
+            itemPreviewSettingsPage.steps.createBasicShortTextResponseQuestion('RightPanelQuestion', 2, 'Answer');
+            itemPreviewSettingsPage.steps.clickOnAddResource(1);
+            itemPreviewSettingsPage.steps.selectResourceType('passage');
+            itemPreviewSettingsPage.steps.createBasicPassageResourceAndTool('RightPanelResource', 'Passage heading');
+        });
+
+        it('When user checks \'Horizontal separator line between questions\' checkbox, then questions in \'Edit tab\' should have \'Solid\' horizontal separator line between them and it should not be visible after last question', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.checkHorizontalSeparatorCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyPanelCount(2);
+            itemPreviewSettingsPage.steps.verifyHorizontalSeparatorVisible('solid');
+        });
+
+        it('When user selects \'Dashed\' separator style, then questions should have \'Dashed\' horizontal separator line between them  and it should not be visible after last question', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.selectSeparatorStyle('dashed');
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyPanelCount(2);
+            itemPreviewSettingsPage.steps.verifyHorizontalSeparatorVisible('dashed');
+        });
+
+        it('When user selects \'Dotted\' separator style, then questions should have \'Dotted\' horizontal separator line between them and it should not be visible after last question', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.selectSeparatorStyle('dotted');
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyPanelCount(2);
+            itemPreviewSettingsPage.steps.verifyHorizontalSeparatorVisible('dotted');
+        });
+
+        it('CSS of \'Horizontal\' separator style', { tags: 'css' }, () => {
+            utilities.verifyCSS(itemPreviewSettingsPage.rowQuestionWrapper().eq(0), {
+                'border-bottom-color': css.color.secondaryBtnBorder
+            });
+        });
+
+        it('When user checks \'Vertical separator line between panels\' checkbox, then panels should have \'Dotted\' vertical separator line between them', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.checkVerticalSeparatorCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyVerticalSeparatorVisible('dotted');
+        });
+
+        it('When user selects \'Solid\' separator style, then panels should have \'Solid\' vertical separator line between them', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.selectSeparatorStyle('solid');
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyVerticalSeparatorVisible('solid');
+        });
+
+        it('When user selects \'Dashed\' separator style, then panels should have \'Dashed\' vertical separator line between them', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.selectSeparatorStyle('dashed');
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyVerticalSeparatorVisible('dashed');
+        });
+
+        it('CSS of \'Vertical\' separator style', { tags: 'css' }, () => {
+            utilities.verifyCSS(itemPreviewSettingsPage.panelWrapper().eq(0), {
+                'border-right-color': css.color.secondaryBtnBorder
+            });
+        });
+
+        it('Accessibility of \'Separator style\'', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(itemPreviewSettingsPage.rowQuestionWrapper().parents('.edit-wrapper'));
+        });
+
+        it('When user unchecks \'Horizontal separator between questions\' and \'Vertical separator line between panels\' checkbox, then questions should not have horizontal separator line between them and panels should not have vertical separator line between them', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.uncheckVerticalSeparatorCheckbox();
+            itemPreviewSettingsPage.steps.uncheckHorizontalSeparatorCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyPanelCount(2);
+            itemPreviewSettingsPage.steps.verifyHorizontalSeparatorNotVisible('none')
+            itemPreviewSettingsPage.steps.verifyVerticalSeparatorNotVisible('none');
+        });
+    });
+
+    describe('Functionality of\'Spacing\' section', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Item preview settings tab');
+            itemPreviewSettingsPage.steps.navigateToCreateItemPage();
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.checkEnableSideBySidePanelsCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.clickOnAddQuestion(0);
+            itemPreviewSettingsPage.steps.selectQuestionType('short text response');
+            itemPreviewSettingsPage.steps.createBasicShortTextResponseQuestion('LeftPanelQuestion', 2, 'Answer');
+            itemPreviewSettingsPage.steps.clickOnAddResource(0);
+            itemPreviewSettingsPage.steps.selectResourceType('passage');
+            itemPreviewSettingsPage.steps.createBasicPassageResourceAndTool('LeftPanelResource', 'Passage heading');
+            itemPreviewSettingsPage.steps.clickOnAddQuestion(1);
+            itemPreviewSettingsPage.steps.selectQuestionType('short text response');
+            itemPreviewSettingsPage.steps.createBasicShortTextResponseQuestion('RightPanelQuestion', 2, 'Answer');
+            itemPreviewSettingsPage.steps.clickOnAddResource(1);
+            itemPreviewSettingsPage.steps.selectResourceType('passage');
+            itemPreviewSettingsPage.steps.createBasicPassageResourceAndTool('RightPanelResource', 'Passage heading');
+        });
+
+        it('When user navigates to \'Edit tab\', then spacing should be \'Default\' by default and after last question space should remain constant', () => {
+            itemPreviewSettingsPage.steps.verifyPanelCount(2);
+            itemPreviewSettingsPage.steps.verifyQuestionRowWrapperSpacing('default', false);
+            itemPreviewSettingsPage.steps.verifyQuestionWrapperSpacing('default', false);
+        });
+
+        it('When user selects \'Double\' from \'Spacing\' dropdown, then space between questions should be doubled and after last question space should remain constant', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.clickSpacingDropdownList();
+            itemPreviewSettingsPage.steps.selectOptionFromSpacingDropdown('Double');
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyPanelCount(2);
+            itemPreviewSettingsPage.steps.verifyQuestionRowWrapperSpacing('double', false);
+            itemPreviewSettingsPage.steps.verifyQuestionWrapperSpacing('double', false);
+        });
+
+        it('When user selects \'Triple\' from \'Spacing\' dropdown, then space between questions should be tripled and after last question space should remain constant', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.clickSpacingDropdownList();
+            itemPreviewSettingsPage.steps.selectOptionFromSpacingDropdown('Triple');
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyPanelCount(2);
+            itemPreviewSettingsPage.steps.verifyQuestionRowWrapperSpacing('triple', false);
+            itemPreviewSettingsPage.steps.verifyQuestionWrapperSpacing('triple', false);
+        });
+
+        it('When user checks \'Horizontal separator line between questions\' checkbox, then spacing with questions should be halved', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.checkHorizontalSeparatorCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyPanelCount(2);
+            itemPreviewSettingsPage.steps.verifyQuestionRowWrapperSpacing('triple', true);
+            itemPreviewSettingsPage.steps.verifyQuestionWrapperSpacing('triple', true);
+        });
+
+        it('Accessibility of \'Spacing\' in \'Edit tab\'', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(itemPreviewSettingsPage.rowQuestionWrapper().parents('.edit-wrapper'));
+        });
+    });
+
+    describe('Functionality of \'Sections\' section', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Item preview settings tab');
+            itemPreviewSettingsPage.steps.navigateToCreateItemPage();
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+        });
+
+        it('When user checks \'Enable sections\' checkbox, then two sections should be displayed in \'Edit tab\' and both sections should have \'Add question\' and \'Add resource and tool\' buttons', () => {
+            itemPreviewSettingsPage.steps.checkEnableSectionsCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyTwoSectionsExist();
+            itemPreviewSettingsPage.steps.verifyAddQuestionAndAddResourceButton();
+            itemPreviewSettingsPage.steps.navigateToSection2();
+            itemPreviewSettingsPage.steps.verifyAddQuestionAndAddResourceButton();
+        });
+
+        it('User should be able to add questions in both sections', () => {
+            itemPreviewSettingsPage.steps.navigateToSection1();
+            itemPreviewSettingsPage.steps.clickOnAddQuestion();
+            itemPreviewSettingsPage.steps.selectQuestionType('short text response');
+            itemPreviewSettingsPage.steps.createBasicShortTextResponseQuestion('ShortText', '2', 'Answer');
+            itemPreviewSettingsPage.steps.navigateToSection2();
+            itemPreviewSettingsPage.steps.clickOnAddQuestion();
+            itemPreviewSettingsPage.steps.selectResourceType('passage');
+            itemPreviewSettingsPage.steps.createBasicPassageResourceAndTool('Global', 'Warming');
+        });
+
+        it('When user has added question in section 1 then, it should be displayed in the section 1 ', () => {
+            itemPreviewSettingsPage.steps.navigateToSection1();
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 0, questionTitle: 'Short text response', questionInstructions: 'ShortText', panel: 0 });
+        });
+
+        it('When user has added resource and tool in section 2 then, it should be displayed in the section 2', () => {
+            itemPreviewSettingsPage.steps.navigateToSection2();
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 1, questionTitle: 'Passage', questionInstructions: 'Warming', panel: 0 });
+        });
+
+        it('When the user has checked \'Enable sections\' then on switching to \'Edit tab\', section navigation orientation should be \'Horizontal\', section navigation style should be \'Underlined\' and section navigation alignment should be \'Left aligned\' by default', () => {
+            itemPreviewSettingsPage.steps.verifyHorizontalNavigationOrientation();
+            itemPreviewSettingsPage.steps.verifyUnderlinedNavigationStyle(4);
+            itemPreviewSettingsPage.steps.verifyLeftAlignedNavigationAlignment();
+        });
+
+        it('When user selects \'Separated using dividers\' navigation style and \'Horizontal\' navigation orientation is active selection, then vertical line should be displayed between the section titles', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.selectSeparatedUsingDividersNavigationStyle();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifySeparatedUsingDividersNavigationStyle('horizontal');
+        });
+
+        it('When user selects \'Numbered\' navigation style, then numbers should be displayed with section titles', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.selectNumberedNavigationStyle();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyNumberedSectionNavigationStyle();
+        });
+
+        it('When user selects \'Center aligned\' navigation alignment, then section titles should be center aligned', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.selectCenterAlignedNavigationAlignment();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyCenterAlignedNavigationAlignment();
+        });
+
+        it('When user selects \'Right aligned\' navigation alignment, then section titles should be right aligned', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.selectRightAlignedNavigationAlignment();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyRightAlignedNavigationAlignment();
+        });
+
+        it('When user selects \'Vertical\' navigation orientation, then vertically oriented sections should be displayed', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.selectVerticalNavigationOrientation();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyVerticalNavigationOrientation();
+        });
+
+        it('When \'Numbered\' navigation style is the active selection, then numbers should be displayed with the section titles', () => {
+            itemPreviewSettingsPage.steps.verifyNumberedSectionNavigationStyle();
+        });
+
+        it('When user selects \'Underlined\' navigation style, then selected section title should have a line beside it', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.selectUnderlinedNavigationStyle();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyUnderlinedNavigationStyle(44);
+        });
+
+        it('When user selects \'Separated using dividers\' navigation style and \'Vertical\' navigation orientation is active selection , then horizontal line should be displayed between the section titles', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.selectSeparatedUsingDividersNavigationStyle();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifySeparatedUsingDividersNavigationStyle('vertical');
+        });
+
+        it('When user checks \'Enable side by side panels\' checkbox and \'Left panel\' is active selection for \'Enable sections in\', then \'Edit tab\' should have two panels and \'Left panel\' should have two sections', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.checkEnableSideBySidePanelsCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyPanelCount(2);
+            itemPreviewSettingsPage.steps.verifyTwoSectionsExist(0);
+        });
+
+        it('When user checks \'Right panel\' checkbox in \'Enable sections in\', then right panel should have two sections in it', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.checkRightPanelCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyPanelCount(2);
+            itemPreviewSettingsPage.steps.verifyTwoSectionsExist(1);
+        });
+
+        it('User should be able to add questions in both sections of \'Right panel\'', () => {
+            itemPreviewSettingsPage.steps.verifyAddQuestionAndAddResourceButton(1);
+            itemPreviewSettingsPage.steps.clickOnAddResource(1);
+            itemPreviewSettingsPage.steps.selectResourceType('passage');
+            itemPreviewSettingsPage.steps.createBasicPassageResourceAndTool('Heading', 'Body');
+            itemPreviewSettingsPage.steps.navigateToSection2(1);
+            itemPreviewSettingsPage.steps.verifyAddQuestionAndAddResourceButton(1);
+            itemPreviewSettingsPage.steps.clickOnAddResource(1);
+            itemPreviewSettingsPage.steps.selectQuestionType('short text response');
+            itemPreviewSettingsPage.steps.createBasicShortTextResponseQuestion('ShortTextResponse', '2', 'Result');
+        });
+
+        it('When user has added question in section 1 then, it should be displayed in the section 1 ', () => {
+            itemPreviewSettingsPage.steps.navigateToSection1();
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 0, questionTitle: 'Passage', questionInstructions: 'Body', panel: 1 });
+        });
+
+        it('When user has added resource and tool in section 2 then, it should be displayed in the section 2', () => {
+            itemPreviewSettingsPage.steps.navigateToSection2();
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 1, questionTitle: 'Short text response', questionInstructions: 'ShortTextResponse', panel: 1 });
+        });
+
+        it('When user unchecks \'Left panel\' checkbox, then section titles should disappear and questions in \'Left panel\' should be displayed inline', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.uncheckLeftPanelCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifySectionsLabelsNotExist(0);
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 0, questionTitle: 'Short text response', questionInstructions: 'ShortText', panel: 0 });
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 1, questionTitle: 'Passage', questionInstructions: 'Warming', panel: 0 });
+        });
+
+        it('When user checks \'Left panel\' checkbox, then \'Section 1\' should be prefilled with questions and both sections should have \'Add question\' & \'Add resource and tool\' buttons', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.checkLeftPanelCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyTwoSectionsExist(0);
+            itemPreviewSettingsPage.steps.navigateToSection1(0);
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 0, questionTitle: 'Short text response', questionInstructions: 'ShortText', panel: 0 });
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 1, questionTitle: 'Passage', questionInstructions: 'Warming', panel: 0 });
+        });
+
+        it('When user unchecks \'Right panel\' checkbox, then in \'Right panel\' section titles should disappear and questions should be displayed inline', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.uncheckRightPanelCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifySectionsLabelsNotExist(1);
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 0, questionTitle: 'Passage', questionInstructions: 'Body', panel: 1 });
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 1, questionTitle: 'Short text response', questionInstructions: 'ShortTextResponse', panel: 1 });
+        });
+
+        it('When user checks \'Right panel\' checkbox, then in \'Right panel\' \'Section 1\' should be prefilled with questions and both sections should have \'Add question\' & \'Add resource and tool\' buttons', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.checkRightPanelCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifyTwoSectionsExist(1);
+            itemPreviewSettingsPage.steps.navigateToSection1(1);
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 0, questionTitle: 'Passage', questionInstructions: 'Body', panel: 1 });
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 1, questionTitle: 'Short text response', questionInstructions: 'ShortTextResponse', panel: 1 });
+        });
+
+        //Failing due to https://redmine.zeuslearning.com/issues/555337
+        it('When user unchecks \'Enable sections\' checkbox, then section titles should disappear and \'Left panel\' and \'Right panel\' should have prefilled questions', () => {
+            itemPreviewSettingsPage.steps.clickOnSettingsButton();
+            itemPreviewSettingsPage.steps.uncheckEnableSectionsCheckbox();
+            itemPreviewSettingsPage.steps.clickApplyChanges();
+            itemPreviewSettingsPage.steps.verifySectionsLabelsNotExist(0);
+            itemPreviewSettingsPage.steps.verifySectionsLabelsNotExist(1);
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 0, questionTitle: 'Short text response', questionInstructions: 'ShortText', panel: 0 });
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 1, questionTitle: 'Passage', questionInstructions: 'Warming', panel: 0 });
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 0, questionTitle: 'Passage', questionInstructions: 'Body', panel: 1 });
+            itemPreviewSettingsPage.steps.verifyBasicQuestionContentsPreview({ questionIndex: 1, questionTitle: 'Short text response', questionInstructions: 'ShortTextResponse', panel: 1 });
+        });
+    });
+});