itemengine-cypress-automation 1.0.189-e2e-execution-crash-fbb0d92.0 → 1.0.189

package/cypress/e2e/ILC/VideoResponseNew/studentViewSettings.js

@@ -0,0 +1,194 @@
+import { dialogBoxBase } from "../../../pages";
+import { videoResponsePage } from "../../../pages/videoResponsePage";
+import abortEarlySetup from "../../../support/helpers/abortEarly";
+import utilities from "../../../support/helpers/utilities";
+const css = Cypress.env('css');
+
+describe('Create item page - Audio response: Student view settings for Standard recorder style', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Video settings : Edit tab', () => {
+        abortEarlySetup();
+        before(() => {
+            videoResponsePage.steps.navigateToCreateQuestion('video response');
+            cy.barsPreLoaderWait();
+        });
+
+        videoResponsePage.tests.verifyStudentViewSettingsLabelAndCSS();
+
+        it('\'Video settings\' label should be displayed', () => {
+            utilities.verifyInnerText(videoResponsePage.videoSettingsLabel(), 'Video settings');
+        });
+
+        it('\'Video settings\' options - "Timer" and "Progress indicator" should be displayed. By default, all options should be in selected state', () => {
+            videoResponsePage.steps.verifyVideoSettingsToggleButtonSelectedState('Timer');
+            utilities.verifyInnerText(utilities.getNthElement(videoResponsePage.videoSettingsButtonLabel(), 0), 'Timer');
+            videoResponsePage.steps.verifyVideoSettingsToggleButtonSelectedState('Progress indicator');
+            utilities.verifyInnerText(utilities.getNthElement(videoResponsePage.videoSettingsButtonLabel(), 1), 'Progress indicator');
+        });
+
+        videoResponsePage.tests.verifyLimitNumberOfRetakeCheckboxDefaultState();
+
+        it('CSS of \'Video settings\' section', { tags: 'css' }, () => {
+            utilities.verifyCSS(videoResponsePage.videoSettingsLabel(), {
+                'color': css.color.sectionHeading,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.semibold
+            });
+            utilities.verifyCSS(videoResponsePage.timerButtonVideoSettings(), {
+                'color': css.color.defaultBackground,
+                'background-color': css.color.activeButtons,
+                'border': `1px solid ${css.color.activeButtons}`
+            });
+            utilities.verifyCSS(videoResponsePage.tickIconForOptionButtons(), {
+                'background-color': css.color.defaultBackground,
+            });
+            utilities.verifyCSS(videoResponsePage.tickIconForOptionButtons().find('[data-name="Icon feather-check"]'), {
+                'fill': css.color.activeButtons,
+            });
+            utilities.verifyCSS(videoResponsePage.videoSettingsButtonLabel(), {
+                'color': css.color.labels,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.semibold
+            });
+            utilities.verifyCSS(videoResponsePage.limitNumberOfRetakeCheckboxLabel(), {
+                'color': css.color.labelText,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.regular
+            });
+        });
+
+        it('The user should be able to deselect any button from the \'Video settings\' section', () => {
+            videoResponsePage.steps.deselectVideoSettingsToggleButton('Timer');
+        });
+
+        it('CSS of \'Video settings\' section: Timer button - deselected state', () => {
+            utilities.verifyCSS(videoResponsePage.timerButtonVideoSettings(), {
+                'color': css.color.secondaryBtn,
+                'background-color': css.color.secondaryBtnBg,
+                'border': `1px solid ${css.color.secondaryBtnBorder}`
+            });
+        });
+
+        videoResponsePage.tests.verifyLimitNumberOfRetakeCheckboxCheckedState();
+    });
+
+    describe('Video settings : Timer', () => {
+        abortEarlySetup();
+        before(() => {
+            videoResponsePage.steps.navigateToCreateQuestion('video response');
+            cy.barsPreLoaderWait();
+        });
+
+        it('In standard mode, when the \'Timer\' option is selected, the timer should be displayed in the recorder as well as playback player of the preview tab', () => {
+            videoResponsePage.steps.switchToPreviewTab();
+            utilities.verifyInnerText(videoResponsePage.recordingTimer(), '5:00');
+            utilities.verifyElementVisibilityState(videoResponsePage.recordingTimer(), 'visible');
+            videoResponsePage.steps.startRecording();
+            videoResponsePage.steps.waitForRecordingToStart();
+            utilities.verifyElementVisibilityState(videoResponsePage.recordingTimer(), 'visible');
+            videoResponsePage.steps.addWaitToRecord(2000);
+            videoResponsePage.steps.stopRecording();
+            videoResponsePage.steps.verifyVideoPlaybackTimer('00:00', '00:03');
+            utilities.verifyElementVisibilityState(videoResponsePage.playerTimer(), 'visible');
+        });
+
+        it('In standard mode, when the \'Timer\' option is deselected, the timer should not be displayed in the recorder as well as playback player of the preview tab', () => {
+            videoResponsePage.steps.switchToEditTab();
+            videoResponsePage.steps.deselectVideoSettingsToggleButton('Timer');
+            videoResponsePage.steps.switchToPreviewTab();
+            utilities.verifyElementVisibilityState(videoResponsePage.recordingTimer(), 'notExist');
+            videoResponsePage.steps.startRecording();
+            utilities.verifyElementVisibilityState(videoResponsePage.recordingTimer(), 'notExist');
+            videoResponsePage.steps.stopRecording();
+            utilities.verifyElementVisibilityState(videoResponsePage.playerTimer(), 'notExist');
+        });
+    });
+
+    describe('Video settings : Progress indicator', () => {
+        abortEarlySetup();
+        before(() => {
+            videoResponsePage.steps.navigateToCreateQuestion('video response');
+            cy.barsPreLoaderWait();
+        });
+
+        it('In standard mode, when the \'Progress indicator\' option is selected, the progress indicator should be displayed in the playback player of the preview tab', () => {
+            videoResponsePage.steps.switchToPreviewTab();
+            videoResponsePage.steps.startRecording();
+            videoResponsePage.steps.waitForRecordingToStart();
+            videoResponsePage.steps.addWaitToRecord(2000);
+            videoResponsePage.steps.stopRecording();
+            utilities.verifyElementVisibilityState(videoResponsePage.progressBar(), 'visible');
+        });
+
+        it('In standard mode, when the \'Progress indicator\' option is deselected, the progress indicator should not be displayed in the playback player of the preview tab', () => {
+            videoResponsePage.steps.switchToEditTab();
+            videoResponsePage.steps.deselectVideoSettingsToggleButton('Progress indicator');
+            videoResponsePage.steps.switchToPreviewTab();
+            videoResponsePage.steps.startRecording();
+            videoResponsePage.steps.waitForRecordingToStart();
+            videoResponsePage.steps.stopRecording();
+            utilities.verifyElementVisibilityState(videoResponsePage.progressBar(), 'notExist');
+        });
+    });
+
+    describe('Limit number of retake : Preview tab', () => {
+        abortEarlySetup();
+        before(() => {
+            videoResponsePage.steps.navigateToCreateQuestion('video response');
+            cy.barsPreLoaderWait();
+        });
+
+        it('For "Standard" mode, When the user checks the \'Limit number of retake\' checkbox, sets retake limit and switches to the preview tab, then only the specified number of retakes should be allowed and after specified number of retakes are performed, then the retake recording button should get disabled', () => {
+            videoResponsePage.steps.checkLimitNumberOfRetakeCheckbox();
+            videoResponsePage.steps.setRetakeLimit(1);
+            videoResponsePage.steps.switchToPreviewTab();
+            videoResponsePage.steps.startRecording();
+            videoResponsePage.steps.waitForRecordingToStart();
+            videoResponsePage.steps.stopRecording();
+            videoResponsePage.steps.retakeRecording();
+            videoResponsePage.steps.confirmRetake();
+            utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'notExist');
+            utilities.verifyInnerText(videoResponsePage.recordingStatusText(), 'Recording...');
+            videoResponsePage.steps.waitForRecordingToStart();
+            videoResponsePage.steps.stopRecording();
+            utilities.verifyElementDisabled(videoResponsePage.retakeRecordingButton());
+        });
+
+        it('For "Standard" mode, When the user checks the "Show students the retake limits on tooltip" checkbox and has set a retake limit and switches to the preview tab, then on hovering over the retake recording button, Retake recording (# retakes remaining) should be displayed on a tooltip', () => {
+            videoResponsePage.steps.switchToEditTab();
+            videoResponsePage.steps.checkShowStudentsTheRetakeLimitsOnTooltipCheckbox();
+            videoResponsePage.steps.switchToPreviewTab();
+            videoResponsePage.steps.startRecording();
+            videoResponsePage.steps.waitForRecordingToStart();
+            videoResponsePage.steps.stopRecording();
+            videoResponsePage.retakeRecordingButton()
+                .verifyTooltip('Retake recording(1 retakes remaining)');
+        });
+
+        it('For "Standard" mode, When the user removes the retake limit, then the user should be able to retake the recording for n number of times', () => {
+            videoResponsePage.steps.switchToEditTab();
+            videoResponsePage.steps.clearRetakeLimitInputField();
+            videoResponsePage.steps.switchToPreviewTab();
+            videoResponsePage.steps.startRecording();
+            videoResponsePage.steps.waitForRecordingToStart();
+            videoResponsePage.steps.stopRecording();
+            videoResponsePage.steps.verifyResponseIsRecordedHelpText();
+            videoResponsePage.steps.retakeRecording();
+            videoResponsePage.steps.confirmRetake();
+            utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'notExist');
+            utilities.verifyInnerText(videoResponsePage.recordingStatusText(), 'Recording...');
+            videoResponsePage.steps.waitForRecordingToStart();
+            videoResponsePage.steps.stopRecording();
+            videoResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementNotDisabled(videoResponsePage.retakeRecordingButton());
+        });
+
+        it('For "Standard" mode, When there is no retake limit set, then on hovering over the retake recording button, then retake limits should not be displayed on retake recording button tooltip', () => {
+            videoResponsePage.retakeRecordingButton()
+                .verifyTooltip('Retake recording');
+        });
+    });
+});

package/cypress/fixtures/constants.js

@@ -9,7 +9,7 @@ const constants = {
     sampleSVGLink: "https://www.svgrepo.com/show/128943/3-flowers.svg",
     CKEditorEquationEditorPopupInputFieldEnteredEquationText: "x=3√8,What is the value of x?",
     CKEditorInputFieldEnteredEquationText: "x=83,What is the value of x?",
-    CKEditorInputFieldEnteredEquationAriaLabel: "x equals the cube root of 8 comma cap w h of A t i s t h of e v A l u e o f x question mark question mark",
+    CKEditorInputFieldEnteredEquationAriaLabel: "x equals the cube root of 8 comma cap w h of A t i s t h of e v A l u e o f x question mark",
     sampleMp3Link: "https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3",
     sampleWAVLink: "https://dl.espressif.com/dl/audio/ff-16b-1c-44100hz.wav",
     sampleAACLink: "https://dl.espressif.com/dl/audio/ff-16b-1c-44100hz.aac",

package/cypress/fixtures/drawingToolbarOptionsAdditionalOptionsAndSpecialAndMathCharacters.js

@@ -15,7 +15,7 @@ export const drawingToolbarOptionsAndAdditionalOptions = {
         {
             displayName: 'Line',
             additionalOptions: [' strokefontcolor', ' strokefontcolorpicker'],
-            secondaryToolbarOptions: ['Stroke color', 'Stroke thickness', 'Line Type', 'Opacity'],
+            secondaryToolbarOptions: ['Stroke color', 'Stroke thickness', 'Line type', 'Opacity'],
             tooltipText: 'LineDraw a straight line',
             toolType: 'tool'
         },

package/cypress/fixtures/equationEditorCategoriesAndSymbols .js

@@ -80,17 +80,11 @@ export const equationEditorCategoriesAndSymbols = {
                 ariaLabel: 'Comma',
                 displayText: ','
             },
-            add: {
-                title: 'Addition',
-                textElement: null,
-                ariaLabel: 'Plus 6',
-                displayText: '+'
-            },
-            subtract: {
-                title: 'Subtraction',
+            divide: {
+                title: 'Division',
                 textElement: null,
-                ariaLabel: 'Minus',
-                displayText: '−'
+                ariaLabel: 'Division',
+                displayText: '÷'
             },
             multiply: {
                 title: 'Multiply',
@@ -98,11 +92,17 @@ export const equationEditorCategoriesAndSymbols = {
                 ariaLabel: 'Multiply',
                 displayText: '×'
             },
-            divide: {
-                title: 'Division',
+            subtract: {
+                title: 'Subtraction',
                 textElement: null,
-                ariaLabel: 'Division',
-                displayText: '÷'
+                ariaLabel: 'Minus',
+                displayText: '−'
+            },
+            add: {
+                title: 'Addition',
+                textElement: null,
+                ariaLabel: 'Plus 6',
+                displayText: '+'
             },
             equalTo: {
                 title: 'Equal To',
@@ -122,17 +122,17 @@ export const equationEditorCategoriesAndSymbols = {
                 ariaLabel: 'MoveRight',
                 displayText: null
             },
-            clear: {
-                title: 'Clear',
-                textElement: null,
-                ariaLabel: 'Clear',
-                displayText: null
-            },
             clearAll: {
                 title: 'Clear all',
                 textElement: null,
                 ariaLabel: 'ClearAll',
                 displayText: null
+            },
+            clear: {
+                title: 'Clear',
+                textElement: null,
+                ariaLabel: 'Clear',
+                displayText: null
             }
         }
     },

package/cypress/fixtures/theme/ilc.json

@@ -47,8 +47,8 @@
         "highlightedTableCellBorder": "rgb(255, 255, 255)",
         "standardTableCellText": "rgb(51, 51, 51)",
         "editTableDeleteButton": "rgb(204, 39, 0)",
-        "progressBarRemainingFill": "rgb(194, 194, 194)",
-        "progressBarElapsedFill": "rgb(64, 134, 235)",
+        "progressBarRemainingFill": "rgb(238, 241, 251)",
+        "progressBarElapsedFill": "rgb(82, 0, 255)",
         "progressBarSliderHoverBackground": "rgba(25, 118, 210, 0.16)",
         "waveformCursorColor": "rgb(0, 0, 0)",
         "audioResponsePreviewComponentsFill": "rgb(64, 134, 235)",
@@ -135,7 +135,13 @@
         "uploadedFileName": "rgb(0, 0, 124)",
         "feedbackHeart": "rgb(255, 56, 0)",
         "manipulativeOptionContainerBorder": "rgb(186, 201, 255)",
-        "cellIcon": "rgb(186, 201, 255)"
+        "cellIcon": "rgb(186, 201, 255)",
+        "outerBorder": "rgb(186, 201, 255)",
+        "playbackTime": "rgb(0, 0, 124)",
+        "stopButtonBg": "rgb(187, 47, 10)",
+        "stopButtonBorder": "rgb(92, 0, 0)",
+        "progressBarPin": "rgb(0, 0, 46)",
+        "barLockIcon": "rgb(0, 0, 46)"
     },
     "fontSize": {
         "extraSmall": "10px",
@@ -161,27 +167,25 @@
             "hoverBackground": "rgba(82, 0, 255, 0.2)",
             "hoverBorder": "rgba(82, 0, 255, 0.4)"
         },
-        "darkGreen":{
-            "background": "rgb(186, 201, 255)",
-            "hoverBackground": "rgba(186, 201, 255, 0.4)",
-            "hoverBorder": "rgb(107, 139, 255)"
+        "aqua":{
+            "background": "rgb(0, 112, 128)",
+            "hoverBackground": "rgba(0, 112, 128, 0.2)",
+            "hoverBorder": "rgba(0, 112, 128, 0.4)"
         },
         "brown":{
-            "background": "rgb(128, 239, 255)",
-            "hoverBackground": "rgba(128, 239, 255, 0.4)",
-            "hoverBorder": "rgb(0, 156, 179)"
+            "background": "rgb(128, 102, 69)",
+            "hoverBackground": "rgba(128, 102, 69, 0.2)",
+            "hoverBorder": "rgba(128, 102, 69, 0.4)"
         },
         "grey":{
-            "background": "rgb(255, 238, 215)",
-            "hoverBackground": "rgba(255, 238, 215, 0.4)",
-            "hoverBorder": "rgb(153, 134, 67)"
+            "background": "rgb(102, 102, 102)",
+            "hoverBackground": "rgba(102, 102, 102, 0.2)",
+            "hoverBorder": "rgba(102, 102, 102, 0.4)"
         },
         "black":{
-            "title": "yellow",
-            "background": "rgb(255, 238, 78)",
-            "border": "rgb(64, 59, 20)",
-            "hoverBackground": "rgba(255, 238, 78, 0.4)",
-            "hoverBorder": "rgb(153, 141, 32)"
+            "background": "rgb(0, 0, 0)",
+            "hoverBackground": "rgba(0, 0, 0, 0.2)",
+            "hoverBorder": "rgba(0, 0, 0, 0.4)"
         }
     }
 }