itemengine-cypress-automation 1.0.78 → 1.0.80

package/cypress/e2e/ILC/MultipleSelection/multipleSelectionAdditionalSettings.js

@@ -0,0 +1,835 @@
+import { multipleSelectionPage } from "../../../pages";
+import { commonComponents } from "../../../pages/components";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+const css = Cypress.env('css');
+
+const options = ['Pollution caused by treating chemical waste', 'Pollution caused by cement production', 'Pollution caused by methane production', 'Pollution caused by cement and methane production'];
+const numbers = ['1', '2', '3', '4'];
+const lowercase = ['a', 'b', 'c', 'd'];
+const uppercase = ['A', 'B', 'C', 'D'];
+
+describe('Create Item page - Multiple Selection: Additional Settings', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Additional Settings: Option Style and Layout section contents', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.steps.addOptionsText(4);
+            multipleSelectionPage.steps.setCorrectAnswers(2);
+            multipleSelectionPage.steps.allotPoints(20);
+        });
+
+        multipleSelectionPage.tests.verifyAdditonalSettingsAccordionProperties();
+
+        multipleSelectionPage.tests.verifyOptionsStyleLayoutAndDropdown('checkbox');
+
+        multipleSelectionPage.tests.verifyOptionNumerationDropdownContents('checkbox');
+    });
+
+    describe('Additional Settings: Option Style - Block without check box - Numerical', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.steps.addOptionsText(4);
+            multipleSelectionPage.steps.expandAdditonalSettings();
+        });
+
+        it('When the user selects \'Block without check box\' option from the Option Style dropdown and \'Numerical\' option from the Option Numeration dropdown, then numbers should be displayed before Block options in the \'Set Correct Answer\' section as well as in the \'Preview\' tab', () => {
+            multipleSelectionPage.optionsStyleDropdown()
+                .click();
+            multipleSelectionPage.optionsStyleDropdownListOptions('Block without check box')
+                .click();
+            multipleSelectionPage.optionsStyleDropdown()
+                .verifyInnerText('Block without check box');
+            multipleSelectionPage.optionNumerationDropdown()
+                .click();
+            multipleSelectionPage.optionNumerationDropdownListOptions('Numerical')
+                .click();
+            multipleSelectionPage.optionNumerationDropdown()
+                .verifyInnerText('Numerical');
+            multipleSelectionPage.steps.verifyEditTabCorrectAnswerSectionOptionsNumeration(numbers, 'checkbox')
+            multipleSelectionPage.steps.verifyEditTabCorrectAnswerSectionOptionsText(options)
+            cy.log('Switching to Preview tab')
+            multipleSelectionPage.steps.switchToPreviewTab();
+            multipleSelectionPage.steps.verifyPreviewTabOptionsNumeration(numbers, 'checkbox')
+            multipleSelectionPage.steps.verifyPreviewTabOptionsText(options)
+        });
+
+        multipleSelectionPage.tests.verifyCSSanda11yOfSelectedNumericalInCorrectAnswerSectionAndPreviewTab();
+
+        it('When user has selected \'Shuffle option order\' checkbox then in the \'Preview\' tab, numbers should be displayed before Block options in ascending order even though options are shuffled', () => {
+            cy.log('Pre-step:Switching to edit tab and checking shuffle option order checkbox')
+            multipleSelectionPage.steps.switchToEditTab()
+            multipleSelectionPage.shuffleOptionCheckbox()
+                .click()
+                .should('be.checked');
+            multipleSelectionPage.steps.switchToPreviewTab()
+            multipleSelectionPage.steps.verifyPreviewTabOptionsNumeration(numbers, 'checkbox')
+            multipleSelectionPage.steps.verifyShuffleOptionOrder(options, 4)
+        });
+    });
+
+    describe('Additional Settings: Option Style - Block without check box - Uppercase alphabet', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.steps.addOptionsText(4);
+            multipleSelectionPage.steps.expandAdditonalSettings();
+        });
+
+        it('When the user selects \'Block without check box\' option from the Option Style dropdown and \'Uppercase alphabet\' option from the Option Numeration dropdown, then uppercase alphabets should be displayed before Block options in the \'Set Correct Answer\' section as well as in the \'Preview\' tab', () => {
+            multipleSelectionPage.optionsStyleDropdown()
+                .click();
+            multipleSelectionPage.optionsStyleDropdownListOptions('Block without check box')
+                .click();
+            multipleSelectionPage.optionsStyleDropdown()
+                .verifyInnerText('Block without check box');
+            multipleSelectionPage.optionNumerationDropdown()
+                .click();
+            multipleSelectionPage.optionNumerationDropdownListOptions('Uppercase alphabet')
+                .click();
+            multipleSelectionPage.optionNumerationDropdown()
+                .verifyInnerText('Uppercase alphabet');
+
+            multipleSelectionPage.steps.verifyEditTabCorrectAnswerSectionOptionsNumeration(uppercase, 'checkbox')
+            multipleSelectionPage.steps.verifyEditTabCorrectAnswerSectionOptionsText(options)
+            cy.log('Switching to Preview tab')
+            multipleSelectionPage.steps.switchToPreviewTab();
+            multipleSelectionPage.steps.verifyPreviewTabOptionsNumeration(uppercase, 'checkbox')
+            multipleSelectionPage.steps.verifyPreviewTabOptionsText(options)
+            cy.log('Post step: Switching to Edit tab')
+            multipleSelectionPage.steps.switchToEditTab();
+        });
+
+        it('When user has selected \'Shuffle option order\' checkbox then in the \'Preview\' tab, uppercase alphabets should be displayed before Block options in ascending order even though options are shuffled', () => {
+            multipleSelectionPage.shuffleOptionCheckbox()
+                .click()
+                .should('be.checked');
+            cy.log('Switching to Preview tab')
+            multipleSelectionPage.steps.switchToPreviewTab();
+            multipleSelectionPage.steps.verifyPreviewTabOptionsNumeration(uppercase, 'checkbox')
+            multipleSelectionPage.steps.verifyShuffleOptionOrder(options, 4)
+        });
+    });
+
+    describe('Additional Settings: Option Style - Block without check box - Lowercase alphabet', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.steps.addOptionsText(4);
+            multipleSelectionPage.steps.expandAdditonalSettings();
+        });
+
+        it('When the user selects \'Block without check box\' option from the Option Style dropdown and \'Lowercase alphabet\' option from the Option Numeration dropdown, then lowercase alphabets should be displayed before Block options in the \'Set Correct Answer\' section as well as in the \'Preview\' tab', () => {
+            multipleSelectionPage.optionsStyleDropdown()
+                .click();
+            multipleSelectionPage.optionsStyleDropdownListOptions('Block without check box')
+                .click();
+            multipleSelectionPage.optionNumerationDropdown()
+                .click();
+            multipleSelectionPage.optionNumerationDropdownListOptions('Lowercase alphabet')
+                .click();
+            multipleSelectionPage.optionNumerationDropdown()
+                .verifyInnerText('Lowercase alphabet');
+            multipleSelectionPage.steps.verifyEditTabCorrectAnswerSectionOptionsNumeration(lowercase, 'checkbox')
+            multipleSelectionPage.steps.verifyEditTabCorrectAnswerSectionOptionsText(options)
+            cy.log('Switching to Preview tab')
+            multipleSelectionPage.steps.switchToPreviewTab();
+            multipleSelectionPage.steps.verifyPreviewTabOptionsNumeration(lowercase, 'checkbox')
+            multipleSelectionPage.steps.verifyPreviewTabOptionsText(options)
+            cy.log('Post step: Switching to Edit tab')
+            multipleSelectionPage.steps.switchToEditTab();
+        });
+
+        it('When user has selected \'Shuffle option order\' checkbox then in the \'Preview\' tab, lowercase alphabets should be displayed before Block options in ascending order even though options are shuffled', () => {
+            multipleSelectionPage.shuffleOptionCheckbox()
+                .click()
+                .should('be.checked');
+            multipleSelectionPage.steps.switchToPreviewTab();
+            multipleSelectionPage.steps.verifyPreviewTabOptionsNumeration(lowercase, 'checkbox')
+            multipleSelectionPage.steps.verifyShuffleOptionOrder(options, 4)
+        });
+    });
+
+    //Failing due to https://redmine.zeuslearning.com/issues/547726
+    describe('Additional Settings: Option Style - Check box below option and switching back to Default option style', () => {
+        abortEarlySetup();
+        before(() => {
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.steps.addOptionsText(4);
+            multipleSelectionPage.steps.expandAdditonalSettings();
+        });
+
+        it('When the user selects \'Check box below option\' option from the Option Style dropdown, \'Option Numeration\' dropdown should not be displayed', () => {
+            multipleSelectionPage.optionsStyleDropdown()
+                .click();
+            multipleSelectionPage.optionsStyleDropdownListOptions('Check box below option')
+                .click();
+            multipleSelectionPage.optionsStyleDropdown()
+                .verifyInnerText('Check box below option');
+            multipleSelectionPage.optionNumerationDropdown()
+                .should('not.exist');
+        });
+
+        it('In the \'Set Correct Answer\' section as well as in the \'Preview\' tab, checkbox for the option should be displayed below the option text and both option text as well as option checkbox should be center-aligned', () => {
+            multipleSelectionPage.editTabOptionsText()
+                .parents('[data-ngie-testid="response-option-checkbox"]')
+                .each(($element) => {
+                    cy.wrap($element)
+                        .should('have.class', 'mcq-checkbox-below-option')
+                        .should('have.css', 'align-items', 'center');
+                });
+            cy.log('Switching to Preview tab')
+            multipleSelectionPage.steps.switchToPreviewTab();
+            multipleSelectionPage.previewTabOptionsText()
+                .parents('[data-ngie-testid="response-option-checkbox"]')
+                .each(($element) => {
+                    cy.wrap($element)
+                        .should('have.class', 'mcq-checkbox-below-option')
+                        .should('have.css', 'align-items', 'center');
+                });
+            cy.log('Post-step: Switch back to edit tab')
+            multipleSelectionPage.steps.switchToEditTab();
+        });
+
+        it('When the user selects \'Default\' option from the Option Style dropdown, then checkbox for each option should be displayed besides the option text in the \'Set Correct Answer\' section as well as in the \'Preview\' tab', () => {
+            multipleSelectionPage.optionsStyleDropdown()
+                .click();
+            multipleSelectionPage.optionsStyleDropdownListOptions('Default')
+                .click();
+            multipleSelectionPage.optionsStyleDropdown()
+                .verifyInnerText('Default');
+            multipleSelectionPage.editTabOptionsText()
+                .parents('[data-ngie-testid="response-option-checkbox"]')
+                .each(($element) => {
+                    cy.wrap($element)
+                        .should('not.have.class', 'mcq-checkbox-below-option')
+                        .should('have.css', 'align-items', 'normal');
+                });
+            cy.log('Switching to Preview tab')
+            multipleSelectionPage.steps.switchToPreviewTab();
+            multipleSelectionPage.previewTabOptionsText()
+                .parents('[data-ngie-testid="response-option-checkbox"]')
+                .each(($element) => {
+                    cy.wrap($element)
+                        .should('not.have.class', 'mcq-checkbox-below-option')
+                        .should('have.css', 'align-items', 'normal');
+                });
+        });
+    });
+
+    describe('Additional Settings: Number of Option Columns contents', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to multiple selection quetion type, adding question instructions and options and expanding additional settings accordion')
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.steps.addOptionsText(4);
+            multipleSelectionPage.steps.expandAdditonalSettings();
+        });
+
+        multipleSelectionPage.tests.verifyNumberOfOptionColumnsAndOptionOrientationContent();
+    });
+
+    describe('Number of Option Columns - Option Orientation - Vertical', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to multiple selection quetion type, adding question instructions and options and expanding additional settings accordion')
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.addOptionButton()
+                .click();
+            multipleSelectionPage.addOptionButton()
+                .click();
+            multipleSelectionPage.steps.addOptionsText(6);
+            multipleSelectionPage.steps.expandAdditonalSettings();
+        });
+
+        multipleSelectionPage.tests.verifyNumberOfOptionsColumns('Vertical');
+    });
+
+    describe('Number of Option Columns - Option Orientation - Horizontal', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to multiple selection quetion type, adding question instructions,adding 2 more options, adding options text, setting correct answers, alloting points, expanding additional settings accordion and setting option orientation as \'Horizontal\'')
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.addOptionButton()
+                .click();
+            multipleSelectionPage.addOptionButton()
+                .click();
+            multipleSelectionPage.steps.addOptionsText(6);
+            multipleSelectionPage.steps.expandAdditonalSettings();
+            multipleSelectionPage.numberOfOptionColumnsDropdown()
+                .click();
+            multipleSelectionPage.numberOfOptionColumnsListOptions(1)
+                .click();
+            multipleSelectionPage.optionOrientationDropdown()
+                .click();
+            multipleSelectionPage.optionOrientationListOptions(1)
+                .click();
+        });
+
+        multipleSelectionPage.tests.verifyNumberOfOptionsColumns('Horizontal');
+    });
+
+    describe('Number of Option Columns - Shuffle option order, Option Numeration dropdown, Show correct answer checkbox and Check Answer button cases', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to multiple selection quetion type, adding question instructions, adding 2 more options, adding options text, setting correct answers, alloting points and expanding additional settings accordion')
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.addOptionButton()
+                .click();
+            multipleSelectionPage.addOptionButton()
+                .click();
+            multipleSelectionPage.steps.addOptionsText(6);
+            multipleSelectionPage.steps.setCorrectAnswers(2);
+            multipleSelectionPage.steps.allotPoints(4);
+            multipleSelectionPage.steps.expandAdditonalSettings();
+            cy.log('Selecting shuffle order option checkbox, selecting Block without check box and Numerical options, selecting Allow student to check answer checkbox and providing max check answer attempts and selecting number of option columns as 3');
+            multipleSelectionPage.shuffleOptionCheckbox()
+                .click();
+            multipleSelectionPage.optionsStyleDropdown()
+                .click();
+            multipleSelectionPage.optionsStyleDropdownListOptions('Block without check box')
+                .click();
+            multipleSelectionPage.optionNumerationDropdown()
+                .click();
+            multipleSelectionPage.optionNumerationDropdownListOptions('Numerical')
+                .click();
+            multipleSelectionPage.steps.setMaximumCheckAnswerAttempts(5);
+        });
+
+        multipleSelectionPage.tests.verifyOptionOrientation('checkbox');
+
+        it('When the user selects \'Show correct answer\' checkbox, then green checkmark icon should be displayed besides correct answer options as per the shuffling and columns and no label should be displayed below the options', () => {
+            multipleSelectionPage.showCorrectAnswerCheckbox()
+                .click();
+            let correctOptions = ['Pollution caused by cement production', 'Pollution caused by treating chemical waste']
+            correctOptions.forEach((option) => {
+                multipleSelectionPage.steps.verifyCorrectOption(option);
+            });
+            multipleSelectionPage.correctIncorrectAnswerLabel()
+                .should('not.exist');
+            cy.log('Post-step: Uncheck the Show correct answer checkbox');
+            multipleSelectionPage.showCorrectAnswerCheckbox()
+                .click()
+                .should('not.be.checked');
+        });
+
+        it('When user selects all the options and clicks on \'Check Answer\' button, then green checkmark icon should be displayed besides correct answer options and red crossmark icon should be displayed besides incorrect answer options as per the shuffling and columns and a label \'Incorrect Answer\' should be displayed below the box', () => {
+            let correctOptions = ['Pollution caused by cement production', 'Pollution caused by treating chemical waste']
+            let incorrectOptions = ['Pollution caused by methane production', 'Pollution caused by cement and methane production', 'Pollution caused by electronic waste', 'Pollution caused by nuclear waste'];
+            for (let index = 0; index < 6; index++) {
+                multipleSelectionPage.previewTabOptionsWrapper(index)
+                    .click()
+                    .within(() => {
+                        multipleSelectionPage.optionForBlockWithoutCheckbox()
+                            .should('have.class', 'label-selected');
+                    });
+            };
+            multipleSelectionPage.showCorrectAnswerCheckbox()
+                .click()
+                .should('be.checked');
+            correctOptions.forEach((option) => {
+                multipleSelectionPage.steps.verifyCorrectOption(option);
+            });
+            incorrectOptions.forEach((option) => {
+                multipleSelectionPage.steps.verifyIncorrectOption(option);
+            });
+            multipleSelectionPage.steps.verifyCorrectIncorrectAnswerLabel('Incorrect');
+        });
+    });
+
+    describe('Additional Settings: Minimum and Maximum number of answers contents', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to multiple selection question type and expanding additional settings accordion')
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.expandAdditonalSettings();
+        });
+
+
+        it('CSS of \'Minimum number of answers\' and \'Maximum number of answers\' input fields', { tags: 'css' }, () => {
+            multipleSelectionPage.minimumNumberOfAnswersLabel()
+                .verifyCSS(css.color.labels, css.fontSize.normal, css.fontWeight.semibold);
+            multipleSelectionPage.maximumNumberOfAnswersLabel()
+                .verifyCSS(css.color.labels, css.fontSize.normal, css.fontWeight.semibold);
+            multipleSelectionPage.minimumAnswersInputField()
+                .should('have.css', 'background-color', css.color.transparent);
+            multipleSelectionPage.maximumAnswersInputField()
+                .should('have.css', 'background-color', css.color.transparent);
+        });
+
+        //Note: Note: a11y is covered for the entire additional settings section
+
+        it('\'Minimum number of answers\' label and input field should be displayed', () => {
+            multipleSelectionPage.minimumNumberOfAnswersLabel()
+                .verifyInnerText('Minimum number of answers');
+            multipleSelectionPage.minimumAnswersInputField()
+                .should('be.visible');
+        });
+
+        it('\'Maximum number of answers\' label and input field should be displayed', () => {
+            multipleSelectionPage.maximumNumberOfAnswersLabel()
+                .verifyInnerText('Maximum number of answers');
+            multipleSelectionPage.maximumAnswersInputField()
+                .should('be.visible');
+        });
+    });
+
+    describe('Minimum number of answers cases - Edit tab', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to multiple selection quetion type, adding question instructions, options, setting correct answers, alloting points and expanding additional settings accordion')
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.steps.addOptionsText(4);
+            multipleSelectionPage.steps.setCorrectAnswers(1);
+            multipleSelectionPage.steps.allotPoints(20);
+            multipleSelectionPage.steps.expandAdditonalSettings();
+        });
+
+
+        it('When user adds minimum number of answers more than the number of correct answers, then in the \'Set Correct Answer\' section a warning message should be displayed stating required number of answers along with exclamation icon at start', () => {
+            multipleSelectionPage.minimumAnswersInputField()
+                .type('2', { delay: 0 })
+                .should('have.value', '2');
+            multipleSelectionPage.minMaxErrorMessage()
+                .verifyInnerText('At least 2 answers are required.')
+                .and('be.visible');
+        });
+
+        it('When user changes the value of minimum number of answers same as the number of correct answers the warning message should disappear', () => {
+            multipleSelectionPage.minimumAnswersInputField()
+                .clear()
+                .type('1', { delay: 0 })
+                .should('have.value', '1');
+            multipleSelectionPage.minMaxErrorMessage()
+                .should('not.exist');
+        });
+
+        it('When user sets the number of correct answer same as minimum number of answers the warning message should disappear', () => {
+            multipleSelectionPage.minimumAnswersInputField()
+                .clear();
+            multipleSelectionPage.minimumAnswersInputField()
+                .type('2', { delay: 0 })
+                .should('have.value', '2');
+            multipleSelectionPage.minMaxErrorMessage()
+                .verifyInnerText('At least 2 answers are required.');
+            multipleSelectionPage.steps.checkUncheckCorrectAnswer(1, 'be.checked');
+            multipleSelectionPage.minMaxErrorMessage()
+                .should('not.exist');
+        });
+
+        it(`If the maximum number field is empty and the minimum number field is 0 or less than 0, it should automatically change to 1, a snackbar with the text 'Minimum number of answers can't be less than 1' and \'CLOSE\' button should be displayed, on clicking on the \'CLOSE\' button, snackbar should disappear`, () => {
+            multipleSelectionPage.minimumAnswersInputField()
+                .clear();
+            multipleSelectionPage.minimumAnswersInputField()
+                .type('0');
+            multipleSelectionPage.minimumAnswersInputField()
+                .should('have.value', '0');
+            multipleSelectionPage.minimumAnswersInputField()
+                .should('have.value', '1');
+            commonComponents.snackbar()
+                .verifyInnerText('Minimum number of answers can\'t be less than 1');
+            commonComponents.snackbarCloseButton()
+                .verifyInnerText('CLOSE')
+                .click();
+            commonComponents.snackbar()
+                .should('not.exist');
+        });
+
+        it(`If the maximum number field is empty and the minimum number field value is greater than the number of available options, it should automatically change to the number of available options, and a snackbar with the text 'Minimum number of answers can't be more than the available options' should be displayed, the snackbar should automatically disappear within few seconds`, () => {
+            multipleSelectionPage.minimumAnswersInputField()
+                .clear()
+                .type('5', { delay: 0 })
+                .should('have.value', '5')
+            multipleSelectionPage.minimumAnswersInputField()
+                .should('have.value', '4')
+            commonComponents.snackbar()
+                .verifyInnerText('Minimum number of answers can\'t be more than the available options');
+            commonComponents.snackbar()
+                .should('not.exist');
+        });
+
+        it(`If the maximum number field is 1 (or more) and the minimum number field is 0 or less than 0, it should automatically change to 1, and a snackbar with the text 'Minimum number of answers can't be less than 1' should be displayed`, () => {
+            multipleSelectionPage.maximumAnswersInputField()
+                .type('4', { delay: 0 })
+                .should('have.value', '4');
+            multipleSelectionPage.minimumAnswersInputField()
+                .clear();
+            multipleSelectionPage.minimumAnswersInputField()
+                .type('0', { delay: 0 });
+            multipleSelectionPage.minimumAnswersInputField()
+                .should('have.value', '0');
+            multipleSelectionPage.minimumAnswersInputField()
+                .should('have.value', '1');
+            commonComponents.snackbar()
+                .verifyInnerText('Minimum number of answers can\'t be less than 1');
+        });
+
+        it(`If the minimum number field value is greater than the maximum number field value, it should automatically change to the maximum number field value, and a snackbar with the text 'Minimum number of answers can't be more than the maximum number of answers' should be displayed`, () => {
+            multipleSelectionPage.maximumAnswersInputField()
+                .clear();
+            multipleSelectionPage.minimumAnswersInputField()
+                .clear();
+            multipleSelectionPage.maximumAnswersInputField()
+                .type('2', { delay: 0 })
+                .should('have.value', '2')
+                .wait(300);
+            multipleSelectionPage.minimumAnswersInputField()
+                .type('4', { delay: 0 })
+                .should('have.value', '4')
+            multipleSelectionPage.minimumAnswersInputField()
+                .should('have.value', '2');
+            commonComponents.snackbar()
+                .verifyInnerText('Minimum number of answers can\'t be more than the maximum number of answers');
+        });
+    });
+
+    describe('Maximum number of answers cases - Edit tab', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to multiple selection quetion type, adding question instructions, options, setting correct answers, alloting points and expanding additional settings accordion')
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.steps.addOptionsText(4);
+            multipleSelectionPage.steps.setCorrectAnswers(2);
+            multipleSelectionPage.steps.allotPoints(20);
+            multipleSelectionPage.steps.expandAdditonalSettings();
+        });
+
+        it(`When user adds maximum number of answers less than the number of correct answers, it should automatically change to the number of set correct answers, and a snackbar with the text 'Maximum number of answers can't be less than the set correct answers' and \'CLOSE\' button should be displayed, on clicking on the \'CLOSE\' button, snackbar should disappear`, () => {
+            multipleSelectionPage.maximumAnswersInputField()
+                .type('1', { delay: 0 })
+                .should('have.value', '1')
+            multipleSelectionPage.maximumAnswersInputField()
+                .should('have.value', '2')
+            commonComponents.snackbar()
+                .verifyInnerText('Maximum number of answers can\'t be less than the set correct answers');
+            commonComponents.snackbarCloseButton()
+                .verifyInnerText('CLOSE')
+                .click();
+            commonComponents.snackbar()
+                .should('not.exist');
+        });
+
+        it(`If the minimum number field is empty and the maximum number field is 0 or less than 0, it should automatically change to 1, and a snackbar with the text 'Maximum number of answers can't be less than 1' should be displayed`, () => {
+            cy.log('To verify this case, uncheck all set correct answers')
+            let setAnswers = [0, 1]
+            setAnswers.forEach((option) => {
+                multipleSelectionPage.steps.checkUncheckCorrectAnswer(option, 'not.be.checked');
+            });
+            multipleSelectionPage.maximumAnswersInputField()
+                .clear()
+                .type('0', { delay: 0 })
+                .should('have.value', '0')
+            multipleSelectionPage.maximumAnswersInputField()
+                .should('have.value', '1');
+            commonComponents.snackbar()
+                .verifyInnerText('Maximum number of answers can\'t be less than 1');
+            commonComponents.snackbar()
+                .should('not.exist');
+            cy.log('Post-step : clear maxmimum number field, check all set correct answers again')
+            multipleSelectionPage.maximumAnswersInputField()
+                .clear();
+            multipleSelectionPage.steps.setCorrectAnswers(2);
+        });
+
+        it(`If the minimum number field is empty and the maximum number field value is greater than the number of available options, it should automatically change to the number of available options, and a snackbar with the text 'Maximum number of answers can't be more than the available options' should be displayed`, () => {
+            multipleSelectionPage.maximumAnswersInputField()
+                .clear()
+                .type('6', { delay: 0 })
+                .should('have.value', '6')
+            multipleSelectionPage.maximumAnswersInputField()
+                .should('have.value', '4')
+            commonComponents.snackbar()
+                .verifyInnerText('Maximum number of answers can\'t be more than the available options');
+        });
+
+        it(`If the minimum number field is 1 (or more) and the maximum number field is smaller than the minimum number, it should automatically change to the number in the minimum number field, and a snackbar with the text 'Maximum number of answers can't be less than the minimum number of answers' should be displayed`, () => {
+            cy.log('clear the maximum number field')
+            multipleSelectionPage.maximumAnswersInputField()
+                .clear();
+            multipleSelectionPage.minimumAnswersInputField()
+                .type('3', { delay: 0 })
+                .should('have.value', '3')
+                .wait(300);
+            multipleSelectionPage.maximumAnswersInputField()
+                .type('2', { delay: 0 })
+                .should('have.value', '2')
+            multipleSelectionPage.maximumAnswersInputField()
+                .should('have.value', '3');
+            commonComponents.snackbar()
+                .verifyInnerText('Maximum number of answers can\'t be less than the minimum number of answers');
+        });
+
+        it(`If the minimum number field is 1 (or more) and the maximum number field value is greater than number of available options, it should automatically change to the number of available options, and a snackbar with the text 'Maximum number of answers can't be more than the available options' should be displayed`, () => {
+            multipleSelectionPage.maximumAnswersInputField()
+                .clear();
+            multipleSelectionPage.maximumAnswersInputField()
+                .type('6', { delay: 0 })
+                .should('have.value', '6')
+            multipleSelectionPage.maximumAnswersInputField()
+                .should('have.value', '4')
+            commonComponents.snackbar()
+                .verifyInnerText('Maximum number of answers can\'t be more than the available options');
+        });
+    });
+
+    describe('Minimum and Maximum number of answers - Preview tab', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to multiple selection quetion type, adding question instructions, options, setting correct answers, alloting points, expanding additional settings accordion, setting minimum and maximum number of answers required')
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.steps.addOptionsText(4);
+            multipleSelectionPage.steps.setCorrectAnswers(2);
+            multipleSelectionPage.steps.allotPoints(20);
+            multipleSelectionPage.steps.expandAdditonalSettings();
+            multipleSelectionPage.minimumAnswersInputField()
+                .type('2', { delay: 0 })
+                .should('have.value', '2');
+            multipleSelectionPage.maximumAnswersInputField()
+                .type('3', { delay: 0 });
+            multipleSelectionPage.maximumAnswersInputField()
+                .should('have.value', '3');
+            cy.log('Post step: Switching to Preview tab')
+            multipleSelectionPage.steps.switchToPreviewTab();
+        });
+
+
+        it(`In Preview tab, when user selects options less than minimum number of answers, a warning message 'At least # answers are required.' should be displayed below the options in the student preview`, () => {
+            multipleSelectionPage.previewTabOptionsWrapper(0)
+                .within(() => {
+                    multipleSelectionPage.previewTabOptionsCheckbox()
+                        .click()
+                        .should('be.checked')
+                });
+            multipleSelectionPage.minMaxErrorMessage()
+                .verifyInnerText('At least 2 answers are required.')
+                .and('be.visible')
+        });
+
+        it('CSS of warning message', { tags: 'css' }, () => {
+            multipleSelectionPage.minMaxErrorMessage()
+                .find('.min-max-answer-error-text')
+                .verifyCSS(css.color.warningText, css.fontSize.normal, css.fontWeight.bold);
+        });
+
+        it('Accessibility of warning message in Edit tab', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(multipleSelectionPage.minMaxErrorMessage());
+        });
+
+        it('In Preview tab, when user selects options same as minimum number of answers, the warning message should disappear', () => {
+            multipleSelectionPage.previewTabOptionsWrapper(1)
+                .click()
+                .within(() => {
+                    multipleSelectionPage.previewTabOptionsCheckbox()
+                        .should('be.checked');
+                });
+            multipleSelectionPage.minMaxErrorMessage()
+                .should('not.exist');
+        });
+
+        it(`In Preview tab, when user tries to select options more than maximum number of answers, a warning message 'Only # answers are permitted.' should be displayed below the options in the student preview`, () => {
+            let incorrectOptions = [3, 4];
+            incorrectOptions.forEach((option, count) => {
+                multipleSelectionPage.previewTabOptionsWrapper(count + 2)
+                    .click();
+            });
+            multipleSelectionPage.previewTabOptionsWrapper(3)
+                .within(() => {
+                    multipleSelectionPage.previewTabOptionsCheckbox()
+                        .should('not.be.checked');
+                });
+            multipleSelectionPage.minMaxErrorMessage()
+                .verifyInnerText('Only 3 answers are permitted.')
+        });
+
+        it('CSS of warning message in Preview tab', { tags: 'css' }, () => {
+            multipleSelectionPage.minMaxErrorMessage()
+                .find('.min-max-answer-error-text')
+                .verifyCSS(css.color.warningText, css.fontSize.normal, css.fontWeight.bold);
+        });
+
+        it('Accessibility of warning message in Preview tab', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(multipleSelectionPage.minMaxErrorMessage());
+        });
+
+        it('In Preview tab, when user deselects any option, the warning message should disappear', () => {
+            multipleSelectionPage.previewTabOptionsWrapper(1)
+                .click()
+                .within(() => {
+                    multipleSelectionPage.previewTabOptionsCheckbox()
+                        .should('not.be.checked');
+                });
+            multipleSelectionPage.minMaxErrorMessage()
+                .should('not.exist');
+        });
+    });
+
+    describe('Additional Settings: Font Size dropdown', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to multiple selection quetion type, adding question instructions and options, alloting points and expanding additional settings accordion')
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.steps.addOptionsText(4);
+            multipleSelectionPage.steps.setCorrectAnswers(2);
+            multipleSelectionPage.steps.allotPoints(8);
+            multipleSelectionPage.steps.expandAdditonalSettings();
+        });
+
+        multipleSelectionPage.tests.verifyFontSizeSectionContents();
+
+        multipleSelectionPage.tests.verifyEditTabCorrectAnswerSectionAndPreviewTabFontSize();
+    });
+
+    describe('Additional Settings: Check Answer', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to multiple selection quetion type, adding question instructions and options and expanding additional settings accordion')
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.steps.addOptionsText(4);
+            multipleSelectionPage.steps.setCorrectAnswers(2);
+            multipleSelectionPage.steps.allotPoints(20);
+            multipleSelectionPage.steps.expandAdditonalSettings();
+        });
+        multipleSelectionPage.tests.verifyCheckAnswerSectionAndPreviewTabCheckAnswerButton('multiple selection');
+    });
+
+    describe('Check Answer - Functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to multiple selection quetion type, adding question instructions and options, expanding additional settings accordion, allowing students to check answer and switching to preview tab')
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.steps.addOptionsText(4);
+            multipleSelectionPage.steps.setCorrectAnswers(2);
+            multipleSelectionPage.steps.allotPoints(20);
+            multipleSelectionPage.steps.expandAdditonalSettings();
+            multipleSelectionPage.steps.setMaximumCheckAnswerAttempts(2);
+            multipleSelectionPage.steps.switchToPreviewTab();
+        });
+
+        multipleSelectionPage.tests.verifyCheckAnswerButtonFunctionalityWhenQuestionIsUnattempted();
+
+        it('When the user tries to click on the check answer button after entering an answer multiple times then the user should be able to do so', () => {
+            cy.log('Attempting the question')
+            for (let index = 0; index < 2; index++) {
+                multipleSelectionPage.previewTabOptionsWrapper(index)
+                    .click();
+                multipleSelectionPage.checkAnswerButton()
+                    .click();
+            }
+        });
+
+        multipleSelectionPage.tests.verifyDisabledCheckAnswerButtonWithCSSAnda11y()
+
+        it('When the user updates the value of Maximum check answer attempts input field, it should get reflected on the Preview tab', () => {
+            cy.log('Switching to Edit tab');
+            multipleSelectionPage.steps.switchToEditTab();
+            multipleSelectionPage.maximumCheckAnswerAttemptsInputField()
+                .clear()
+                .type(1)
+                .should('have.value', '1');
+            cy.log('Switching to Preview tab');
+            multipleSelectionPage.steps.switchToPreviewTab();
+            multipleSelectionPage.checkAnswerButton()
+                .should('be.enabled');
+            multipleSelectionPage.previewTabOptionsWrapper(0)
+                .click();
+            multipleSelectionPage.checkAnswerButton()
+                .click();
+            multipleSelectionPage.checkAnswerButton()
+                .should('be.disabled');
+        });
+
+        it('When the \'Maximum check answer attempts\' input field has value \'0\' and user switches to Preview tab, then the \'Check Answer\' button should be enabled and user should be able to check answer multiple times', () => {
+            multipleSelectionPage.steps.switchToEditTab();
+            multipleSelectionPage.steps.clearMaximumCheckAnswerAttemptsInputField();
+            multipleSelectionPage.steps.addInputToMaximumCheckAnswerAttemptsInputField(0);
+            cy.log('Switching to Preview tab')
+            multipleSelectionPage.steps.switchToPreviewTab();
+            multipleSelectionPage.checkAnswerButton()
+                .should('be.enabled');
+            multipleSelectionPage.previewTabOptionsWrapper(0)
+                .click();
+            multipleSelectionPage.checkAnswerButton()
+                .click();
+            multipleSelectionPage.checkAnswerButton()
+                .should('be.enabled');
+        });
+
+        it('When the \'Maximum check answer attempts\' input field is kept empty and user switches to Preview tab, then the \'Check Answer\' button should be enabled and user should be able to check answer multiple times', () => {
+            cy.log('Switching to Edit tab');
+            multipleSelectionPage.steps.switchToEditTab();
+            multipleSelectionPage.maximumCheckAnswerAttemptsInputField()
+                .clear()
+                .should('have.value', '');
+            cy.log('Switching to Preview tab')
+            multipleSelectionPage.steps.switchToPreviewTab();
+            multipleSelectionPage.checkAnswerButton()
+                .should('be.enabled');
+            multipleSelectionPage.previewTabOptionsWrapper(0)
+                .click();
+            multipleSelectionPage.checkAnswerButton()
+                .click();
+            multipleSelectionPage.checkAnswerButton()
+                .should('be.enabled');
+        });
+
+        it('On selecting/deselecting more answer options, green checkmark icon and label \'Correct Answer\' should disappear', () => {
+            cy.log('Selecting another option to verify if checkmark icon and label disappear')
+            multipleSelectionPage.previewTabOptionsWrapper(2)
+                .within(() => {
+                    multipleSelectionPage.previewTabOptionsCheckbox()
+                        .click()
+                        .should('be.checked')
+                });
+            multipleSelectionPage.correctIncorrectAnswerLabel()
+                .should('not.exist');
+            multipleSelectionPage.correctIcon()
+                .should('not.exist');
+            cy.log('clicking on check answer button to make the checkmark icon and label appear again')
+            multipleSelectionPage.checkAnswerButton()
+                .click();
+            cy.log('deselecting the selected option to verify if checkmark icon and label disappear')
+            multipleSelectionPage.previewTabOptionsWrapper(2)
+                .within(() => {
+                    multipleSelectionPage.previewTabOptionsCheckbox()
+                        .click()
+                        .should('not.be.checked')
+                });
+            multipleSelectionPage.correctIncorrectAnswerLabel()
+                .should('not.exist');
+            multipleSelectionPage.correctIcon()
+                .should('not.exist');
+        });
+    });
+
+    describe('Additional Settings: Details section', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to multiple selection quetion type, adding question instructions and options and expanding additional settings accordion')
+            multipleSelectionPage.steps.navigateToCreateQuestion('multiple selection');
+            multipleSelectionPage.steps.addQuestionInstructions();
+            multipleSelectionPage.steps.addOptionsText(4);
+            multipleSelectionPage.steps.expandAdditonalSettings();
+        });
+
+        multipleSelectionPage.tests.verifyDetailsSection();
+    });
+});