itemengine-cypress-automation 1.0.13 → 1.0.14

package/cypress/e2e/ILC/ShortTextResponse/shortTextResponseAdditionalSettingsBasic.js

@@ -0,0 +1,336 @@
+import { shortTextResponsePage } from "../../../pages";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+const css = Cypress.env('css');
+
+describe('Short text response - Additional settings', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Additional Settings accordion', () => {
+        abortEarlySetup();
+        before(() => {
+            shortTextResponsePage.steps.navigateToCreateQuestion('short text response');
+        });
+
+        shortTextResponsePage.tests.verifyAdditonalSettingsAccordionProperties();
+    });
+
+    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')
+            shortTextResponsePage.steps.navigateToCreateQuestion('short text response');
+            shortTextResponsePage.questionInstructionsInputField()
+                .type('Question Instructions');
+            shortTextResponsePage.pointsInputField()
+                .type('4');
+            shortTextResponsePage.setCorrectAnswerResponseField()
+                .type('Answer input');
+            shortTextResponsePage.steps.expandAdditonalSettings();
+        });
+
+        shortTextResponsePage.tests.verifyFontSizeSectionContents();
+
+        //Failing due to https://redmine.zeuslearning.com/issues/526873
+        const fontsizes = ['Default', 'Small', 'Normal', 'Large', 'Extra large', 'Huge'];
+        const font = ['16px', '12px', '14px', '17px', '20px', '24px'];
+        fontsizes.forEach((option, count) => {
+            it(`When the user selects \'${option}\' option from the Font Size dropdown, then font size of the preview tab contents should be changed to ${option} in the \'Set Correct Answer\' section as well as in the \'Preview\' tab`, () => {
+                shortTextResponsePage.fontSizeDropdown()
+                    .click();
+                shortTextResponsePage.fontSizeListOptions(count)
+                    .click();
+                shortTextResponsePage.fontSizeDropdown()
+                    .verifyInnerText(`${option}`);
+                cy.log('Checking correct answer section font size')
+                shortTextResponsePage.setCorrectAnswerResponseField()
+                    .should('have.css', 'font-size', font[count]);
+                cy.log('Switching to Preview tab')
+                shortTextResponsePage.steps.switchToPreviewTab();
+                cy.log('Checking Preview section font size')
+                shortTextResponsePage.questionInstructionsText()
+                    .should('have.css', 'font-size', font[count]);
+                shortTextResponsePage.previewTabResponseField()
+                    .should('have.css', 'font-size', font[count]);
+                shortTextResponsePage.steps.switchToEditTab();
+            });
+        });
+    });
+
+    describe('Additional Settings: Spell check section', () => {
+        abortEarlySetup();
+        before(() => {
+            shortTextResponsePage.steps.navigateToCreateQuestion('short text response');
+            shortTextResponsePage.steps.expandAdditonalSettings();
+        });
+
+        it('\'Spell check\' functionality label and checkbox should be displayed and by default it should be unchecked', () => {
+            shortTextResponsePage.spellCheckLabel()
+                .verifyInnerText('Spell check');
+            shortTextResponsePage.spellCheckCheckbox()
+                .should('not.be.checked');
+        });
+
+        it('CSS of \'Spell check\' section - unchecked state', { tags: 'css' }, () => {
+            shortTextResponsePage.spellCheckCheckbox()
+                .parent()
+                .find('svg')
+                .should('have.css', 'fill', css.color.uncheckedCheckbox);
+        });
+
+        //Note: a11y covered in Additional settings accordion, verifyAdditonalSettingsAccordionProperties
+
+        //Spell check test cases for set correct answer section response field
+        it('When the \'Spell check\' functionality is disabled, the response field should have \'spellcheck\' attribute set as \'false\' in set correct answer section', () => {
+            shortTextResponsePage.setCorrectAnswerResponseFieldWrapper()
+                .should('have.attr', 'spellcheck', 'false');
+        });
+
+        it('When the \'Spell check\' functionality is enabled, the response field should have \'spellcheck\' attribute set as \'true\' in set correct answer section', () => {
+            shortTextResponsePage.spellCheckCheckbox()
+                .click()
+                .should('be.checked');
+            shortTextResponsePage.setCorrectAnswerResponseFieldWrapper()
+                .should('have.attr', 'spellcheck', 'true');
+        });
+
+        it('CSS of \'Spell check\' section - checked state', { tags: 'css' }, () => {
+            shortTextResponsePage.spellCheckLabel()
+                .verifyCSS(css.color.labelText, css.fontSize.normal, css.fontWeight.regular);
+            shortTextResponsePage.spellCheckCheckbox()
+                .parent('.icon-checkbox-selected')
+                .find('.checkbox-icon-border-rect')
+                .should('have.css', 'fill', css.color.activeButtons);
+        });
+
+        it('Accessibility of \'Spell check\' section - checked state', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(shortTextResponsePage.spellCheckLabel().parents('.spell-check-checkbox-wrapper'))
+        });
+
+        //Spell check test cases for preview tab response field
+        it('When the \'Spell check\' functionality is disabled, the response field should have \'spellcheck\' attribute set as \'false\' in preview tab', () => {
+            shortTextResponsePage.spellCheckCheckbox()
+                .click()
+                .should('not.be.checked');
+            shortTextResponsePage.steps.switchToPreviewTab();
+            shortTextResponsePage.previewTabResponseFieldWrapper()
+                .should('have.attr', 'spellcheck', 'false');
+        });
+
+        it('When the \'Spell check\' functionality is enabled, the response field should have \'spellcheck\' attribute set as \'true\' in the preview tab', () => {
+            cy.log('Pre step: Switching to Edit tab')
+            shortTextResponsePage.steps.switchToEditTab();
+            shortTextResponsePage.spellCheckCheckbox()
+                .click()
+                .should('be.checked');
+            shortTextResponsePage.steps.switchToPreviewTab();
+            shortTextResponsePage.previewTabResponseFieldWrapper()
+                .should('have.attr', 'spellcheck', 'true');
+        });
+    });
+
+    describe('Additional Settings: Check Answer', () => {
+        abortEarlySetup();
+        before(() => {
+            shortTextResponsePage.steps.navigateToCreateQuestion('short text response');
+            shortTextResponsePage.questionInstructionsInputField()
+                .type('Question Instructions');
+            shortTextResponsePage.pointsInputField()
+                .type('4');
+            shortTextResponsePage.setCorrectAnswerResponseField()
+                .type('Answer input');
+            shortTextResponsePage.steps.expandAdditonalSettings();
+        });
+
+        shortTextResponsePage.tests.verifyCheckAnswerSectionAndPreviewTabCheckAnswerButton();
+    });
+
+    describe('Additional Settings: Check Answer - Functionality', () => {
+        abortEarlySetup();
+        before(() => {
+            shortTextResponsePage.steps.navigateToCreateQuestion('short text response');
+            shortTextResponsePage.questionInstructionsInputField()
+                .type('Question Instructions');
+            shortTextResponsePage.pointsInputField()
+                .type('4');
+            shortTextResponsePage.setCorrectAnswerResponseField()
+                .type('Response')
+                .should('have.value', 'Response');
+            shortTextResponsePage.steps.expandAdditonalSettings();
+            shortTextResponsePage.steps.setMaximumCheckAnswerAttempts(2);
+            shortTextResponsePage.steps.switchToPreviewTab();
+        });
+
+        it('When the user has not set any response then on clicking on the Check Answer button, icons should not be displayed beside both empty response, Correct/Incorrect label or border should not be displayed and \'Correct answer\' container should not be displayed below the question', () => {
+            shortTextResponsePage.previewTabResponseField()
+                .should('have.value', '');
+            shortTextResponsePage.checkAnswerButton()
+                .click();
+            shortTextResponsePage.correctIcon()
+                .should('not.exist');
+            shortTextResponsePage.incorrectIcon()
+                .should('not.exist');
+            shortTextResponsePage.correctIncorectAnswerLabel()
+                .should('not.exist');
+            shortTextResponsePage.correctIncorrectAnswerBorder()
+                .should('not.exist');
+            shortTextResponsePage.previewTabCorrectAnswerContainer()
+                .should('not.exist');
+        });
+
+        it('When the user has added correct response then on clicking on the Check Answer button, green checkmark icon should be displayed, Correct/Incorrect label or border should not be displayed and \'Correct answer\' container should not be displayed below the question', () => {
+            shortTextResponsePage.previewTabResponseField()
+                .clear()
+                .type('Response')
+                .should('have.value', 'Response');
+            shortTextResponsePage.checkAnswerButton()
+                .click();
+            shortTextResponsePage.steps.verifyCorrectOptionCheckmarkIcon()
+            shortTextResponsePage.correctIncorectAnswerLabel()
+                .should('not.exist');
+            shortTextResponsePage.correctIncorrectAnswerBorder()
+                .should('not.exist');
+            shortTextResponsePage.previewTabCorrectAnswerContainer()
+                .should('not.exist');
+        });
+
+        it('When the user has added incorrect response then on clicking on the Check Answer button, red crossmark icon should be displayed, Incorrect label or border should not be displayed and \'Correct answer\' container should not be displayed below the question', () => {
+            shortTextResponsePage.previewTabResponseField()
+                .clear()
+                .type('Incorrect Response')
+                .should('have.value', 'Incorrect Response');
+            shortTextResponsePage.checkAnswerButton()
+                .click();
+            shortTextResponsePage.steps.verifyIncorrectOptionCrossmarkIcon()
+            shortTextResponsePage.correctIncorectAnswerLabel()
+                .should('not.exist');
+            shortTextResponsePage.correctIncorrectAnswerBorder()
+                .should('not.exist');
+            shortTextResponsePage.previewTabCorrectAnswerContainer()
+                .should('not.exist');
+        });
+
+        it('The \'Check Answer\' button should become disabled once user has reached maximum check answer attempts', () => {
+            shortTextResponsePage.checkAnswerButton()
+                .should('be.disabled');
+        });
+
+        it('CSS of disabled \'Check Answer\' button', { tags: 'css' }, () => {
+            shortTextResponsePage.checkAnswerButton()
+                .verifyCSS(css.color.primaryBtnDisabled, css.fontSize.default, css.fontWeight.regular);
+        });
+
+        it('Accessibility of disabled Check Answer button', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(shortTextResponsePage.checkAnswerButton());
+        });
+
+        it('When the user updates the value of Maximum check answer attempts input field, it should get reflected on the Preview tab', () => {
+            cy.log('Pre step: Switching to Edit tab')
+            shortTextResponsePage.steps.switchToEditTab();
+            shortTextResponsePage.maximumCheckAnswerAttemptsInputField()
+                .clear()
+                .type(1)
+                .should('have.value', '1');
+            cy.log('Switching to Preview tab');
+            shortTextResponsePage.steps.switchToPreviewTab();
+            shortTextResponsePage.checkAnswerButton()
+                .should('be.enabled');
+            shortTextResponsePage.previewTabResponseField()
+                .type('Response');
+            shortTextResponsePage.checkAnswerButton()
+                .click()
+                .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', () => {
+            shortTextResponsePage.steps.switchToEditTab();
+            shortTextResponsePage.steps.clearMaximumCheckAnswerAttemptsInputField();
+            shortTextResponsePage.steps.addInputToMaximumCheckAnswerAttemptsInputField(0);
+            cy.log('Switching to Preview tab');
+            shortTextResponsePage.steps.switchToPreviewTab();
+            shortTextResponsePage.checkAnswerButton()
+                .should('be.enabled');
+            shortTextResponsePage.previewTabResponseField()
+                .type('Incorrect Response');
+            cy.log('Clicking on \'Check Answer\' to check state of \'Check Answer\' to be enabled')
+            shortTextResponsePage.checkAnswerButton()
+                .click();
+            shortTextResponsePage.checkAnswerButton()
+                .should('be.enabled');
+            shortTextResponsePage.steps.verifyIncorrectOptionCrossmarkIcon();
+            shortTextResponsePage.correctIncorectAnswerLabel()
+                .should('not.exist');
+            shortTextResponsePage.correctIncorrectAnswerBorder()
+                .should('not.exist');
+            shortTextResponsePage.previewTabCorrectAnswerContainer()
+                .should('not.exist');
+            cy.log('As the user is able to check answer multiple times, verifying state of \'Check Answer\' to be enabled by adding different response and checking answer again')
+            shortTextResponsePage.previewTabResponseField()
+                .clear()
+                .type('Response');
+            shortTextResponsePage.checkAnswerButton()
+                .click();
+            shortTextResponsePage.steps.verifyCorrectOptionCheckmarkIcon();
+            shortTextResponsePage.correctIncorectAnswerLabel()
+                .should('not.exist');
+            shortTextResponsePage.correctIncorrectAnswerBorder()
+                .should('not.exist');
+            shortTextResponsePage.previewTabCorrectAnswerContainer()
+                .should('not.exist');
+            shortTextResponsePage.checkAnswerButton()
+                .should('be.enabled');
+        });
+
+        it('When the \'Maximum check answer attempts\' input field is 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('Pre step: Switching to Edit tab')
+            shortTextResponsePage.steps.switchToEditTab();
+            shortTextResponsePage.maximumCheckAnswerAttemptsInputField()
+                .clear()
+                .should('have.value', '');
+            cy.log('Switching to Preview tab');
+            shortTextResponsePage.steps.switchToPreviewTab();
+            shortTextResponsePage.checkAnswerButton()
+                .should('be.enabled');
+            shortTextResponsePage.previewTabResponseField()
+                .type('Incorrect Response');
+            cy.log('Clicking on \'Check Answer\' to check state of \'Check Answer\' to be enabled')
+            shortTextResponsePage.checkAnswerButton()
+                .click();
+            shortTextResponsePage.checkAnswerButton()
+                .should('be.enabled');
+            shortTextResponsePage.steps.verifyIncorrectOptionCrossmarkIcon();
+            shortTextResponsePage.correctIncorectAnswerLabel()
+                .should('not.exist');
+            shortTextResponsePage.correctIncorrectAnswerBorder()
+                .should('not.exist');
+            shortTextResponsePage.previewTabCorrectAnswerContainer()
+                .should('not.exist');
+            cy.log('As the user is able to check answer multiple times, verifying state of \'Check Answer\' to be enabled by adding different response and checking answer again')
+            shortTextResponsePage.previewTabResponseField()
+                .clear()
+                .type('Response');
+            shortTextResponsePage.checkAnswerButton()
+                .click();
+            shortTextResponsePage.steps.verifyCorrectOptionCheckmarkIcon();
+            shortTextResponsePage.correctIncorectAnswerLabel()
+                .should('not.exist');
+            shortTextResponsePage.correctIncorrectAnswerBorder()
+                .should('not.exist');
+            shortTextResponsePage.previewTabCorrectAnswerContainer()
+                .should('not.exist');
+            shortTextResponsePage.checkAnswerButton()
+                .should('be.enabled');
+        });
+    });
+
+    describe('Additional Settings: Details section', () => {
+        abortEarlySetup();
+        before(() => {
+            shortTextResponsePage.steps.navigateToCreateQuestion('short text response');
+            shortTextResponsePage.steps.expandAdditonalSettings();
+        });
+
+        shortTextResponsePage.tests.verifyDetailsSection();
+    });
+});

package/cypress/e2e/ILC/ShortTextResponse/shortTextResponseConditionalCheckboxes.js

@@ -0,0 +1,154 @@
+import { shortTextResponsePage } from "../../../pages";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+const css = Cypress.env('css');
+
+describe('Create item page - Short text response: \'Case sensitive\' and \'Ignore spaces before and after\'', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('User can select different property (Exact or Contains text) across multiple set answer tabs (Correct answer tab and Alternate answer tabs)', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Short text response question type, giving input to question instruction input field, points input field and response input field, checking the allow students to check answer checkbox and switching to preview tab');
+            shortTextResponsePage.steps.navigateToCreateQuestion('short text response');
+            shortTextResponsePage.questionInstructionsInputField()
+                .type('Question Instructions');
+            cy.log('Setting \'Exact\' property to the Correct tab and \'Contains text\' property to the \'Alternate 1\' tab');
+            shortTextResponsePage.pointsInputField()
+                .type('2');
+            shortTextResponsePage.setCorrectAnswerResponseField()
+                .type('Lorem ipsum');
+            cy.log('Adding an alternate correct answer set with more points value');
+            shortTextResponsePage.steps.addAlternateTab(1);
+            shortTextResponsePage.pointsInputField()
+                .type('4');
+            shortTextResponsePage.setCorrectAnswerResponseField()
+                .type('Answer input');
+            shortTextResponsePage.containsTextRadioButton()
+                .click();
+            shortTextResponsePage.steps.expandAdditonalSettings();
+            shortTextResponsePage.allowStudentsToCheckAnswerCheckbox()
+                .click();
+            shortTextResponsePage.steps.switchToPreviewTab();
+        });
+
+        it('When user gives an answer that is exactly same as the set correct answer text of \'Correct\' tab in the answer input field, then full score as per the points set for that tab should be displayed and when user clicks on \'Check answer\' button, a green check mark should be displayed beside the answer', () => {
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('Lorem ipsum', '2/4', true);
+        });
+
+        it('When user gives an answer that contains the set correct answer text of \'Correct\' tab in the answer but not exact, then the score should be displayed as 0 points and when user clicks on \'Check answer\' button, a red cross mark should be displayed beside the answer', () => {
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('Lorem ipsum dolor', '0/4', false);
+        });
+
+        it('When user gives an answer that contains the set correct answer text of \'Alternate 1\' tab in the answer input field but not exact, then full score should be displayed and when user clicks on \'Check answer\' button, a green check mark should be displayed beside the answer', () => {
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('this is an Answer input', '4/4', true);
+        });
+
+        it('When user gives an answer that does not contain the set correct answer text of \'Alternate 1\' tab in the answer input field, then the score should be displayed as 0 points and when user clicks on \'Check answer\' button, a red cross mark should be displayed beside the answer', () => {
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('Answerinput', '0/4', false);
+        });
+    });
+
+    describe('\'Case sensitive\' property should be applied globally to all the set correct answer tabs (Correct answer tab and Alternate answer tabs)', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Short text response question type, giving input to question instruction input field, points input field and response input field, checking the allow students to check answer checkbox and switching to preview tab');
+            shortTextResponsePage.steps.navigateToCreateQuestion('short text response');
+            shortTextResponsePage.questionInstructionsInputField()
+                .type('Question Instructions');
+            cy.log('Setting \'Exact\' property to the Correct tab and \'Contains text\' property to the \'Alternate 1\' tab');
+            shortTextResponsePage.pointsInputField()
+                .type('2');
+            shortTextResponsePage.setCorrectAnswerResponseField()
+                .type('Lorem ipsum');
+            cy.log('Adding an alternate correct answer set with more points value');
+            shortTextResponsePage.steps.addAlternateTab(1);
+            shortTextResponsePage.pointsInputField()
+                .type('4');
+            shortTextResponsePage.setCorrectAnswerResponseField()
+                .type('Answer input');
+            shortTextResponsePage.containsTextRadioButton()
+                .click();
+            shortTextResponsePage.steps.expandAdditonalSettings();
+            shortTextResponsePage.allowStudentsToCheckAnswerCheckbox()
+                .click();
+            shortTextResponsePage.steps.switchToPreviewTab();
+        });
+
+        it('\'Case sensitive\' property unchecked : When the user enters correct answer with identical casing, appropriate points should be given for both the correct answer and alternate answer tab responses and when user clicks on \'Check answer\' button, a green check mark should be displayed beside the answer', () => {
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('Lorem ipsum', '2/4', true);
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('Answer input', '4/4', true);
+        });
+
+        it('\'Case sensitive\' property unchecked : When the user enters correct answer with incorrect casing, appropriate points should be given for both the correct answer and alternate answer tab responses and when user clicks on \'Check answer\' button, a green check mark should be displayed beside the answer', () => {
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('lorem ipsum', '2/4', true);
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('answer input', '4/4', true);
+        });
+
+        it('\'Case sensitive\' property checked : When the user enters correct answer with identical casing, appropriate points should be given for both the correct answer and alternate answer tab responses and when user clicks on \'Check answer\' button, a green check mark should be displayed beside the answer', () => {
+            cy.log('Pre -step : Go to Edit tab, check \'Case sensitive\' checkbox and switch back to Preview tab');
+            shortTextResponsePage.steps.switchToEditTab();
+            shortTextResponsePage.caseSensitiveCheckbox()
+                .click();
+            shortTextResponsePage.steps.switchToPreviewTab();
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('Lorem ipsum', '2/4', true);
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('Answer input', '4/4', true);
+        });
+
+        it('\'Case sensitive\' property checked : When the user enters correct answer with incorrect casing, then the score should be displayed as 0 points and when user clicks on \'Check answer\' button, a red cross mark should be displayed beside the answer', () => {
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('lorem ipsum', '0/4', false);
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('answer input', '0/4', false);
+        });
+    });
+
+    describe('\'Ignore spaces before and after\' property should be applied globally to all the set correct answer tabs (Correct answer tab and Alternate answer tabs)', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Short text response question type, giving input to question instruction input field, points input field and response input field, checking the allow students to check answer checkbox and switching to preview tab');
+            shortTextResponsePage.steps.navigateToCreateQuestion('short text response');
+            shortTextResponsePage.questionInstructionsInputField()
+                .type('Question Instructions');
+            cy.log('Setting \'Exact\' property in both tabs as \'Contains text\' property by default functions like \'Ignore spaces before and after\' property');
+            shortTextResponsePage.pointsInputField()
+                .type('2');
+            shortTextResponsePage.setCorrectAnswerResponseField()
+                .type('Lorem ipsum');
+            cy.log('Adding an alternate correct answer set with more points value');
+            shortTextResponsePage.steps.addAlternateTab(1);
+            shortTextResponsePage.pointsInputField()
+                .type('4');
+            shortTextResponsePage.setCorrectAnswerResponseField()
+                .type('Answer input');
+            shortTextResponsePage.steps.expandAdditonalSettings();
+            shortTextResponsePage.allowStudentsToCheckAnswerCheckbox()
+                .click();
+            shortTextResponsePage.steps.switchToPreviewTab();
+        });
+
+        it('\'Ignore spaces before and after\' property checked : When the user enters correct answer with extra spaces before and after, appropriate points should be given for both the correct answer and alternate answer tab responses and when user clicks on \'Check answer\' button, a green check mark should be displayed beside the answer', () => {
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('   Lorem ipsum   ', '2/4', true);
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('   Answer input   ', '4/4', true);
+        });
+
+        it('\'Ignore spaces before and after\' property checked : When the user enters correct answer without extra spaces before and after, appropriate points should be given for both the correct answer and alternate answer tab responses and when user clicks on \'Check answer\' button, a green check mark should be displayed beside the answer', () => {
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('Lorem ipsum', '2/4', true);
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('Answer input', '4/4', true);
+        });
+
+        it('\'Ignore spaces before and after\' property unchecked : When the user enters correct answer with extra spaces before and after, appropriate points should be given for both the correct answer and alternate answer tab responses and when user clicks on \'Check answer\' button, a green check mark should be displayed beside the answer', () => {
+            cy.log('Pre - step : Go to Edit tab, uncheck \'Ignore spaces before and after\' checkbox and switch back to Preview tab');
+            shortTextResponsePage.steps.switchToEditTab();
+            shortTextResponsePage.ignoreSpacesBeforeAndAfterCheckbox()
+                .click();
+            shortTextResponsePage.steps.switchToPreviewTab();
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('   Lorem ipsum   ', '0/4', false);
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('   Answer input   ', '0/4', false);
+        });
+
+        it('\'Ignore spaces before and after property\' unchecked : When the user enters correct answer without extra spaces before and after, appropriate points should be given for both the correct answer and alternate answer tab responses and when user clicks on \'Check answer\' button, a green check mark should be displayed beside the answer', () => {
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('Lorem ipsum', '2/4', true);
+            shortTextResponsePage.tests.verifyAnswerInputScoreAndCorrectIncorrectAnswerLabel('Answer input', '4/4', true);
+        });
+    });
+});