itemengine-cypress-automation 1.0.36 → 1.0.37

package/cypress/e2e/ILC/ListSorting/listSortingAdditionalSettingsOptionLabelSection.js

@@ -0,0 +1,202 @@
+import { listSortingPage } from "../../../pages/listSortingPage";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+const css = Cypress.env('css');
+
+let options = ['plant', 'sprout', 'flower', 'seed'];
+let correctAnswerArray = ['seed', 'sprout', 'plant', 'flower'];
+
+describe('Create Item page - list sorting: Additional settings - Option label section', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Additional settings: Option label section contents', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to list sorting question type');
+            listSortingPage.steps.navigateToCreateQuestion('list sorting');
+            cy.log('Adding question instructions, setting correct answer order and adding points for Autoscored scoring type and switching to Preview tab');
+            cy.barsPreLoaderWait();
+            listSortingPage.steps.addQuestionInstructions();
+            listSortingPage.steps.addInputToOptionsInputField(options);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('seed', 0);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('sprout', 1);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('plant', 2);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('flower', 3);
+            listSortingPage.steps.verifyTargetOptionsTextContentInSetCorrectAnswerSection(correctAnswerArray);
+            listSortingPage.steps.allotPoints('20');
+            listSortingPage.steps.expandAdditonalSettings();
+        });
+
+        it('\'Option label\' should be displayed', () => {
+            utilities.verifyInnerText(listSortingPage.optionLabelLabel(), 'Option label');
+            utilities.verifyElementVisibilityState(listSortingPage.optionLabelLabel(), 'visible');
+        });
+
+        it('\'Include option labels\' label and checkbox should be displayed and it should be unchecked by default', () => {
+            utilities.verifyInnerText(listSortingPage.includeLabelsLabel(), 'Include option labels');
+            utilities.verifyElementVisibilityState(listSortingPage.includeLabelsCheckbox(), 'exist');
+            listSortingPage.steps.verifyIncludeLablesCheckboxIsUnchecked()
+        });
+
+        it('\'Top label\' and \'Bottom label\' labels and input fields should be displayed and they should be disabled by default', () => {
+            utilities.verifyInnerText(listSortingPage.topLabelLabel(), 'Top label');
+            utilities.verifyElementVisibilityState(listSortingPage.topLabelInputField(), 'exist');
+            listSortingPage.steps.verifyTopLabelInputFieldDisabled();
+            utilities.verifyInnerText(listSortingPage.bottomLabelLabel(), 'Bottom label');
+            utilities.verifyElementVisibilityState(listSortingPage.bottomLabelInputField(), 'exist');
+            listSortingPage.steps.verifyBottomLabelInputFieldDisabled();
+        });
+
+        it('When the user selects \'Include option labels\' checkbox then the \'Top label\' and \'Bottom label\' input fields should be enabled', () => {
+            listSortingPage.steps.checkIncludeLablesCheckbox();
+            listSortingPage.steps.verifyTopLabelInputFieldEnabled();
+            listSortingPage.steps.verifyBottomLabelInputFieldEnabled();
+        });
+
+        it('When the \'Include option labels\' checkbox is checked user should be able to add inputs to \'Top label\' and \'Bottom label\' input fields', () => {
+            listSortingPage.steps.addInputToTopLabelInputField('Top label');
+            listSortingPage.steps.addInputToBottomLabelInputField('Bottom label');
+        });
+
+        it('CSS of \'Option label\' section', { tags: 'css' }, () => {
+            utilities.verifyCSS(listSortingPage.optionLabelLabel(), {
+                'color': css.color.labels,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.semibold
+            });
+            utilities.verifyCSS(listSortingPage.includeLabelsLabel(), {
+                'color': css.color.labelText,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.regular
+            });
+            utilities.verifyCSS(listSortingPage.includeLabelsCheckbox().parents('.ngie-checkbox').find('svg g').eq(1), {
+                'fill': css.color.activeButtons
+            });
+            utilities.verifyCSS(listSortingPage.topLabelLabel(), {
+                'color': css.color.labels,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.semibold
+            });
+            utilities.verifyCSS(listSortingPage.topLabelInputField(), {
+                'color': css.color.text,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.regular
+            });
+            utilities.verifyCSS(listSortingPage.bottomLabelLabel(), {
+                'color': css.color.labels,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.semibold
+            });
+            utilities.verifyCSS(listSortingPage.bottomLabelInputField(), {
+                'color': css.color.text,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.regular
+            });
+        });
+
+        it('Accessibility of Option label section', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(listSortingPage.optionLabelLabel().parents('.special-character-wrapper'))
+        });
+    });
+
+    describe('Additional settings: Option label set correct answer section', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to list sorting question type');
+            listSortingPage.steps.navigateToCreateQuestion('list sorting');
+            cy.log('Adding question instructions, setting correct answer order and adding points for Autoscored scoring type and switching to Preview tab');
+            cy.barsPreLoaderWait();
+            listSortingPage.steps.addQuestionInstructions();
+            listSortingPage.steps.addInputToOptionsInputField(options);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('seed', 0);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('sprout', 1);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('plant', 2);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('flower', 3);
+            listSortingPage.steps.verifyTargetOptionsTextContentInSetCorrectAnswerSection(correctAnswerArray);
+            listSortingPage.steps.allotPoints('20');
+            listSortingPage.steps.expandAdditonalSettings();
+            listSortingPage.steps.checkIncludeLablesCheckbox();
+        });
+
+        it('When user adds input to \'Top label\' then it should be displayed at the top of the options in the \'Set correct answer\' section', () => {
+            listSortingPage.steps.addInputToTopLabelInputField('Top label');
+            utilities.verifyInnerText(listSortingPage.setCorrectAnswerSectionTopLabel(), 'Top label');
+            utilities.verifyElementVisibilityState(listSortingPage.setCorrectAnswerSectionBottomLabel(), 'notExist');
+            cy.log('Post step: Clear top label input field')
+            listSortingPage.steps.clearTopLabelInputField();
+        });
+
+        it('When user adds input to \'Bottom label\' then it should be displayed at the bottom of the options in the \'Set correct answer\' section ', () => {
+            listSortingPage.steps.addInputToBottomLabelInputField('Bottom label');
+            utilities.verifyInnerText(listSortingPage.setCorrectAnswerSectionBottomLabel(), 'Bottom label');
+            utilities.verifyElementVisibilityState(listSortingPage.setCorrectAnswerSectionTopLabel(), 'notExist');
+        });
+
+        it('When user adds input to both \'Top label\' and  \'Bottom label\' then it should be displayed at the top and bottom of the options in the \'Set correct answer\' section respectively', () => {
+            listSortingPage.steps.addInputToTopLabelInputField('Top label');
+            utilities.verifyInnerText(listSortingPage.setCorrectAnswerSectionTopLabel(), 'Top label');
+            utilities.verifyInnerText(listSortingPage.setCorrectAnswerSectionBottomLabel(), 'Bottom label');
+        });
+
+        it('When user unchecks the \'Include option labels\' checkbox then the labels should not be displayed in the \'Set correct answer\' section', () => {
+            listSortingPage.steps.uncheckIncludeLablesCheckbox();
+            utilities.verifyElementVisibilityState(listSortingPage.setCorrectAnswerSectionTopLabel(), 'notExist');
+            utilities.verifyElementVisibilityState(listSortingPage.setCorrectAnswerSectionBottomLabel(), 'notExist');
+        });
+    });
+
+    describe('Additional settings: Option label preview tab', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to list sorting question type');
+            listSortingPage.steps.navigateToCreateQuestion('list sorting');
+            cy.log('Adding question instructions, setting correct answer order and adding points for Autoscored scoring type and switching to Preview tab');
+            cy.barsPreLoaderWait();
+            listSortingPage.steps.addQuestionInstructions();
+            listSortingPage.steps.addInputToOptionsInputField(options);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('seed', 0);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('sprout', 1);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('plant', 2);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('flower', 3);
+            listSortingPage.steps.verifyTargetOptionsTextContentInSetCorrectAnswerSection(correctAnswerArray);
+            listSortingPage.steps.allotPoints('20');
+            listSortingPage.steps.expandAdditonalSettings();
+            listSortingPage.steps.checkIncludeLablesCheckbox();
+        });
+
+        it('When user adds input to \'Top label\' then it should be displayed at the top of the options in the \'Preview tab\'', () => {
+            listSortingPage.steps.addInputToTopLabelInputField('Top label');
+            listSortingPage.steps.switchToPreviewTab();
+            utilities.verifyInnerText(listSortingPage.previewTabTopLabel(), 'Top label');
+            utilities.verifyElementVisibilityState(listSortingPage.previewTabBottomLabel(), 'notExist');
+            listSortingPage.steps.switchToEditTab();
+            cy.log('Post step: Clear top label input field')
+            listSortingPage.steps.clearTopLabelInputField();
+        });
+
+        it('When user adds input to \'Bottom label\' then it should be displayed at the bottom of the options in the \'Preview tab\' ', () => {
+            listSortingPage.steps.addInputToBottomLabelInputField('Bottom label');
+            listSortingPage.steps.switchToPreviewTab();
+            utilities.verifyInnerText(listSortingPage.previewTabBottomLabel(), 'Bottom label');
+            utilities.verifyElementVisibilityState(listSortingPage.previewTabTopLabel(), 'notExist');
+        });
+
+        it('When user adds input to both \'Top label\' and  \'Bottom label\' then it should be displayed at the top and bottom of the options in the \'Preview tab\' respectively', () => {
+            listSortingPage.steps.switchToEditTab();
+            listSortingPage.steps.addInputToTopLabelInputField('Top label');
+            listSortingPage.steps.switchToPreviewTab();
+            utilities.verifyInnerText(listSortingPage.previewTabTopLabel(), 'Top label');
+            utilities.verifyInnerText(listSortingPage.previewTabBottomLabel(), 'Bottom label');
+        });
+
+        it('When user unchecks the \'Include option labels\' checkbox then the labels should not be displayed in the \'Preview tab\'', () => {
+            listSortingPage.steps.switchToEditTab();
+            listSortingPage.steps.uncheckIncludeLablesCheckbox();
+            listSortingPage.steps.switchToPreviewTab();
+            utilities.verifyElementVisibilityState(listSortingPage.previewTabTopLabel(), 'notExist');
+            utilities.verifyElementVisibilityState(listSortingPage.previewTabBottomLabel(), 'notExist');
+        });
+    });
+});

package/cypress/e2e/ILC/ListSorting/listSortingAllOrNothingScoring.js

@@ -0,0 +1,188 @@
+import { listSortingPage } from "../../../pages/listSortingPage";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+
+let options = ['plant', 'sprout', 'flower', 'seed'];
+let correctAnswerArray = ['seed', 'sprout', 'plant', 'flower'];
+
+describe('Create item page - List sorting: All or nothing scoring', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Show correct answer', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to list sorting question type');
+            listSortingPage.steps.navigateToCreateQuestion('list sorting');
+            cy.barsPreLoaderWait();
+            listSortingPage.steps.addQuestionInstructions();
+            listSortingPage.steps.addInputToOptionsInputField(options);
+        });
+
+        //Failing due to - https://redmine.zeuslearning.com/issues/539911
+        listSortingPage.tests.verifyShowCorrectAnswerAndPointsInPreviewTabWhenNoCorrectAnswerIsSet()
+
+        it('When the user has set correct answer options and alloted points \'Show correct answer\' checkbox should be displayed and it should be unchecked by default and points for the question should be displayed beside it', () => {
+            listSortingPage.steps.switchToEditTab();
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('seed', 0);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('sprout', 1);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('plant', 2);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('flower', 3);
+            listSortingPage.steps.verifyTargetOptionsTextContentInSetCorrectAnswerSection(correctAnswerArray);
+            listSortingPage.steps.allotPoints('15');
+            listSortingPage.steps.switchToPreviewTab();
+            listSortingPage.steps.verifyDefaultShowCorrectAnswerCheckboxAndLabel();
+            listSortingPage.steps.verifyPreviewTabScoreText(0, 15);
+        });
+
+        it('When the user attempts question in preview tab and switches to edit tab, then on re-switching to the preview tab users response should not persist', () => {
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('seed', 0);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('sprout', 1);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('plant', 2);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('flower', 3);
+            listSortingPage.steps.verifyTargetOptionsTextContentInPreviewTab(correctAnswerArray)
+            listSortingPage.steps.resetQuestionPreview();
+            listSortingPage.steps.verifySourceOptionsTextContentInPreviewTab(options);
+            listSortingPage.steps.verifyCorrectAnswerContainerDoesNotExist();
+        });
+    });
+
+    describe('Question Preview: AutoScored - All or Nothing', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to list sorting question type');
+            listSortingPage.steps.navigateToCreateQuestion('list sorting');
+            cy.log('Adding question instructions, setting correct answer order and adding points for Autoscored scoring type and switching to Preview tab');
+            cy.barsPreLoaderWait();
+            listSortingPage.steps.addQuestionInstructions();
+            listSortingPage.steps.addInputToOptionsInputField(options);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('seed', 0);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('sprout', 1);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('plant', 2);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInSetCorrectAnswerSection('flower', 3);
+            listSortingPage.steps.verifyTargetOptionsTextContentInSetCorrectAnswerSection(correctAnswerArray);
+            listSortingPage.steps.allotPoints('20');
+            listSortingPage.steps.expandAdditonalSettings();
+            listSortingPage.steps.checkAllowStudentsToCheckAnswerCheckbox();
+            listSortingPage.steps.switchToPreviewTab();
+        });
+
+        listSortingPage.tests.verifyCSSOfPreviewAndEditTabAndScoringContents();
+
+        listSortingPage.tests.verifya11yOfCreateItemWrapperContents();
+
+        it('When the user selects \'Show correct answer\' checkbox without attempting the question, correct/incorrect border or icons should not be displayed, a correct answer container with \'Correct answers:\' label and all correct answers with numeration should be displayed below the question preview', () => {
+            listSortingPage.steps.checkShowCorrectAnswerCheckbox();
+            listSortingPage.steps.verifyPreviewTabScoreText(0, 20);
+            listSortingPage.steps.verifyCorrectIncorrectBorderNotExists();
+            listSortingPage.steps.verifyCorrectIncorrectIconsDoesNotExist();
+            listSortingPage.steps.verifyCorrectAnswerContainerContents(correctAnswerArray, ['1', '2', '3', '4']);
+            utilities.verifyInnerText(listSortingPage.correctAnswerContainerCorrectAnswersLabel(), 'Correct answers:');
+        });
+
+        it('When user selects Check answer button without attempting the question, correct/incorrect answer border for the question and label should not be displayed below the question preview and correct answer container should not be displayed', () => {
+            cy.log('Pre-step: Deselect the show correct checkbox')
+            listSortingPage.steps.uncheckShowCorrectAnswerCheckbox()
+            listSortingPage.steps.checkAnswer();
+            listSortingPage.steps.verifyCorrectIncorrectBorderNotExists();
+            listSortingPage.steps.verifyCorrectIncorrectIconsDoesNotExist();
+            listSortingPage.steps.verifyCorrectAnswerContainerDoesNotExist();
+        });
+
+        it('When user attempts the question incorrectly then on selecting \'Show correct answer\' checkbox, the user should be awarded 0 points and red cross-mark icons should be displayed beside all incorrect the options, a label \'Incorrect answer\' and border should be displayed below the question preview and the correct answer container with all correct answers along with numeration should be displayed', () => {
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('flower', 0);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('plant', 1);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('seed', 2);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('sprout', 3);
+            listSortingPage.steps.verifyTargetOptionsTextContentInPreviewTab(['flower', 'plant', 'seed', 'sprout']);
+            listSortingPage.steps.verifyPreviewTabScoreText(0, 20);
+            listSortingPage.steps.checkShowCorrectAnswerCheckbox();
+            listSortingPage.steps.verifyIncorrectOptionsCrossmarkIcon('flower');
+            listSortingPage.steps.verifyIncorrectOptionsCrossmarkIcon('plant');
+            listSortingPage.steps.verifyIncorrectOptionsCrossmarkIcon('sprout');
+            listSortingPage.steps.verifyIncorrectOptionsCrossmarkIcon('seed');
+            listSortingPage.steps.verifyIncorrectAttemptBorder();
+            listSortingPage.steps.verifyCorrectIncorrectAnswerLabel('Incorrect');
+            listSortingPage.steps.verifyCorrectAnswerContainerContents(correctAnswerArray, ['1', '2', '3', '4']);
+
+            listSortingPage.steps.verifyQuestionPreviewStateWhenShowCorrectAnswerIsUnchecked();
+
+            cy.log('When user attempts the question incorrectly and clicks on the \'Check Answer\' button, then red cross-mark icons should be displayed beside all incorrect the options, a label \'Incorrect answer\' and border should be displayed below the question preview and the correct answer container should not be displayed')
+            listSortingPage.steps.checkAnswer();
+            listSortingPage.steps.verifyIncorrectOptionsCrossmarkIcon('flower');
+            listSortingPage.steps.verifyIncorrectOptionsCrossmarkIcon('plant');
+            listSortingPage.steps.verifyIncorrectOptionsCrossmarkIcon('sprout');
+            listSortingPage.steps.verifyIncorrectOptionsCrossmarkIcon('seed');
+            listSortingPage.steps.verifyIncorrectAttemptBorder();
+            listSortingPage.steps.verifyCorrectIncorrectAnswerLabel('Incorrect');
+            listSortingPage.steps.verifyCorrectAnswerContainerDoesNotExist();
+        });
+
+        listSortingPage.tests.verifyCSSAndA11yOfIncorrectAnswerLabel()
+
+        it('When user attempts the question partially correct with some options at the correct position and some at incorrect then on selecting \'Show correct answer\' checkbox, the user should be awarded 0 points, green check-mark icons should be displayed beside the options at the correct position, red cross-mark icons should be displayed beside the options at incorrect position, a label \'Incorrect answer\' and border should be displayed below the question preview and the correct answer container with all correct answers along with numeration should be displayed', () => {
+            listSortingPage.steps.resetQuestionPreview();
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('plant', 0);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('sprout', 1);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('seed', 2);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('flower', 3);
+            listSortingPage.steps.verifyTargetOptionsTextContentInPreviewTab(['plant', 'sprout', 'seed', 'flower']);
+            listSortingPage.steps.checkShowCorrectAnswerCheckbox()
+            listSortingPage.steps.verifyPreviewTabScoreText(0, 20);
+            listSortingPage.steps.verifyIncorrectOptionsCrossmarkIcon('plant');
+            listSortingPage.steps.verifyCorrectOptionsCheckmarkIcon('sprout');
+            listSortingPage.steps.verifyIncorrectOptionsCrossmarkIcon('seed');
+            listSortingPage.steps.verifyCorrectOptionsCheckmarkIcon('flower');
+            listSortingPage.steps.verifyIncorrectAttemptBorder();
+            listSortingPage.steps.verifyCorrectIncorrectAnswerLabel('Incorrect');
+            listSortingPage.steps.verifyCorrectAnswerContainerContents(['seed', 'plant'], ['1', '3']);
+
+            listSortingPage.steps.verifyQuestionPreviewStateWhenShowCorrectAnswerIsUnchecked();
+
+            cy.log('When user attempts the question partially correct and clicks on the \'Check Answer\' button, green check-mark icons should be displayed beside the options at the correct position, red cross-mark icons should be displayed beside the options at incorrect position,, a label \'Incorrect answer\' and border should be displayed below the question preview and the correct answer container should not be displayed')
+            listSortingPage.steps.checkAnswer()
+            listSortingPage.steps.verifyIncorrectOptionsCrossmarkIcon('plant');
+            listSortingPage.steps.verifyCorrectOptionsCheckmarkIcon('sprout');
+            listSortingPage.steps.verifyIncorrectOptionsCrossmarkIcon('seed');
+            listSortingPage.steps.verifyCorrectOptionsCheckmarkIcon('flower');
+            listSortingPage.steps.verifyIncorrectAttemptBorder();
+            listSortingPage.steps.verifyCorrectIncorrectAnswerLabel('Incorrect');
+            listSortingPage.steps.verifyCorrectAnswerContainerDoesNotExist();
+        });
+
+        it('When user attempts the question correctly then on selecting \'Show correct answer\' checkbox, the user should be awarded full points and green check-mark icons should be displayed beside all the options, a label \'Correct answer\' and border should be displayed below the question preview and the correct answer container should not be displayed', () => {
+            listSortingPage.steps.resetQuestionPreview();
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('seed', 0);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('sprout', 1);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('plant', 2);
+            listSortingPage.steps.clickAndDropOptionFromSourceToTargetInPreviewTab('flower', 3);
+            listSortingPage.steps.verifyTargetOptionsTextContentInPreviewTab(correctAnswerArray);
+            listSortingPage.steps.verifyPreviewTabScoreText(20, 20);
+            listSortingPage.steps.checkShowCorrectAnswerCheckbox()
+            listSortingPage.steps.verifyCorrectOptionsCheckmarkIcon('sprout');
+            listSortingPage.steps.verifyCorrectOptionsCheckmarkIcon('seed');
+            listSortingPage.steps.verifyCorrectOptionsCheckmarkIcon('plant');
+            listSortingPage.steps.verifyCorrectOptionsCheckmarkIcon('flower');
+            listSortingPage.steps.verifyCorrectAttemptBorder();
+            listSortingPage.steps.verifyCorrectIncorrectAnswerLabel('Correct');
+            listSortingPage.steps.verifyCorrectAnswerContainerDoesNotExist();
+
+            listSortingPage.steps.verifyQuestionPreviewStateWhenShowCorrectAnswerIsUnchecked();
+
+            cy.log('When user attempts the question correctly and clicks on the \'Check Answer\' button, green check-mark icons should be displayed beside the options at the correct position, a label \'Correct answer\' and border should be displayed below the question preview and the correct answer container should not be displayed')
+            listSortingPage.steps.checkAnswer();
+            listSortingPage.steps.verifyCorrectOptionsCheckmarkIcon('sprout');
+            listSortingPage.steps.verifyCorrectOptionsCheckmarkIcon('seed');
+            listSortingPage.steps.verifyCorrectOptionsCheckmarkIcon('plant');
+            listSortingPage.steps.verifyCorrectOptionsCheckmarkIcon('flower');
+            listSortingPage.steps.verifyCorrectAttemptBorder();
+            listSortingPage.steps.verifyCorrectIncorrectAnswerLabel('Correct');
+            listSortingPage.steps.verifyCorrectAnswerContainerDoesNotExist();
+        });
+
+        listSortingPage.tests.verifyCSSAndA11yOfFullScoreTextAndCorrectAnswerLabel()
+
+        listSortingPage.tests.verifyMinimumScoreAwardedIfAttemptedFunctionalityForIncorrectAnswer('20');
+    }); 
+});