itemengine-cypress-automation 1.0.387-IEI-6161-IEI-6162-manualAndNonScoredScript-481a8a8.0 → 1.0.387-IEI-6274-d9be2a2.0

package/cypress/e2e/ILC/ThinkSphere/gradingViewPlanTabSection.js

@@ -0,0 +1,334 @@
+import uuid from 'react-uuid';
+import { thinkSpherePage } from "../../../pages";
+import { browseItemsPage } from "../../../pages/components/browseItemsPage";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+const css = Cypress.env('css');
+
+describe('Grading view : ThinkSphere Question - Plan Section', () => {
+    const uuidString = uuid();
+
+    before(() => {
+        cy.loginAs('admin');
+        cy.createThinkSphereItem(uuidString, true);
+        cy.visit('/item-engine/thinksphere/browse-items');
+        browseItemsPage.steps.clickOnActionButton();
+        browseItemsPage.steps.clickOnActionMenuItem(0);
+        thinkSpherePage.steps.clickOnStrategiesPreviewListLI();
+        thinkSpherePage.steps.stepsBeforeGradingView();
+    });
+
+    describe('\'Question instruction\' section', () => {
+        abortEarlySetup();
+        it('\'Question instruction\' section should be present', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.questionInstructionPreviewTexWrapper(), 'visible');
+            utilities.verifyInnerText(thinkSpherePage.questionInstructionPreviewTexWrapper(), 'question instruction text');
+        });
+
+        it('CSS of \'Question instruction\' section', { tags: 'css' }, () => {
+            utilities.verifyCSS(thinkSpherePage.questionInstructionPreviewTexWrapper(), {
+                'border-radius': '12px',
+                'background-color': css.color.questionInstructionBG,
+                'padding': '10px 170px 10px 27px',
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.regular,
+            });
+        });
+
+        it('Question instruction image should visible in the preview', () => {
+            thinkSpherePage.steps.verifyQuestionInstructionPreviewImageWrapperVisibility();
+        });
+
+        it('CSS of question instruction image section', { tags: 'css' }, () => {
+            utilities.verifyCSS(thinkSpherePage.questionInstructionPreviewImageWrapper(), {
+                'width': '143px',
+                'height': '110px',
+                'border': `1px solid ${css.color.secondaryBtnBorder}`,
+                'background-color': css.color.primaryBtn,
+            });
+            utilities.verifyCSS(thinkSpherePage.questionInstructionPreviewImageExpandButton(), {
+                'width': '24px',
+                'height': '24px',
+                'box-shadow': `${css.color.boxShadow} 0px 2px 8px 0px`,
+                'border': `1px solid ${css.color.figDefaultComponentBorder}`,
+                'border-radius': '4px',
+                'background-color': css.color.primaryBtn,
+            });
+        });
+
+        it('When user clicks on expand question instruction image then it should open in the popup', () => {
+            thinkSpherePage.steps.clickOnQuestionInstructionExpandImageButton();
+            utilities.verifyElementVisibilityState(thinkSpherePage.dialogBoxRoot(), 'visible');
+            thinkSpherePage.steps.verifyQuestionImagePopup();
+        });
+
+        it('CSS of question instruction image popup', { tags: 'css' }, () => {
+            utilities.verifyCSS(thinkSpherePage.dialogBoxRoot(), {
+                'border-radius': '8px',
+                'border': `1px solid ${css.color.secondaryBtnBorder}`,
+                'box-shadow': `${css.color.dialogBoxBoxShadow} 0px 0px 10px 0px`,
+            });
+            utilities.verifyCSS(thinkSpherePage.closeExpandImagePopupButton(), {
+                'background-color': css.color.primaryBtn,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.semibold,
+                'border': `1px solid ${css.color.secondaryBtnBorder}`,
+                'color': css.color.primaryBtnBorder,            
+            });
+        });
+
+        it('Accessibility of question instruction image popup', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(thinkSpherePage.dialogBoxRoot());
+            cy.checkAccessibility(thinkSpherePage.closeExpandImagePopupButton());
+        });
+
+        it('When user clicks on close expand image popup button then it should remove the popup', () => {
+            thinkSpherePage.steps.clickOnCloseExpandImagePopupButton();
+            utilities.verifyElementVisibilityState(thinkSpherePage.dialogBoxRoot(), 'notExist');
+        });
+    });
+
+    describe('\'Choose your strategies\' section', () => {
+        abortEarlySetup();
+        it('\'Choose your strategies\' section and title should be present', () => {
+            utilities.verifyInnerText(thinkSpherePage.strategiesPreviewHeader(), 'Choose your strategies');
+            utilities.verifyElementVisibilityState(thinkSpherePage.strategiesPreviewHeader(), 'visible');
+        });
+
+        it('\'Add new strategy\' button should be present', () => {
+            utilities.verifyInnerText(thinkSpherePage.addNewStrategyButton(), 'Add new strategy');
+            utilities.verifyElementVisibilityState(thinkSpherePage.addNewStrategyButton(), 'visible');
+        });
+
+        it('CSS of strategies header and add new strategy button', { tags: 'css' }, () => {
+            utilities.verifyCSS(thinkSpherePage.strategiesPreviewHeader(), {
+                'font-size': css.fontSize.heading,
+                'font-weight': css.fontWeight.semibold,
+                'color': css.color.primaryBtnBorder,
+            });
+            utilities.verifyCSS(thinkSpherePage.addNewStrategyButton(), {
+                'border': `1px solid ${css.color.figDefaultComponentBorder}`,
+                'padding': '12px 16px',
+                'border-radius': '8px',
+                'box-shadow': `${css.color.boxShadow} 0px 2px 8px 0px`,
+            });
+            utilities.verifyCSS(thinkSpherePage.addNewStrategyTextWrapper(), {
+                'color': css.color.primaryBtnBorder,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.regular,
+            });
+        });
+        
+        it('CSS of strategies list', { tags: 'css' }, () => {
+            utilities.verifyCSS(utilities.getNthElement(thinkSpherePage.strategiesPreviewListLI(), 0), {
+                'padding': '8px 16px 8px 24px',
+                'border': `2px solid ${css.color.transparent}`,
+                'background-color': css.color.progressBarRemainingFill,
+                'border-radius': '12px',
+            });
+            utilities.verifyCSS(utilities.getNthElement(thinkSpherePage.strategyTextWrapper(), 0), {
+                'color': css.color.strategyTextDisabled,
+                'margin-right': '40px',
+                'font-size': '18px',
+                'font-weight': '600',
+            });
+            utilities.verifyCSS(utilities.getNthElement(thinkSpherePage.strategyTextWrapper(), 1), {
+                'color': css.color.primaryBtnBg,
+                'font-size': '18px',
+                'font-weight': '600',
+            });
+        });
+
+        it('When the user clicks on add new strategy button in grading view, no popup should be displayed and the button should not be accessible with keyboard', () => {
+            thinkSpherePage.steps.verifyAddStrategiesButtonDisabled()
+        });
+
+        it('Strategies list buttons should be in disabled state', () => {
+            thinkSpherePage.steps.verifyStrategiesListButtonDisabled()
+        });
+        
+        it('CSS of strategies list in selected state', { tags: 'css' }, () => {
+            utilities.verifyCSS(utilities.getNthElement(thinkSpherePage.strategiesPreviewListLI(), 1), {
+                'border': `2px solid ${css.color.toggleButtonSelectedBg}`,
+                'background-color': css.color.transparent,
+            });
+            utilities.verifyCSS(utilities.getNthElement(thinkSpherePage.strategyTextWrapper(), 1), {
+                'color': css.color.primaryBtnBg,
+            });
+        });
+
+        it('Video icon for should present by default besides the strategy name', () => {
+            utilities.verifyElementVisibilityState(utilities.getNthElement(thinkSpherePage.videoIconWrapper(), 0), 'visible');
+        });
+
+        it('When user clicks on video icon then video should be played in the popup', () => {
+            thinkSpherePage.steps.clickOnVideoIcon();
+            utilities.verifyElementVisibilityState(thinkSpherePage.dialogBoxRoot(), 'visible');
+            thinkSpherePage.steps.verifyVideoPopupDialogBox();
+            thinkSpherePage.steps.closeVideoPopup();
+        });
+    });
+
+    describe('\'Planning journal\' Section', () => {
+        abortEarlySetup();
+        it('\'Planning journal\' section should be present', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.PlanningPreviewWrapper(), 'visible');
+        });
+
+        it('\'Planning journal\' section heading should be present', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.planningPreviewHeading(), 'visible');
+            utilities.verifyInnerText(thinkSpherePage.planningPreviewHeading(), 'Planning journal');
+        });
+
+        it('\'Sentence starters\' label and dropdown should be displayed and the dropdown should be disabled', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.chooseStarterLabel(), 'visible');
+            utilities.verifyElementVisibilityState(thinkSpherePage.chooseStarterDropdown(), 'visible');
+            utilities.verifyInnerText(thinkSpherePage.chooseStarterLabel(), 'Sentence starter');
+        });
+
+        it('CSS of \'Sentence starter\' dropdown - default state', { tags: 'css' }, () => {
+            utilities.verifyCSS(thinkSpherePage.chooseStarterLabel(), {
+                'color': css.color.sectionHeading,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.semibold,
+            });
+            utilities.verifyCSS(thinkSpherePage.chooseStarterDropdown(), {
+                'color': css.color.liText,
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.regular
+            });
+        });
+
+        it('\'Planning journal\' write wrapper should be present', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.planningWriteWrapper(), 'visible');
+        });
+
+        it('\'The problem is asking me to\' section should be present', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.problemAskingWrapper(), 'visible');
+        });
+
+        it('\'The problem is asking me to\' subheading should be present', () => {
+            thinkSpherePage.steps.verifyProblemAskingHeading();
+        });
+
+        it('Text area with placeholder \'Enter your text here\' should be present under \'The problem is asking me to\' section', () => {
+            thinkSpherePage.steps.verifyProblemAskingTextArea();
+        });
+
+        it('Mic button should be present under \'The problem is asking me to\' section and it should be disabled', () => {
+            thinkSpherePage.steps.verifyProblemAskingMicSection(true);
+        });
+
+        it('User should not be able to write in the \'Enter your text here\' textarea under \'The problem is asking me to\' section', () => {
+            thinkSpherePage.steps.verifyDisabledProblemTextContainer('This is a test text for the problem.');
+        });
+
+        it('\'Add strategies to plan\' section should be present', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.strategiesToPlanWrapper(), 'visible');
+        });
+
+        it('\'Add strategies to plan\' subheading should be present', () => {
+            thinkSpherePage.steps.verifyStrategiesToPlanHeading();
+        });
+
+        it('\'Write your plan\' section should be present', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.writePlanWrapper(), 'visible');
+        });
+
+        it('\'Write your plan\' subheading should be present', () => {
+            thinkSpherePage.steps.verifyWritePlanHeading();
+        });
+
+        it('Text area with placeholder \'Enter your plan here\' should be present under \'Write your plan\' section', () => {
+            thinkSpherePage.steps.verifyWritePlanTextArea();
+        });
+
+        it('Mic button should be present under \'Write your plan\' section', () => {
+            thinkSpherePage.steps.verifyWritePlanMicSection(true);
+        });
+
+        it('User should not be able to write in the \'Enter your plan here\' textarea under \'Write your plan\' section', () => {
+            thinkSpherePage.steps.verifyDisabledWriteYourPlanTextContainer('First, I will look for a pattern ');
+        });
+
+        it('The strategy chip selected by the student should display inside \'Add strategies to plan\' wrapper in the form of chip', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.strategyChipWrapper(), 'visible');
+            utilities.verifyElementVisibilityState(thinkSpherePage.strategyChip(), 'visible');
+            utilities.verifyInnerText(thinkSpherePage.strategyChip(), 'Look for a pattern');
+        });
+        
+        it('CSS of strategy chip when it is not selected', { tags: 'css' }, () => {
+            utilities.verifyCSS(thinkSpherePage.strategyChip(), {
+                'border': `1px solid ${css.color.primaryBtnBg}`,
+                'color': css.color.sectionHeading,
+                'border-radius': '20px',
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.regular,
+                'background-color': css.color.secondaryBtnBorder,
+            });
+        });
+
+        it('The user should not be able to click on strategy chip', () => {
+            thinkSpherePage.steps.verifyDisabledStrategyChip();
+        });
+
+        it('CSS of planning journal section', { tags: 'css' }, () => {
+            utilities.verifyCSS(thinkSpherePage.planningPreviewHeading(), {
+                'color': css.color.primaryBtnBorder,
+                'font-size': css.fontSize.heading,
+                'font-weight': css.fontWeight.semibold,
+            });
+            
+            utilities.verifyCSS(thinkSpherePage.planningWriteWrapper(), {
+                'border': `1px solid ${css.color.secondaryBtnBorderDisabled}`,
+                'border-radius': '12px'
+            });
+
+            utilities.verifyCSS(thinkSpherePage.problemAskingWrapper(), {
+                'padding': '16px 16px 14px',
+                'border-bottom': `1px solid ${css.color.secondaryBtnBorderDisabled}`
+            });
+
+            utilities.verifyCSS(thinkSpherePage.strategiesToPlanWrapper(), {
+                'padding': '16px',
+                'border-bottom': `1px solid ${css.color.secondaryBtnBorderDisabled}`
+            });
+
+            utilities.verifyCSS(thinkSpherePage.writePlanWrapper(), {
+                'padding': '16px'
+            });
+
+            thinkSpherePage.problemAskingWrapper()
+                .within(() => {
+                    utilities.verifyCSS(thinkSpherePage.subheadingWrapper(), {
+                        'color': css.color.primaryBtnBorder,
+                        'font-size': css.fontSize.normal,
+                        'font-weight': css.fontWeight.bold,
+                    });
+                });
+
+            thinkSpherePage.strategiesToPlanWrapper()
+                .within(() => {
+                    utilities.verifyCSS(thinkSpherePage.subheadingWrapper(), {
+                        'color': css.color.primaryBtnBorder,
+                        'font-size': css.fontSize.normal,
+                        'font-weight': css.fontWeight.bold,
+                    });
+                });
+
+            thinkSpherePage.writePlanWrapper()
+                .within(() => {
+                    utilities.verifyCSS(thinkSpherePage.subheadingWrapper(), {
+                        'color': css.color.primaryBtnBorder,
+                        'font-size': css.fontSize.normal,
+                        'font-weight': css.fontWeight.bold,
+                    });
+                });
+        });
+
+        it('Accessibility of planning journal', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(thinkSpherePage.PlanningPreviewWrapper());
+        });
+    });
+
+});

package/cypress/e2e/ILC/ThinkSphere/gradingViewReviewTabSection.js

@@ -0,0 +1,140 @@
+import uuid from 'react-uuid';
+import { thinkSpherePage } from "../../../pages";
+import { browseItemsPage } from "../../../pages/components/browseItemsPage";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+const css = Cypress.env('css');
+
+describe('Grading view : ThinkSphere Question - Review Section', () => {
+    const uuidString = uuid();
+    before(() => {
+        cy.loginAs('admin');
+        cy.createThinkSphereItem(uuidString, true);
+        thinkSpherePage.steps.visitThinksphereBrowseItemsPage();
+        browseItemsPage.steps.clickOnItemReferenceId(uuidString);
+        browseItemsPage.steps.clickOnAddReviewItem();
+        thinkSpherePage.steps.createReviewQuestion();
+        thinkSpherePage.steps.visitThinksphereBrowseItemsPage();
+        browseItemsPage.steps.clickOnActionButton();
+        browseItemsPage.steps.clickOnActionMenuItem(0);
+        thinkSpherePage.steps.submitResponseAndGotoGradingView();
+        thinkSpherePage.steps.clickOnReviewTab();
+
+    });
+
+    describe('\'Question instruction\' section', () => {
+        abortEarlySetup();
+        it('\'Question instruction\' section should be present', () => {
+            thinkSpherePage.steps.verifyQuestionInstructionPreviewTexWrapperVisibility('question instruction text');
+        });
+
+        it('CSS of \'Question instruction\' section', { tags: 'css' }, () => {
+            utilities.verifyCSS(thinkSpherePage.questionInstructionPreviewTexWrapper(), {
+                'border-radius': '12px',
+                'background-color': css.color.questionInstructionBG,
+                'padding': '10px 170px 10px 27px',
+                'font-size': css.fontSize.default,
+                'font-weight': css.fontWeight.regular,
+            });
+        });
+
+        it('Question instruction image should visibile in the preview', () => {
+            thinkSpherePage.steps.verifyQuestionInstructionPreviewImageWrapperVisibility();
+        });
+
+        it('CSS of question instruction image section', { tags: 'css' }, () => {
+            utilities.verifyCSS(thinkSpherePage.questionInstructionPreviewImageWrapper(), {
+                'width': '143px',
+                'height': '110px',
+                'border': `1px solid ${css.color.secondaryBtnBorder}`,
+                'background-color': css.color.primaryBtn,
+            });
+            utilities.verifyCSS(thinkSpherePage.questionInstructionPreviewImageExpandButton(), {
+                'width': '24px',
+                'height': '24px',
+                'box-shadow': `${css.color.boxShadow} 0px 2px 8px 0px`,
+                'border': `1px solid ${css.color.figDefaultComponentBorder}`,
+                'border-radius': '4px',
+                'background-color': css.color.primaryBtn,
+            });
+        });
+
+        it('When user clicks on expand question instruction image then it should open in the popup', () => {
+            thinkSpherePage.steps.clickOnQuestionInstructionExpandImageButton();
+            utilities.verifyElementVisibilityState(thinkSpherePage.dialogBoxRoot(), 'visible');
+            thinkSpherePage.steps.verifyQuestionImagePopup();
+        });
+
+        it('CSS of question instruction image popup', { tags: 'css' }, () => {
+            utilities.verifyCSS(thinkSpherePage.dialogBoxRoot(), {
+                'border-radius': '8px',
+                'border': `1px solid ${css.color.secondaryBtnBorder}`,
+                'box-shadow': `${css.color.dialogBoxBoxShadow} 0px 0px 10px 0px`,
+            });
+            utilities.verifyCSS(thinkSpherePage.closeExpandImagePopupButton(), {
+                'background-color': css.color.primaryBtn,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.semibold,
+                'border': `1px solid ${css.color.secondaryBtnBorder}`,
+                'color': css.color.primaryBtnBorder,            
+            });
+        });
+
+        it('When user clicks on close expand image popup button then it should remove the popup', () => {
+            thinkSpherePage.steps.clickOnCloseExpandImagePopupButton();
+            utilities.verifyElementVisibilityState(thinkSpherePage.dialogBoxRoot(), 'notExist');
+        });
+    });
+
+    describe('Verify the Your plan Button', () => {
+        abortEarlySetup();
+        it('Your Plan button should be visible and display the correct disabled styles', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.yourPlanButton(), 'visible');
+            utilities.verifyCSS(thinkSpherePage.yourPlanButton(), {
+                'background-color' : css.color.boxShadow,
+                'color': css.color.primaryBtnDisabled,
+            });
+        });
+
+        it('Your Plan button should have disabled attribute', () => {
+            thinkSpherePage.steps.verifyYourPlanButtonInDisableState();
+        });
+    });
+
+    describe('\'Check your math\' section', () => {
+        abortEarlySetup();
+        it('\'Check your math\' section header should be present', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.checkYourMathHeading(), 'visible');
+            utilities.verifyInnerText(thinkSpherePage.checkYourMathHeading(), 'Check your math');
+        });
+
+        it('CSS of \'Check your math\' section header', { tags: 'css' }, () => {
+            utilities.verifyCSS(thinkSpherePage.checkYourMathHeading(), {
+                'color': css.color.primaryBtnBorder,
+                'font-size': css.fontSize.heading,
+                'font-weight': css.fontWeight.semibold,
+            });
+        });
+        
+        it('\'The problem is asking me to\' section should be present', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.problemAskingToMeTextWrapper(), 'visible');
+            utilities.verifyInnerText(thinkSpherePage.problemAskingToMeTextWrapper(), 'The problem is asking me to...');
+        });
+
+        it('Review question should be present', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.reviewQuestionWrapper(), 'visible');
+        });
+
+        it('CSS of \'The problem is asking me to\' section', { tags: 'css' }, () => {
+            utilities.verifyCSS(thinkSpherePage.problemAskingToMeTextWrapper(), {
+                'color': css.color.primaryBtnBorder,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.bold,
+            });
+            utilities.verifyCSS(thinkSpherePage.reviewComponentWrapper(), {
+                'border': `1px solid ${css.color.secondaryBtnBorder}`,
+                'border-radius': '12px'
+            });
+        });
+    });
+});

package/cypress/e2e/ILC/ThinkSphere/gradingViewSolveTabSection.js

@@ -0,0 +1,65 @@
+import uuid from 'react-uuid';
+import { thinkSpherePage } from "../../../pages";
+import { browseItemsPage } from "../../../pages/components/browseItemsPage";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+import { editSectionWhiteBoardToolButtons, whiteBoardTools } from '../../../fixtures/thinkSphereWhiteboardTools';
+const css = Cypress.env('css');
+
+describe('Grading view : ThinkSphere Question - Solve Section', () => {
+    before(() => {
+        cy.loginAs('admin');
+        thinkSpherePage.steps.navigateToThinkSphereCreateQuestion();
+        cy.barsPreLoaderWait();
+        thinkSpherePage.steps.switchToEditTab();
+        thinkSpherePage.steps.addTextInQuestionInstructionsInputField('question instruction text');
+        thinkSpherePage.steps.clickOnSolvePhaseAccordionIcon();
+        thinkSpherePage.steps.expandCustomizeToolsAndControls();
+        editSectionWhiteBoardToolButtons.forEach((toolName) => {
+            thinkSpherePage.steps.selectOptionFromToolsAndControls(toolName);
+        })
+        thinkSpherePage.steps.clickOnSaveButton();
+        cy.visit('/item-engine/thinksphere/browse-items');
+        browseItemsPage.steps.clickOnActionButton();
+        browseItemsPage.steps.clickOnActionMenuItem(0);
+        thinkSpherePage.steps.clickOnSolveTab();
+        thinkSpherePage.steps.submitResponseAndGotoGradingView();
+        thinkSpherePage.steps.clickOnSolveTab();
+    });
+
+    describe('\'Question instruction\' section', () => {
+        abortEarlySetup();
+        it('\'Question instruction\' section should be present', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.questionInstructionPreviewTexWrapper(), 'visible');
+            utilities.verifyInnerText(thinkSpherePage.questionInstructionPreviewTexWrapper(), 'question instruction text');
+        });
+
+    });
+
+    describe('Whiteboard and its sections should be present', () => {
+        abortEarlySetup();
+        thinkSpherePage.tests.verifyWhiteBoardAndSections();
+    });
+
+    describe('Whiteboard tools and sub tools should be present', () => {
+        abortEarlySetup();
+        const allToolIds = whiteBoardTools.map(tool => tool.dataTestId);
+        const defaultToolIds = whiteBoardTools.filter(tool => tool.isDefault).map(tool => tool.dataTestId);
+        thinkSpherePage.tests.verifyDisabledWhiteboardTools(defaultToolIds, allToolIds);
+    });
+
+    describe('Verify the Your plan Button', () => {
+        abortEarlySetup();
+        it('Your Plan button should be visible and display the correct disabled styles', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.yourPlanButton(), 'visible');
+            utilities.verifyCSS(thinkSpherePage.yourPlanButton(), {
+                'background-color' : css.color.boxShadow,
+                'color': css.color.primaryBtnDisabled,
+            });
+        });
+
+        it('Your Plan button should have disabled attribute', () => {
+            thinkSpherePage.steps.verifyYourPlanButtonInDisableState();
+        });
+    });
+});

package/cypress/e2e/ILC/ThinkSphere/previewTabReviewSection.js

@@ -94,4 +94,9 @@ describe('Preview question : ThinkSphere Question - Plan Section - preview tab',
             utilities.verifyElementVisibilityState(thinkSpherePage.dialogBoxRoot(), 'notExist');
         });
     });
+
+    describe('Verify the Your plan Section', () => {
+        abortEarlySetup();
+        thinkSpherePage.tests.verifyYourPlanSection();
+    });
 });

package/cypress/e2e/ILC/ThinkSphere/previewTabSolveSection.js

@@ -24,6 +24,11 @@ describe('Preview question : ThinkSphere Question - Solve Section - preview tab'
         thinkSpherePage.tests.verifyWhiteboardToolsAndSubTools(whiteBoardTools, editSectionWhiteBoardToolButtons);
     });
 
+    describe('Verify the Your plan Section', () => {
+        abortEarlySetup();
+        thinkSpherePage.tests.verifyYourPlanSection();
+    });
+
     describe('Whiteboard page navigation', () => {
         abortEarlySetup();
         thinkSpherePage.tests.verifyWhiteboardPageNavigation();

package/cypress/e2e/ILC/ThinkSphere/studentViewReviewTabSection.js

@@ -86,6 +86,11 @@ describe('Student view : ThinkSphere Question - Review Section', () => {
         });
     });
 
+    describe('Verify the Your plan Section', () => {
+        abortEarlySetup();
+        thinkSpherePage.tests.verifyYourPlanSection();
+    });
+
     describe('\'Check your math\' section', () => {
         abortEarlySetup();
         it('\'Check your math\' section header should be present', () => {

package/cypress/e2e/ILC/ThinkSphere/studentViewSolveSection.js

@@ -0,0 +1,53 @@
+import uuid from 'react-uuid';
+import { thinkSpherePage } from "../../../pages";
+import { browseItemsPage } from "../../../pages/components/browseItemsPage";
+import { commonComponents } from "../../../pages/components/commonComponents";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+import { whiteBoardTools, editSectionWhiteBoardToolButtons } from "../../../fixtures/thinkSphereWhiteboardTools";
+const css = Cypress.env('css');
+
+describe('Student view : ThinkSphere Question - Solve Section', () => {
+    before(() => {
+        cy.loginAs('admin');
+        thinkSpherePage.steps.navigateToThinkSphereCreateQuestion();
+        cy.barsPreLoaderWait();
+        thinkSpherePage.steps.switchToEditTab();
+        thinkSpherePage.steps.clickOnSolvePhaseAccordionIcon();
+        thinkSpherePage.steps.expandCustomizeToolsAndControls();
+        editSectionWhiteBoardToolButtons.forEach((toolName) => {
+            thinkSpherePage.steps.selectOptionFromToolsAndControls(toolName);
+        })
+        thinkSpherePage.steps.clickOnSaveButton();
+        cy.visit('/item-engine/thinksphere/browse-items');
+        browseItemsPage.steps.clickOnActionButton();
+        browseItemsPage.steps.clickOnActionMenuItem(0);
+        thinkSpherePage.steps.clickOnSolveTab();
+    });
+
+    describe('Whiteboard and its sections should be present', () => {
+        abortEarlySetup();
+        thinkSpherePage.tests.verifyWhiteBoardAndSections();
+    });
+
+    describe('Whiteboard tools and sub tools should be present', () => {
+        abortEarlySetup();
+        thinkSpherePage.tests.verifyAllDefaultToolIds(whiteBoardTools, editSectionWhiteBoardToolButtons);
+        thinkSpherePage.tests.verifyWhiteBoardSubTools(whiteBoardTools);
+    });
+
+    describe('Verify the Your plan Section', () => {
+        abortEarlySetup();
+        thinkSpherePage.tests.verifyYourPlanSection();
+    });
+
+    describe('Whiteboard page navigation', () => {
+        abortEarlySetup();
+        thinkSpherePage.tests.verifyWhiteboardPageNavigation();
+    });
+
+    describe('Verify Whiteboard recording', () => {
+        abortEarlySetup();
+        thinkSpherePage.tests.verifyWhiteboardRecordingAndPlayback(whiteBoardTools);
+    });
+});

package/cypress/pages/thinkSpherePage.js

@@ -251,6 +251,14 @@ const selectors = {
     whiteboardVolumeSlider: () => cy.get('[class*=slider-container]'),
     submitButton: () => cy.get('button[aria-label="Submit"]'),
     goToGradingViewButton: () => cy.contains('button', 'GO TO GRADING VIEW'),
+    yourPlanButton: () => cy.get('button[class*="YourPlanButton"]'),
+    yourPlanContainer: () => cy.get('[class*="YourPlanContainer"]'),
+    yourPlanHeaderContainer: () => cy.get('[class*="ThinkSpherePreviewstyles__YourPlanHeaderContainer"]'),
+    yourPlanHeadingLabel: () => cy.get('[class*="ThinkSpherePreviewstyles__HeadingLabel"]'),
+    yourPlanCloseButton: () => cy.get('[class*="ThinkSpherePreviewstyles__CloseButton"]'),
+    yourPlanSubheading: () => cy.get('[class*="YourPlanstyles__Subheading"]'),
+    yourPlanTextarea: () => cy.get('[class*="YourPlanstyles__TextareaBox"]'),
+    yourPlanStrategiesList: () => cy.get('[class*="YourPlanstyles__StrategiesList"]'),
 };
 
 const steps = {
@@ -1349,6 +1357,11 @@ const steps = {
         })
     },
 
+    /**
+     * @description simulate a keyboard key press
+     * @param {string} key - key to be pressed at the cursor
+     */
+
     clickOnReviewTab: () => {
         thinkSpherePage.reviewTab()
             .click();
@@ -1364,6 +1377,11 @@ const steps = {
             .click();
     },
 
+    clickOnYourPlanButton : () => {
+       thinkSpherePage.yourPlanButton()
+            .click();
+    },
+
     switchToGradingView: () => {
         thinkSpherePage.gradingViewRadioButton()
             .click();
@@ -1383,6 +1401,11 @@ const steps = {
         cy.wait(2000);
     },
 
+    submitResponseAndGotoGradingView : () => {
+        thinkSpherePage.submitButton().click();
+        thinkSpherePage.goToGradingViewButton().click();
+    },
+
     stepsBeforeGradingView: () => {
         thinkSpherePage.steps.expandChooseStarterDropdown();
         utilities.getNthElement(thinkSpherePage.chooseStartersListOptions(), 1).click();
@@ -1487,6 +1510,15 @@ const steps = {
             .should('have.attr', 'disabled');
     },
 
+    verifyYourPlanButtonInDisableState : () => {
+        thinkSpherePage.yourPlanButton()
+            .should('have.attr', 'disabled');
+    },
+
+    verifyYourPlanContainerVisibility: () => {
+        utilities.verifyElementVisibilityState(thinkSpherePage.yourPlanContainer(), 'visible');
+    },
+
     /**
      * Verifies that the inner text of the whiteboard's recording status matches the expected text.
      * 
@@ -1538,7 +1570,7 @@ const steps = {
     },
 
     verifyWhiteBoardRecordingInprogressWarningNotVisible: () => {
-        utilities.verifyElementVisibilityState(thinkSpherePage.whiteboardRecordingInProgressWarning(), 'not.be.visible');
+        utilities.verifyElementVisibilityState(thinkSpherePage.whiteboardRecordingInProgressWarning(), 'notExist');
     },
 
     clickOnWhiteBoardRecordingInProgressWarningOkButton: () => {
@@ -1574,12 +1606,12 @@ const steps = {
 
     clickOnWhiteBoardPlaybackPlayButton: () => {
         thinkSpherePage.whiteboardPlaybackPlayButton()
-            .click();
+            .click({ force: true });
     },
 
     clickOnWhiteBoardPlaybackPauseButton: () => {
         thinkSpherePage.whiteboardPlaybackPauseButton()
-            .click();
+            .click({ force: true });
     },
 
     verifyWhiteBoardPlayerPauseButtonVisible: () => {
@@ -2498,9 +2530,8 @@ const tests = {
      * @param {string[]} editSectionWhiteBoardToolButtons - A list of tool names that will be enabled during edit phase.
     */
 
-    verifyWhiteboardToolsAndSubTools: (whiteBoardTools, editSectionWhiteBoardToolButtons) => {
+    verifyAllDefaultToolIds: (whiteBoardTools, editSectionWhiteBoardToolButtons) => {
         const allToolIds = whiteBoardTools.map(tool => tool.dataTestId);
-
         const defaultToolIds = whiteBoardTools.filter(tool => tool.isDefault).map(tool => tool.dataTestId);
 
         it(`${defaultToolIds.join(', ')} should be visible in the whiteboard by default`, () => {
@@ -2510,19 +2541,13 @@ const tests = {
         });
 
         it('All tools should be visible in the whiteboard after selected by the author', () => {
-            thinkSpherePage.steps.switchToEditTab();
-            thinkSpherePage.steps.clickOnSolvePhaseAccordionIcon();
-            thinkSpherePage.steps.expandCustomizeToolsAndControls();
-            editSectionWhiteBoardToolButtons.forEach((toolName) => {
-                thinkSpherePage.steps.selectOptionFromToolsAndControls(toolName);
-            })
-            thinkSpherePage.steps.switchToPreviewTab();
-            thinkSpherePage.steps.clickOnSolveTab();
             allToolIds.forEach((toolId) => {
                 cy.get(`[data-testid="${toolId}"]`).should('exist').and('be.visible');
             });
         })
+    },
 
+    verifyWhiteBoardSubTools: (whiteBoardTools) => {
         whiteBoardTools.forEach((tool) => {
             it(`When user clicks on "${tool.name}" tool it should display its sub tools`, () => {
               // Click the main tool by data-testid
@@ -2573,6 +2598,169 @@ const tests = {
         });
     },
 
+    verifyWhiteboardToolsAndSubTools: (whiteBoardTools, editSectionWhiteBoardToolButtons) => {
+        const allToolIds = whiteBoardTools.map(tool => tool.dataTestId);
+
+        const defaultToolIds = whiteBoardTools.filter(tool => tool.isDefault).map(tool => tool.dataTestId);
+
+        it(`${defaultToolIds.join(', ')} should be visible in the whiteboard by default`, () => {
+            defaultToolIds.forEach((toolId) => {
+                cy.get(`[data-testid="${toolId}"]`).should('exist').and('be.visible');
+            });
+        });
+
+        it('All tools should be visible in the whiteboard after selected by the author', () => {
+            thinkSpherePage.steps.switchToEditTab();
+            thinkSpherePage.steps.clickOnSolvePhaseAccordionIcon();
+            thinkSpherePage.steps.expandCustomizeToolsAndControls();
+            editSectionWhiteBoardToolButtons.forEach((toolName) => {
+                thinkSpherePage.steps.selectOptionFromToolsAndControls(toolName);
+            })
+            thinkSpherePage.steps.switchToPreviewTab();
+            thinkSpherePage.steps.clickOnSolveTab();
+            allToolIds.forEach((toolId) => {
+                cy.get(`[data-testid="${toolId}"]`).should('exist').and('be.visible');
+            });
+        })
+
+        thinkSpherePage.tests.verifyWhiteBoardSubTools(whiteBoardTools);
+    },
+
+    verifyDisabledWhiteboardTools: (defaultToolIds, allToolIds) => {
+        it(`${defaultToolIds.join(', ')} should be visible in the whiteboard by default and it should be disabled with opacity 0.4`, () => {
+            defaultToolIds.forEach((toolId) => {
+                cy.get(`[data-testid="${toolId}"]`).should('exist').and('be.visible');
+                cy.get(`[data-testid="${toolId}"]`).should('have.css', 'opacity', '0.4');
+            });
+        });
+
+        it('All tools should be visible in the whiteboard after selected by the author and it should be disabled with opacity 0.4', () => {
+            allToolIds.forEach((toolId) => {
+                cy.get(`[data-testid="${toolId}"]`).should('exist').and('be.visible');
+                cy.get(`[data-testid="${toolId}"]`).should('have.css', 'opacity', '0.4');
+            });
+        });
+    },
+
+    verifyYourPlanSection: () => {
+        it('When user clicks on "Your Plan" button then it should navigate to Your Plan section', () => {
+            thinkSpherePage.steps.clickOnYourPlanButton();
+            thinkSpherePage.steps.verifyYourPlanContainerVisibility();
+        });
+
+        it('Your Plan section should have a header with title and close button', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.yourPlanHeaderContainer(), 'visible');
+            utilities.verifyInnerText(thinkSpherePage.yourPlanHeadingLabel(), 'Your plan');
+            utilities.verifyElementVisibilityState(thinkSpherePage.yourPlanCloseButton(), 'visible');
+        });
+
+        it('Your Plan section should display "The problem is asking me to" section with textarea', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.yourPlanSubheading().contains('The problem is asking me to'), 'visible');
+            const problemTextarea = thinkSpherePage.yourPlanTextarea().first();
+            utilities.verifyElementVisibilityState(problemTextarea, 'visible');
+            problemTextarea.should('have.attr', 'placeholder', 'Enter your text here');
+        });
+
+        it('Your Plan section should display "Selected strategies" section with checkboxes', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.yourPlanSubheading().contains('Selected strategies'), 'visible');
+            utilities.verifyElementVisibilityState(thinkSpherePage.yourPlanStrategiesList(), 'visible');
+            thinkSpherePage.yourPlanStrategiesList()
+                .find('li')
+                .should('have.length', 5);
+        });
+
+        it('Your Plan section should display correct strategy options with checkboxes', () => {
+            const expectedStrategies = [
+                'Create a model',
+                'Look for a pattern',
+                'Guess, check, and revise',
+                'Try with friendlier numbers',
+                'Show with an equation'
+            ];
+
+            expectedStrategies.forEach((strategyText) => {
+                thinkSpherePage.yourPlanStrategiesList()
+                    .contains(strategyText)
+                    .should('be.visible');
+            });
+
+            thinkSpherePage.yourPlanStrategiesList()
+                .find('input[type="checkbox"]')
+                .should('have.length', 5)
+                .and('not.be.checked');
+        });
+
+        it('Your Plan section should display "Planning journal" section with textarea', () => {
+            utilities.verifyElementVisibilityState(thinkSpherePage.yourPlanSubheading().contains('Planning journal'), 'visible');
+            const journalTextarea = thinkSpherePage.yourPlanTextarea().last();
+            utilities.verifyElementVisibilityState(journalTextarea, 'visible');
+            journalTextarea.should('have.attr', 'placeholder', 'Enter your text here');
+        });
+
+        it('User should be able to enter text in the "The problem is asking me to" textarea', () => {
+            const testText = 'Find the value of x in the equation';
+            thinkSpherePage.yourPlanTextarea().first().click({ force: true }).type(testText);
+            thinkSpherePage.yourPlanTextarea().first().should('have.value', testText);
+        });
+
+        it('User should be able to check and uncheck strategy options', () => {
+            // Check first and third strategy options
+            thinkSpherePage.yourPlanStrategiesList()
+                .find('input[type="checkbox"]')
+                .eq(0)
+                .check()
+                .should('be.checked');
+                
+            thinkSpherePage.yourPlanStrategiesList()
+                .find('input[type="checkbox"]')
+                .eq(2)
+                .check()
+                .should('be.checked');
+                
+            // Uncheck first strategy option
+            thinkSpherePage.yourPlanStrategiesList()
+                .find('input[type="checkbox"]')
+                .eq(0)
+                .uncheck()
+                .should('not.be.checked');
+        });
+
+        it('User should be able to enter text in the "Planning journal" textarea', () => {
+            const testText = 'I will first identify the variables and then solve the equation';
+            thinkSpherePage.yourPlanTextarea().last().clear().type(testText);
+            thinkSpherePage.yourPlanTextarea().last().should('have.value', testText);
+        });
+
+        it('When the user clicks on close button, the Your Plan section should be closed', () => {
+            thinkSpherePage.yourPlanCloseButton().click();
+            utilities.verifyElementVisibilityState(thinkSpherePage.yourPlanContainer(), 'notExist');
+        });
+
+        it('CSS of Your Plan section', { tags: 'css' }, () => {
+            thinkSpherePage.steps.clickOnYourPlanButton();
+            utilities.verifyCSS(thinkSpherePage.yourPlanHeaderContainer(), {
+                'display': 'flex',
+                'justify-content': 'space-between',
+                'align-items': 'center',
+            });
+            
+            utilities.verifyCSS(thinkSpherePage.yourPlanHeadingLabel(), {
+                'font-size': css.fontSize.huge,
+                'font-weight': css.fontWeight.bold,
+                'color': css.color.panelLabel,
+            });
+            
+            utilities.verifyCSS(thinkSpherePage.yourPlanStrategiesList(), {
+                'padding': '0px',
+                'margin': '0px 0px 24px'
+            });
+        });
+        
+        it('Accessibility of Your Plan section', { tags: 'a11y' }, () => {
+            cy.checkAccessibility(thinkSpherePage.yourPlanContainer());
+        });
+    },
+
     verifyWhiteboardPageNavigation: () => {
         it('By default "Previous" and "Next" page buttons should be disabled', () => {
             thinkSpherePage.steps.verifyPreviousButtonDisabled();
@@ -2655,7 +2843,7 @@ const tests = {
                 'color': css.color.primaryBtn,
                 'font-size': css.fontSize.default,
                 'font-weight': css.fontWeight.semibold,
-                'background-color': css.color.primaryBtnBg
+                // 'background-color': css.color.primaryBtnBg
             });
         });
         
@@ -2672,7 +2860,7 @@ const tests = {
                 .first()
                 .click({ force: true });
             cy.get('.upper-canvas').click({ force: true });
-            cy.focused().type('Test text for recording');
+            cy.wait(1000);
             thinkSpherePage.steps.clickOnStopButton();
             thinkSpherePage.steps.clickOnReviewTab();
             thinkSpherePage.steps.verifyWhiteBoardRecordingInprogressWarningNotVisible();
@@ -2684,6 +2872,8 @@ const tests = {
         });
 
         it('When the user clicks on the Play button, it should play the recording', () => {
+            cy.wait(1000);
+            thinkSpherePage.steps.verifyWhiteBoardPlayerPlayButtonVisible();
             thinkSpherePage.steps.clickOnWhiteBoardPlaybackPlayButton();
             thinkSpherePage.steps.verifyWhiteBoardPlayerPauseButtonVisible();
             thinkSpherePage.steps.verifyWhiteBoardPlayerTimeStatus('00:01');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "itemengine-cypress-automation",
-  "version": "1.0.387-IEI-6161-IEI-6162-manualAndNonScoredScript-481a8a8.0",
+  "version": "1.0.387-IEI-6274-d9be2a2.0",
   "description": "",
   "main": "index.js",
   "scripts": {