itemengine-cypress-automation 1.0.46 → 1.0.48

package/cypress/e2e/ILC/FillInTheGapsOverImageText/fillInTheGapsOverImageTextPartialEqualWeightsWithAlternateAnswerMatchFromAllResponsesTrue.js

@@ -0,0 +1,168 @@
+import { fillInTheGapsOverImageTextPage } from "../../../pages";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+const correctTabAnswerArray = ['Flower', 'Leaf', 'Stem'];
+const alternateTabAnswerArray = ['Petals', 'Leaves', 'Stem'];
+const incorrectAnswerArray = ['Roots', 'Branch', 'Seed'];
+
+describe('Create item page - Fill in the gaps over image - text: Partial equal weights scoring', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Question preview: Auto scored - Partial equal weights with alternate answer (Match from all responses - true)', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigate to fill in the gaps over image - text question type');
+            fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image - text');
+            cy.barsPreLoaderWait();
+            fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
+            fillInTheGapsOverImageTextPage.steps.clickOnImagePopupOkButton();
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldSetCorrectAnswerSection(0, correctTabAnswerArray[0]);
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldSetCorrectAnswerSection(1, correctTabAnswerArray[1]);
+            fillInTheGapsOverImageTextPage.steps.selectPartialEqualWeightsCheckbox();
+            fillInTheGapsOverImageTextPage.steps.allotPoints(20);
+            fillInTheGapsOverImageTextPage.steps.addAlternateTab(1);
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldSetCorrectAnswerSection(0, alternateTabAnswerArray[0]);
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldSetCorrectAnswerSection(1, alternateTabAnswerArray[1]);
+            fillInTheGapsOverImageTextPage.steps.checkMatchFromAllResponsesCheckbox();
+            fillInTheGapsOverImageTextPage.steps.expandAdditonalSettings();
+            fillInTheGapsOverImageTextPage.steps.checkAllowStudentsToCheckAnswerCheckbox();
+            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
+        });
+
+        it('When the user selects \'Show correct answer\' checkbox without attempting the question, correct answer container should be displayed with the correct responses from the correct tab', () => {
+            fillInTheGapsOverImageTextPage.steps.checkShowCorrectAnswerCheckbox();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectAnswerResponsesInCorrectAnswerContainerAndCount([correctTabAnswerArray[0], correctTabAnswerArray[1]], ['1', '2']);
+            fillInTheGapsOverImageTextPage.steps.uncheckShowCorrectAnswerCheckbox();
+        });
+
+        it('When the user attempts the question with responses from the correct tab, then the user should be awarded with points specified for correct tab and on selecting \'Show correct answer\' checkbox, green check-mark icon should be displayed besides response fields, correct/incorrect answer label and its border should not be displayed below the question preview and correct answer container should not be displayed', () => {
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldPreviewTab(0, correctTabAnswerArray[0]);
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldPreviewTab(1, correctTabAnswerArray[1]);
+            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabScoreText(20, 20);
+            fillInTheGapsOverImageTextPage.steps.checkShowCorrectAnswerCheckbox();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(0);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(1);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectBorderNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectAnswerLabelNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabCorrectAnswerContainerNotExist();
+            fillInTheGapsOverImageTextPage.steps.verifyQuestionPreviewStateWhenShowCorrectAnswerIsUnchecked();
+            cy.log('When the user clicks on \'Check answer\' button, green check-mark icon should be displayed besides response fields correct/incorrect answer label and its border should not be displayed below the question preview and correct answer container should not be displayed')
+            fillInTheGapsOverImageTextPage.steps.checkAnswer();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(0);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(1);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectBorderNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectAnswerLabelNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabCorrectAnswerContainerNotExist();
+        });
+
+        it('When the user attempts the question with responses from the alternate tab, then the user should be awarded with points specified for alternate tab and on selecting \'Show correct answer\' checkbox, green check-mark icon should be displayed besides response fields, correct/incorrect answer label and its border should not be displayed below the question preview and correct answer container should not be displayed', () => {
+            fillInTheGapsOverImageTextPage.steps.resetQuestionPreview();
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldPreviewTab(0, alternateTabAnswerArray[0]);
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldPreviewTab(1, alternateTabAnswerArray[1]);
+            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabScoreText(20, 20);
+            fillInTheGapsOverImageTextPage.steps.checkShowCorrectAnswerCheckbox();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(0);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(1);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectBorderNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectAnswerLabelNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabCorrectAnswerContainerNotExist();
+            fillInTheGapsOverImageTextPage.steps.verifyQuestionPreviewStateWhenShowCorrectAnswerIsUnchecked();
+            cy.log('When the user clicks on \'Check answer\' button, green check-mark icon should be displayed besides response fields, label \'Correct answer\' and correct answer border should be displayed below the question preview and correct answer container should not be displayed')
+            fillInTheGapsOverImageTextPage.steps.checkAnswer();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(0);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(1);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectBorderNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectAnswerLabelNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabCorrectAnswerContainerNotExist();
+        });
+
+        it('When the user attempts the question with partially correct responses exclusively from the correct tab, the user should be awarded points as per the correctly attempted response and on selecting \'Show correct answer\' checkbox, green check-mark icon should be displayed besides correct response field, red cross-mark icon should be displayed besides the incorrect response field, correct/incorrect answer label and its border should not be displayed below the question preview and the correct answer container should be displayed with the correct responses from the correct tab for the responses marked incorrect', () => {
+            fillInTheGapsOverImageTextPage.steps.resetQuestionPreview();
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldPreviewTab(0, correctTabAnswerArray[0]);
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldPreviewTab(1, incorrectAnswerArray[1]);
+            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabScoreText(10, 20);
+            fillInTheGapsOverImageTextPage.steps.checkShowCorrectAnswerCheckbox();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(0);
+            fillInTheGapsOverImageTextPage.steps.verifyIncorrectOptionCrossmarkIcon(1);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectBorderNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectAnswerLabelNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectAnswerResponsesInCorrectAnswerContainerAndCount([correctTabAnswerArray[1]], ['2']);
+            fillInTheGapsOverImageTextPage.steps.verifyQuestionPreviewStateWhenShowCorrectAnswerIsUnchecked();
+            cy.log('When the user clicks on \'Check answer\' button, green check-mark icon should be displayed besides correct response field, red cross-mark icon should be displayed besides the incorrect response field, correct/incorrect answer label and its border should not be displayed below the question preview and the correct answer container should not be displayed')
+            fillInTheGapsOverImageTextPage.steps.checkAnswer();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(0);
+            fillInTheGapsOverImageTextPage.steps.verifyIncorrectOptionCrossmarkIcon(1);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectBorderNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectAnswerLabelNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabCorrectAnswerContainerNotExist();
+        });
+
+        it('When the user attempts the question with partially correct responses exclusively from the alternate tab, the user should be awarded points as per the correctly attempted response, and on selecting \'Show correct answer\' checkbox, green check-mark icon should be displayed besides correct response field, red cross-mark icon should be displayed besides the incorrect response field, correct/incorrect answer label and its border should not be displayed below the question preview and the correct answer container should be displayed with the correct responses from the correct tab for the responses marked incorrect', () => {
+            fillInTheGapsOverImageTextPage.steps.resetQuestionPreview();
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldPreviewTab(0, alternateTabAnswerArray[0]);
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldPreviewTab(1, incorrectAnswerArray[1]);
+            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabScoreText(10, 20);
+            fillInTheGapsOverImageTextPage.steps.checkShowCorrectAnswerCheckbox();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(0);
+            fillInTheGapsOverImageTextPage.steps.verifyIncorrectOptionCrossmarkIcon(1);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectBorderNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectAnswerLabelNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectAnswerResponsesInCorrectAnswerContainerAndCount([alternateTabAnswerArray[1]], ['2']);
+            fillInTheGapsOverImageTextPage.steps.verifyQuestionPreviewStateWhenShowCorrectAnswerIsUnchecked();
+            cy.log('When the user clicks on \'Check answer\' button, green check-mark icon should be displayed besides correct response field, red cross-mark icon should be displayed besides the incorrect response field, correct/incorrect answer label and its border should not be displayed below the question preview and the correct answer container should not be displayed')
+            fillInTheGapsOverImageTextPage.steps.checkAnswer();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(0);
+            fillInTheGapsOverImageTextPage.steps.verifyIncorrectOptionCrossmarkIcon(1);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectBorderNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectAnswerLabelNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabCorrectAnswerContainerNotExist();
+        });
+
+        it('When the user attempts the question with a combination of correct responses from correct tab and alternate tab, then the user should be awarded with full points and on selecting \'Show correct answer\' checkbox, green check-mark icon should be displayed besides response fields, correct/incorrect answer label and its border should not be displayed below the question preview and the correct answer container should not be displayed', () => {
+            fillInTheGapsOverImageTextPage.steps.resetQuestionPreview();
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldPreviewTab(0, correctTabAnswerArray[0]);
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldPreviewTab(1, alternateTabAnswerArray[1]);
+            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabScoreText(20, 20);
+            fillInTheGapsOverImageTextPage.steps.checkShowCorrectAnswerCheckbox();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(0);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(1);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectBorderNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectAnswerLabelNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabCorrectAnswerContainerNotExist();
+            fillInTheGapsOverImageTextPage.steps.verifyQuestionPreviewStateWhenShowCorrectAnswerIsUnchecked();
+            cy.log('When the user clicks on \'Check answer\' button, green check-mark icon should be displayed besides response fields, correct/incorrect answer label and its border should not be displayed below the question preview and the correct answer container should not be displayed')
+            fillInTheGapsOverImageTextPage.steps.checkAnswer();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(0);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectOptionCheckmarkIcon(1);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectBorderNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectAnswerLabelNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabCorrectAnswerContainerNotExist();
+        });
+
+        it('When the user attempts the question incorrectly, then the user should be awarded with 0 points and on selecting \'Show correct answer\' checkbox, red cross-mark icon should be displayed beside response fields, correct/incorrect answer label and its border should not be displayed below the question preview and the correct answer container should be displayed with the correct responses from the correct tab for the responses marked incorrect', () => {
+            fillInTheGapsOverImageTextPage.steps.resetQuestionPreview();
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldPreviewTab(0, correctTabAnswerArray[1]);
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldPreviewTab(1, alternateTabAnswerArray[0]);
+            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabScoreText(0, 20);
+            fillInTheGapsOverImageTextPage.steps.checkShowCorrectAnswerCheckbox();
+            fillInTheGapsOverImageTextPage.steps.verifyIncorrectOptionCrossmarkIcon(0);
+            fillInTheGapsOverImageTextPage.steps.verifyIncorrectOptionCrossmarkIcon(1);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectBorderNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectAnswerLabelNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectAnswerResponsesInCorrectAnswerContainerAndCount([correctTabAnswerArray[0], correctTabAnswerArray[1]], ['1', '2']);
+            fillInTheGapsOverImageTextPage.steps.verifyQuestionPreviewStateWhenShowCorrectAnswerIsUnchecked();
+            cy.log('When the user clicks on \'Check answer\' button, green check-mark icon should be displayed besides response fields, correct/incorrect answer label and its border should not be displayed below the question preview and the correct answer container should not be displayed')
+            fillInTheGapsOverImageTextPage.steps.checkAnswer();
+            fillInTheGapsOverImageTextPage.steps.verifyIncorrectOptionCrossmarkIcon(0);
+            fillInTheGapsOverImageTextPage.steps.verifyIncorrectOptionCrossmarkIcon(1);
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectBorderNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyCorrectIncorrectAnswerLabelNotExists();
+            fillInTheGapsOverImageTextPage.steps.verifyPreviewTabCorrectAnswerContainerNotExist();
+        });
+
+        fillInTheGapsOverImageTextPage.tests.verifyMinimumScoreAwardedIfAttemptedFunctionalityForIncorrectAnswer(1, 20);
+    });
+});

package/cypress/e2e/ILC/FillInTheGapsOverImageText/fillInTheGapsOverImageTextPreviewTab.js

@@ -0,0 +1,66 @@
+import { fillInTheGapsOverImageTextPage } from "../../../pages";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+const css = Cypress.env('css');
+
+const correctTabAnswerArray = ['Flower', 'Leaf', 'Stem'];
+
+describe('Create item page - Fill in the gaps over image - text: Preview contents', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Preview tab contents', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to Fill in the gaps over image - text question type');
+            fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image - text');
+            cy.barsPreLoaderWait();
+            fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
+            fillInTheGapsOverImageTextPage.steps.clickOnImagePopupOkButton();
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldSetCorrectAnswerSection(0, correctTabAnswerArray[0]);
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldSetCorrectAnswerSection(1, correctTabAnswerArray[1]);
+            fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
+        });
+
+        it('When user uploads an image in the \'Image\' section then the uploaded image should be displayed in the preview tab', () => {
+            utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.imagePreviewTab(), 'visible');
+        });
+
+        it('The added response fields should be displayed in the preview tab and they should be empty', () => {
+            utilities.verifyElementCount(fillInTheGapsOverImageTextPage.responseFieldPreviewTab(), 2);
+            fillInTheGapsOverImageTextPage.steps.verifyTextInResponseFieldPreviewTab(0, '');
+            fillInTheGapsOverImageTextPage.steps.verifyTextInResponseFieldPreviewTab(1, '');
+        });
+
+        it('User should be able to enter text in the response field', () => {
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldPreviewTab(0, correctTabAnswerArray[2]);
+            fillInTheGapsOverImageTextPage.steps.verifyTextInResponseFieldPreviewTab(0, correctTabAnswerArray[2]);
+            fillInTheGapsOverImageTextPage.steps.verifyTextInResponseFieldPreviewTab(1, '');
+        });
+
+        it('CSS of preview tab contents', { tags: 'css' }, () => {
+            utilities.verifyCSS(fillInTheGapsOverImageTextPage.responseContainerPointer().find('circle'), {
+                'fill': css.color.responseContainerPointer,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.regular,
+            });
+            fillInTheGapsOverImageTextPage.steps.focusInResponseFieldPreviewTab(0);
+            utilities.verifyCSS(fillInTheGapsOverImageTextPage.responseFieldPreviewTab().parents('.cloze-with-text-response-preview-wrapper').find('fieldset').eq(0), {
+                'border': `1px solid ${css.color.activeButtons}`
+            });
+            utilities.verifyCSS(fillInTheGapsOverImageTextPage.responseFieldPreviewTab().parents('.cloze-with-text-response-preview-wrapper').find('fieldset').eq(1), {
+                'color': css.color.text,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.regular,
+                'border': `1px solid ${css.color.figDefaultComponentBorder}`
+            });
+        });
+
+        it('Accessibility of preview tab', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(fillInTheGapsOverImageTextPage.previewTabQuestionWrapper());
+        });
+    });
+});

package/cypress/e2e/ILC/FillInTheGapsOverImageText/fillInTheGapsOverImageTextSetCorrectAnswerSection.js

@@ -0,0 +1,113 @@
+import { fillInTheGapsOverImageTextPage } from "../../../pages";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+const css = Cypress.env('css');
+
+describe('Create item page - Fill in the gaps over image - text:  Set correct answer section, Alternate answer tab, Correct response conditions section', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Set correct answer section', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigate to fill in the gaps over image - text question type');
+            fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image - text');
+            cy.barsPreLoaderWait();
+            fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
+            fillInTheGapsOverImageTextPage.steps.clickOnImagePopupOkButton();
+        });
+
+        fillInTheGapsOverImageTextPage.tests.verifyAutoScoredSetCorrectAnswerHeaderSectionContents('fill in the gaps over image - text');
+
+        fillInTheGapsOverImageTextPage.tests.verifySetCorrectAnswerSectionDefaultState();
+
+        it('When the user adds a response container over the uploaded image, a response field with label \'Response 1\' should be displayed in the set correct answer section', () => {
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.responseFieldSetCorrectAnswerSection(), 'visible');
+            utilities.verifyElementCount(fillInTheGapsOverImageTextPage.responseFieldSetCorrectAnswerSection(), 1);
+            utilities.verifyInnerText(fillInTheGapsOverImageTextPage.responseFieldLabelSetCorrectAnswerSection(), 'Response 1');
+            utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.responseFieldLabelSetCorrectAnswerSection(), 'visible');
+        });
+    });
+
+    describe('Set correct answer section - Correct tab', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigate to fill in the gaps over image - text question type');
+            fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image - text');
+            cy.barsPreLoaderWait();
+            fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
+            fillInTheGapsOverImageTextPage.steps.clickOnImagePopupOkButton();
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+        });
+
+        fillInTheGapsOverImageTextPage.tests.verifySetCorrectAnswerTabContentsAndFunctionality('Correct tab');
+    });
+
+    describe('Set correct answer section - Alternate tab', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigate to fill in the gaps over image - text question type');
+            fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image - text');
+            cy.barsPreLoaderWait();
+            fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
+            fillInTheGapsOverImageTextPage.steps.clickOnImagePopupOkButton();
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+        });
+
+        fillInTheGapsOverImageTextPage.tests.verifyAutoScoredAlternateAnswer();
+
+        it('When user has added points and filled all the response fields in the \'Correct\' tab, then the user should be able to add alternate answer for the question using \'Add alternate answer\' button and \'Match from all responses\' functionality label and checkbox should get enabled and the checkbox should be in unchecked state', () => {
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldSetCorrectAnswerSection(0, 'Flower');
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldSetCorrectAnswerSection(1, 'Leaf');
+            fillInTheGapsOverImageTextPage.steps.allotPoints(20);
+            fillInTheGapsOverImageTextPage.steps.addAlternateTab(1);
+            fillInTheGapsOverImageTextPage.steps.verifyMatchFromAllResponsesLabelAndCheckboxEnabledState();
+        });
+
+        fillInTheGapsOverImageTextPage.tests.verifyA11yOfAlternateAnswerTab();
+
+        fillInTheGapsOverImageTextPage.tests.verifySetCorrectAnswerTabContentsAndFunctionality('Alternate tab');
+
+        it('User should be able to add another alternate answer for the question using \'Add alternate answer\' button and the name for this new tab should be \'Alternate 2\'', () => {
+            fillInTheGapsOverImageTextPage.steps.addAlternateTab(2);
+        });
+
+        fillInTheGapsOverImageTextPage.tests.verifyWarningPopupAndTabNavigationWhenNoPointsAddedInAlternateTab();
+
+        it('User should be able to remove alternate correct answer by clicking on the \'Close\' icon button alongside alternate answer tab and the name of the alternate answer tabs should get updated accordingly', () => {
+            cy.log('Set correct answer and points in alternate 2 tab, then switch to Alternate 1 tab and click delete icon button');
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldSetCorrectAnswerSection(0, 'Petals');
+            fillInTheGapsOverImageTextPage.steps.enterTextInResponseFieldSetCorrectAnswerSection(1, 'Leaves');
+            fillInTheGapsOverImageTextPage.steps.allotPoints(5);
+            fillInTheGapsOverImageTextPage.steps.navigateToAlternateTab(1);
+            fillInTheGapsOverImageTextPage.steps.deleteAlternateTab();
+            utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.alternateAnswerTab(2), 'notExist');
+            utilities.verifyInnerText(fillInTheGapsOverImageTextPage.alternateAnswerTab(1), 'Alternate 1');
+        });
+
+        it('When the user removes all the \'Alternate\' tabs, \'Match from all responses\' functionality should get disabled', () => {
+            fillInTheGapsOverImageTextPage.steps.deleteAlternateTab();
+            utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.alternateAnswerTab(1), 'notExist');
+            utilities.verifyInnerText(fillInTheGapsOverImageTextPage.matchFromAllResponsesLabel(), 'Match from all responses');
+            fillInTheGapsOverImageTextPage.steps.verifyMatchFromAllResponsesLabelAndCheckboxDisabledState();
+        });
+    });
+
+    describe('Correct response conditions section', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigate to fill in the gaps over image - text question type');
+            fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image - text');
+            cy.barsPreLoaderWait();
+            fillInTheGapsOverImageTextPage.steps.uploadFile('highlightImage.jpg');
+            fillInTheGapsOverImageTextPage.steps.clickOnImagePopupOkButton();
+            fillInTheGapsOverImageTextPage.steps.addResponseContainer();
+        });
+
+        fillInTheGapsOverImageTextPage.tests.verifyCorrectResponseConditionSectionDefaultState();
+    });
+});

package/cypress/e2e/ILC/FillInTheGapsOverImageText/fillInTheGapsOverImageTextSupportedFileTypes.js

@@ -0,0 +1,86 @@
+import { fillInTheGapsOverImageTextPage } from "../../../pages";
+import { uploadImageSectionComponent } from "../../../pages/components";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+import constants from "../../../fixtures/constants";
+
+describe('Create Item page - Fill in the gaps over image - text: Supported file types', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Supported file types functionality: device popup', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to fill in the gaps over image - text question type');
+            fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image - text');
+            cy.barsPreLoaderWait();
+        });
+
+        const supportedFormatFiles = {
+            jpg: 'highlightImage.jpg',
+            jpeg: 'sample.jpeg',
+            png: 'image.png',
+            gif: 'sample.gif',
+            heic: 'sample.heic',
+            heif: 'sample.heif',
+            svg: 'sample.svg'
+        };
+
+        Object.keys(supportedFormatFiles).forEach((fileType) => {
+            it(`User should be able to upload ${fileType} file in the image section using link text \'device\' and it should be displayed in the \'Image\' section and \'Preview tab\'`, () => {
+                uploadImageSectionComponent.steps.uploadFile(supportedFormatFiles[fileType]);
+                uploadImageSectionComponent.steps.verifyUploadedImageInImagePopup();
+                uploadImageSectionComponent.steps.clickOnImagePopupOkButton();
+                utilities.verifyElementVisibilityState(uploadImageSectionComponent.uploadImagePopup(), 'notExist');
+                utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.imageSectionImage(), 'visible');
+                fillInTheGapsOverImageTextPage.steps.verifyUploadedImageFormatInImageSection(fileType);
+                cy.log('Checking in preview tab')
+                fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
+                utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.imagePreviewTab(), 'visible');
+                fillInTheGapsOverImageTextPage.steps.verifyUploadedImageFormatInPreviewTab(fileType);
+                fillInTheGapsOverImageTextPage.steps.switchToEditTab();
+                cy.log('Post step: Delete the image')
+                uploadImageSectionComponent.steps.clickOnDeleteImageButton();
+                uploadImageSectionComponent.steps.clickOnDeleteButtonInDeleteImagePopup();
+            });
+        });
+    });
+
+    describe('Supported file types functionality: Source URL popup', () => {
+        abortEarlySetup();
+        before(() => {
+            cy.log('Navigating to fill in the gaps over image - text question type');
+            fillInTheGapsOverImageTextPage.steps.navigateToCreateQuestion('fill in the gaps over image - text');
+            cy.barsPreLoaderWait();
+        });
+
+        const supportedFormatFiles = {
+            jpg: constants.foxImageLink,
+            jpeg: constants.sampleJPEGLink,
+            png: constants.samplePNGLink,
+            gif: constants.sampleGIFLink,
+            svg: constants.sampleSVGLink
+        };
+
+        Object.keys(supportedFormatFiles).forEach((fileType) => {
+            it(`User should be able to upload ${fileType} file in the upload section using link text \'source URL\' and it should be displayed in the \'Image\' section and \'Preview tab\'`, () => {
+                uploadImageSectionComponent.steps.clickOnSourceURL();
+                uploadImageSectionComponent.steps.uploadImageUsingSourceURL(supportedFormatFiles[fileType]);
+                uploadImageSectionComponent.steps.verifyUploadedImageInImagePopup();
+                uploadImageSectionComponent.steps.clickOnImagePopupOkButton();
+                utilities.verifyElementVisibilityState(uploadImageSectionComponent.uploadImagePopup(), 'notExist');
+                utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.imageSectionImage(), 'visible');
+                fillInTheGapsOverImageTextPage.steps.verifyUploadedImageFormatInImageSection(fileType);
+                cy.log('Checking in preview tab')
+                fillInTheGapsOverImageTextPage.steps.switchToPreviewTab();
+                utilities.verifyElementVisibilityState(fillInTheGapsOverImageTextPage.imagePreviewTab(), 'visible');
+                fillInTheGapsOverImageTextPage.steps.verifyUploadedImageFormatInPreviewTab(fileType);
+                fillInTheGapsOverImageTextPage.steps.switchToEditTab();
+                cy.log('Post step: Delete the image')
+                uploadImageSectionComponent.steps.clickOnDeleteImageButton();
+                uploadImageSectionComponent.steps.clickOnDeleteButtonInDeleteImagePopup();
+            });
+        });
+    });
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "itemengine-cypress-automation",
-  "version": "1.0.46",
+  "version": "1.0.48",
   "description": "",
   "main": "index.js",
   "scripts": {