itemengine-cypress-automation 1.0.113 → 1.0.115

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

@@ -0,0 +1,529 @@
+import { dialogBoxBase } from "../../../pages";
+import { audioResponsePage } from "../../../pages/audioResponsePage";
+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', () => {
+    before(() => {
+        cy.loginAs('admin');
+    });
+
+    describe('Audio indicators : Edit tab', () => {
+        abortEarlySetup();
+        before(() => {
+            audioResponsePage.steps.navigateToCreateQuestion('audio response');
+            cy.barsPreLoaderWait();
+        });
+
+        audioResponsePage.tests.verifyStudentViewSettingsLabelAndCSS();
+
+        it('\'Audio indicators\' label should be displayed', () => {
+            utilities.verifyInnerText(audioResponsePage.audioIndicatorsLabel(), 'Audio indicators');
+        });
+
+        it('\'Audio indicators\' options - "Timer", "Progress indicator", "Audio wave" and "Volume meter" should be displayed. By default, all options should be in selected state', () => {
+            audioResponsePage.steps.verifyAudioIndicatorsTimeButtonSelectedState();
+            audioResponsePage.steps.verifyAudioIndicatorsProgressIndicatorButtonSelectedState();
+            audioResponsePage.steps.verifyAudioIndicatorsAudioWaveButtonSelectedState();
+            audioResponsePage.steps.verifyAudioIndicatorsVolumeMeterButtonSelectedState();
+            utilities.verifyInnerText(audioResponsePage.audioIndicatorsTimerButtonLabel(), 'Timer');
+            utilities.verifyInnerText(audioResponsePage.audioIndicatorsProgressIndicatorButtonLabel(), 'Progress indicator');
+            utilities.verifyInnerText(audioResponsePage.audioIndicatorsAudioWaveButtonLabel(), 'Audio wave');
+            utilities.verifyInnerText(audioResponsePage.audioIndicatorsVolumeMeterButtonLabel(), 'Volume meter');
+        });
+
+        it('"Limit number of retake" label and checkbox should be displayed. By default the checkbox should be unchecked', () => {
+            utilities.verifyInnerText(audioResponsePage.limitNumberOfRetakeCheckboxLabel(), 'Limit number of retake');
+            audioResponsePage.steps.limitNumberOfRetakeCheckboxUncheckedState();
+        });
+
+        it('CSS of \'Audio indicators\' section', { tags: 'css' }, () => {
+            utilities.verifyCSS(audioResponsePage.audioIndicatorsLabel(), {
+                'color': css.color.sectionHeading,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.semibold
+            });
+            utilities.verifyCSS(audioResponsePage.audioIndicatorsTimerButton(), {
+                'color': css.color.defaultBackground,
+                'background-color': css.color.activeButtons,
+                'border': `1px solid ${css.color.activeButtons}`
+            });
+            utilities.verifyCSS(audioResponsePage.tickIconForOptionButtons(), {
+                'background-color': css.color.defaultBackground,
+            });
+            utilities.verifyCSS(audioResponsePage.tickIconForOptionButtons().find('[data-name="Icon feather-check"]'), {
+                'fill': css.color.activeButtons,
+            });
+            utilities.verifyCSS(audioResponsePage.audioIndicatorsProgressIndicatorButtonLabel(), {
+                'color': css.color.labels,
+                'font-size': css.fontSize.normal,
+                'font-weight': css.fontWeight.semibold
+            });
+            utilities.verifyCSS(audioResponsePage.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 \'Audio indicators\' section', () => {
+            audioResponsePage.steps.deselectAudioIndicatorsTimerButton();
+        });
+
+        it('CSS of \'Audio indicators\' section: Timer button - deselected state', () => {
+            utilities.verifyCSS(audioResponsePage.audioIndicatorsTimerButton(), {
+                'color': css.color.secondaryBtn,
+                'background-color': css.color.secondaryBtnBg,
+                'border': `1px solid ${css.color.secondaryBtnBorder}`
+            });
+        });
+
+        it('When the user checks the "Limit number of retake" checkbox, "Show students the retake limits on tooltip" label and checkbox, "Retake limit" label and input field should be displayed. By default, "Show students the retake limits on tooltip" checkbox should be unchecked and the "Retake limit" input field should be empty', () => {
+            audioResponsePage.steps.checkLimitNumberOfRetakeCheckbox();
+            utilities.verifyInnerText(audioResponsePage.showStudentsTheRetakeLimitsOnTooltipCheckboxLabel(), 'Show students the retake limits on tooltip');
+            audioResponsePage.steps.verifyShowStudentsTheRetakeLimitsOnTooltipCheckboxUncheckedState();
+            utilities.verifyInnerText(audioResponsePage.retakeLimitLabel(), 'Retake limit');
+            audioResponsePage.steps.verifyRetakeLimitInputFieldValue('');
+        });
+    });
+
+    describe('Audio indicators : Timer', () => {
+        abortEarlySetup();
+        before(() => {
+            audioResponsePage.steps.navigateToCreateQuestion('audio 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', () => {
+            audioResponsePage.steps.switchToPreviewTab();
+            utilities.verifyInnerText(audioResponsePage.standardPreviewRecordTime(), '15:00');
+            utilities.verifyElementVisibilityState(audioResponsePage.standardPreviewRecordTime(), 'visible');
+            audioResponsePage.steps.startRecordingStandardPreview();
+            audioResponsePage.steps.waitForRecordingToStartStandardPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.standardPreviewRecordTime(), 'visible');
+            audioResponsePage.steps.addWaitToRecordAudio(2000);
+            audioResponsePage.steps.stopRecordingStandardPreview();
+            audioResponsePage.steps.verifyPlaybackTimeStandardPreview('00:00', '00:03');
+            utilities.verifyElementVisibilityState(audioResponsePage.standardPreviewPlaybackTime(), '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', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.deselectAudioIndicatorsTimerButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            utilities.verifyElementVisibilityState(audioResponsePage.standardPreviewRecordTime(), 'notExist');
+            audioResponsePage.steps.startRecordingStandardPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.standardPreviewRecordTime(), 'notExist');
+            audioResponsePage.steps.stopRecordingStandardPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.standardPreviewPlaybackTime(), 'notExist');
+        });
+
+        it('In bar mode, when the \'Timer\' option is selected, the timer should be displayed in the recorder as well as playback player of the preview tab', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.selectAudioRecorderStyle('Bar');
+            audioResponsePage.steps.selectAudioIndicatorsTimerButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            utilities.verifyInnerText(audioResponsePage.barPreviewRecordTime(), '15:00');
+            utilities.verifyElementVisibilityState(audioResponsePage.barPreviewRecordTime(), 'visible');
+            audioResponsePage.steps.startRecordingBarPreview();
+            audioResponsePage.steps.waitForRecordingToStartBarPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.barPreviewRecordTime(), 'visible');
+            audioResponsePage.steps.addWaitToRecordAudio(2000);
+            audioResponsePage.steps.stopRecordingBarPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.barPreviewPlaybackTime(), 'visible');
+        });
+
+        it('In bar 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', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.deselectAudioIndicatorsTimerButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            utilities.verifyElementVisibilityState(audioResponsePage.barPreviewRecordTime(), 'notExist');
+            audioResponsePage.steps.startRecordingBarPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.barPreviewRecordTime(), 'notExist');
+            audioResponsePage.steps.stopRecordingBarPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.barPreviewPlaybackTime(), 'notExist');
+        });
+
+        it('In compact mode, when the \'Timer\' option is selected, the timer should be displayed in the recorder as well as playback player of the preview tab', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.selectAudioRecorderStyle('Compact');
+            audioResponsePage.steps.selectAudioIndicatorsTimerButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingCompactPreview();
+            utilities.verifyInnerText(audioResponsePage.compactPreviewRecordingTimer(), '15:00');
+            utilities.verifyElementVisibilityState(audioResponsePage.compactPreviewRecordingTimer(), 'visible');
+            audioResponsePage.steps.waitForRecordingToStartCompactPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.compactPreviewRecordingTimer(), 'visible');
+            audioResponsePage.steps.addWaitToRecordAudio(2000);
+            audioResponsePage.steps.stopRecordingCompactPreview();
+            audioResponsePage.steps.verifyPlaybackTimeCompactPreview('00:00', '00:03');
+            utilities.verifyElementVisibilityState(audioResponsePage.compactPreviewPlaybackTime(), 'visible');
+        });
+
+        it('In compact 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', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.deselectAudioIndicatorsTimerButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            utilities.verifyElementVisibilityState(audioResponsePage.compactPreviewRecordingTimer(), 'notExist');
+            audioResponsePage.steps.startRecordingCompactPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.compactPreviewRecordingTimer(), 'notExist');
+            audioResponsePage.steps.stopRecordingCompactPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.compactPreviewPlaybackTime(), 'notExist');
+        });
+    });
+
+    describe('Audio indicators : Progress indicator', () => {
+        abortEarlySetup();
+        before(() => {
+            audioResponsePage.steps.navigateToCreateQuestion('audio 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', () => {
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingStandardPreview();
+            audioResponsePage.steps.waitForRecordingToStartStandardPreview();
+            audioResponsePage.steps.addWaitToRecordAudio(2000);
+            audioResponsePage.steps.stopRecordingStandardPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementVisibilityState(audioResponsePage.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', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.deselectAudioIndicatorsPlaybackIndicatorButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingStandardPreview();
+            audioResponsePage.steps.waitForRecordingToStartStandardPreview();
+            audioResponsePage.steps.stopRecordingStandardPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementVisibilityState(audioResponsePage.progressBar(), 'notExist');
+        });
+
+        it('In bar mode, when the \'Progress indicator\' option is selected,  the progress indicator should be displayed in the playback player of the preview tab', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.selectAudioRecorderStyle('Bar');
+            audioResponsePage.steps.selectAudioIndicatorsProgressIndicatorButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingBarPreview();
+            audioResponsePage.steps.waitForRecordingToStartBarPreview();
+            audioResponsePage.steps.stopRecordingBarPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementVisibilityState(audioResponsePage.progressBar(), 'visible');
+        });
+
+        it('In bar mode, when the \'Progress indicator\' option is deselected, the progress indicator should not be displayed in the playback player of the preview tab', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.deselectAudioIndicatorsPlaybackIndicatorButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingBarPreview();
+            audioResponsePage.steps.waitForRecordingToStartBarPreview();
+            audioResponsePage.steps.stopRecordingBarPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementVisibilityState(audioResponsePage.progressBar(), 'notExist');
+        });
+
+        it('In compact mode, when the \'Progress indicator\' option is selected, the progress indicator should be displayed in the playback player of the preview tab', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.selectAudioRecorderStyle('Compact');
+            audioResponsePage.steps.selectAudioIndicatorsProgressIndicatorButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingCompactPreview();
+            audioResponsePage.steps.waitForRecordingToStartCompactPreview();
+            audioResponsePage.steps.stopRecordingCompactPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementVisibilityState(audioResponsePage.progressBar(), 'visible');
+        });
+
+        it('In compact mode, when the \'Progress indicator\' option is deselected, the progress indicator should not be displayed in the playback player of the preview tab', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.deselectAudioIndicatorsPlaybackIndicatorButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingCompactPreview();
+            audioResponsePage.steps.waitForRecordingToStartCompactPreview();
+            audioResponsePage.steps.stopRecordingCompactPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementVisibilityState(audioResponsePage.progressBar(), 'notExist');
+        });
+    });
+
+    describe('Audio indicators : Audio wave', () => {
+        abortEarlySetup();
+        before(() => {
+            audioResponsePage.steps.navigateToCreateQuestion('audio response');
+            cy.barsPreLoaderWait();
+        });
+
+        it('In standard mode, when the \'Audio wave\' option is selected, the audio wave should be displayed in the playback player of the preview tab', () => {
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingStandardPreview();
+            audioResponsePage.steps.waitForRecordingToStartStandardPreview();
+            audioResponsePage.steps.addWaitToRecordAudio(2000);
+            audioResponsePage.steps.stopRecordingStandardPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementVisibilityState(audioResponsePage.playbackWaveform(), 'visible');
+        });
+
+        it('In standard mode, when the \'Audio wave\' option is deselected, the audio wave should not be displayed in the playback player of the preview tab', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.deselectAudioIndicatorsPlaybackIndicatorButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingStandardPreview();
+            audioResponsePage.steps.waitForRecordingToStartStandardPreview();
+            audioResponsePage.steps.stopRecordingStandardPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementVisibilityState(audioResponsePage.playbackWaveform(), 'notExist');
+        });
+
+        it('In compact mode, when the \'Audio wave\' option is selected, the audio wave should be displayed in the playback player of the preview tab', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.selectAudioRecorderStyle('Compact');
+            audioResponsePage.steps.selectAudioIndicatorsProgressIndicatorButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingCompactPreview();
+            audioResponsePage.steps.waitForRecordingToStartCompactPreview();
+            audioResponsePage.steps.stopRecordingCompactPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementVisibilityState(audioResponsePage.playbackWaveform(), 'visible');
+        });
+
+        it('In compact mode, when the \'Audio wave\' option is deselected, the audio wave should not be displayed in the playback player of the preview tab', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.deselectAudioIndicatorsPlaybackIndicatorButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingCompactPreview();
+            audioResponsePage.steps.waitForRecordingToStartCompactPreview();
+            audioResponsePage.steps.stopRecordingCompactPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementVisibilityState(audioResponsePage.playbackWaveform(), 'notExist');
+        });
+    });
+
+    describe('Audio indicators : Volume meter', () => {
+        abortEarlySetup();
+        before(() => {
+            audioResponsePage.steps.navigateToCreateQuestion('audio response');
+            cy.barsPreLoaderWait();
+        });
+
+        it('In standard mode, when the \'Volume meter\' option is selected, the volume meter should be displayed in the recorder as well as playback player of the preview tab', () => {
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingStandardPreview();
+            audioResponsePage.steps.waitForRecordingToStartStandardPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.previewVolumeMeter(), 'visible');
+            audioResponsePage.steps.addWaitToRecordAudio(2000);
+            audioResponsePage.steps.stopRecordingStandardPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementVisibilityState(audioResponsePage.previewVolumeMeter(), 'visible');
+        });
+
+        it('In standard mode, when the \'Volume meter\' option is deselected, the volume meter should not be displayed in the recorder as well as playback player of the preview tab', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.deselectAudioIndicatorsVolumeMeterButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingStandardPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.previewVolumeMeter(), 'hidden');
+            audioResponsePage.steps.waitForRecordingToStartStandardPreview();
+            audioResponsePage.steps.stopRecordingStandardPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementVisibilityState(audioResponsePage.previewVolumeMeter(), 'hidden');
+        });
+
+        it('In compact mode, when the \'Volume meter\' option is selected, the volume meter should be displayed in the recorder as well as playback player of the preview tab', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.selectAudioRecorderStyle('Compact');
+            audioResponsePage.steps.selectAudioIndicatorsVolumeMeterButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingCompactPreview();
+            audioResponsePage.steps.waitForRecordingToStartCompactPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.compactPreviewVolumeMeter(), 'visible');
+            audioResponsePage.steps.stopRecordingCompactPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            audioResponsePage.steps.startPlaybackCompactPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.compactPreviewVolumeMeter(), 'visible');
+        });
+
+        it('In compact mode, when the \'Volume meter\' option is deselected, the volume meter should not be displayed in the recorder as well as playback player of the preview tab', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.deselectAudioIndicatorsVolumeMeterButton();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingCompactPreview();
+            audioResponsePage.steps.waitForRecordingToStartCompactPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.compactPreviewVolumeMeter(), 'notExist');
+            audioResponsePage.steps.stopRecordingCompactPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            audioResponsePage.steps.startPlaybackCompactPreview();
+            utilities.verifyElementVisibilityState(audioResponsePage.compactPreviewVolumeMeter(), 'notExist');
+        });
+    });
+
+    describe('Limit number of retake : Preview tab', () => {
+        abortEarlySetup();
+        before(() => {
+            audioResponsePage.steps.navigateToCreateQuestion('audio 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', () => {
+            audioResponsePage.steps.checkLimitNumberOfRetakeCheckbox();
+            audioResponsePage.steps.setRetakeLimit(1);
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingStandardPreview();
+            audioResponsePage.steps.waitForRecordingToStartStandardPreview();
+            audioResponsePage.steps.stopRecordingStandardPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            audioResponsePage.steps.retakeRecordingStandardPreview();
+            audioResponsePage.steps.confirmRetake();
+            utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'notExist');
+            utilities.verifyInnerText(audioResponsePage.recordingStatusText(), 'Recording...');
+            audioResponsePage.steps.waitForRecordingToStartStandardPreview();
+            audioResponsePage.steps.stopRecordingStandardPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementDisabled(audioResponsePage.standardPreviewRetakeButton());
+        });
+
+        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', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.checkShowStudentsTheRetakeLimitsOnTooltipCheckbox();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingStandardPreview();
+            audioResponsePage.steps.waitForRecordingToStartStandardPreview();
+            audioResponsePage.steps.stopRecordingStandardPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            audioResponsePage.standardPreviewRetakeButton()
+                .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', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.clearRetakeLimitInputField();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingStandardPreview();
+            audioResponsePage.steps.waitForRecordingToStartStandardPreview();
+            audioResponsePage.steps.stopRecordingStandardPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            audioResponsePage.steps.retakeRecordingStandardPreview();
+            audioResponsePage.steps.confirmRetake();
+            utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'notExist');
+            utilities.verifyInnerText(audioResponsePage.recordingStatusText(), 'Recording...');
+            audioResponsePage.steps.waitForRecordingToStartStandardPreview();
+            audioResponsePage.steps.stopRecordingStandardPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementNotDisabled(audioResponsePage.standardPreviewRetakeButton());
+        });
+
+        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', () => {
+            audioResponsePage.standardPreviewRetakeButton()
+                .verifyTooltip('Retake recording');
+        });
+
+        it('For "Bar" 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', () => {
+            cy.log('Pre-step: Switching to bar recorder style and unchecking the "Show students the retake limits on tooltip" checkbox')
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.selectAudioRecorderStyle('Bar');
+            audioResponsePage.steps.uncheckShowStudentsTheRetakeLimitsOnTooltipCheckbox();
+            audioResponsePage.steps.setRetakeLimit(1);
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingBarPreview();
+            audioResponsePage.steps.waitForRecordingToStartBarPreview();
+            audioResponsePage.steps.stopRecordingBarPreview();
+            audioResponsePage.steps.retakeRecordingBarPreview();
+            audioResponsePage.steps.confirmRetake();
+            utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'notExist');
+            utilities.verifyInnerText(audioResponsePage.recordingStatusText(), 'Recording...');
+            audioResponsePage.steps.waitForRecordingToStartBarPreview();
+            audioResponsePage.steps.stopRecordingBarPreview();
+            utilities.verifyElementDisabled(audioResponsePage.barPreviewRetakeButton());
+        });
+
+        it('For "Bar" 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', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.checkShowStudentsTheRetakeLimitsOnTooltipCheckbox();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingBarPreview();
+            audioResponsePage.steps.waitForRecordingToStartBarPreview();
+            audioResponsePage.steps.stopRecordingBarPreview();
+            audioResponsePage.barPreviewRetakeButton()
+                .verifyTooltip('Retake recording(1 retakes remaining)');
+        });
+
+        it('For "Bar" mode, When the user removes the retake limit, then the user should be able to retake the recording for n number of times', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.clearRetakeLimitInputField();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingBarPreview();
+            audioResponsePage.steps.waitForRecordingToStartBarPreview();
+            audioResponsePage.steps.stopRecordingBarPreview();
+            audioResponsePage.steps.retakeRecordingBarPreview();
+            audioResponsePage.steps.confirmRetake();
+            utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'notExist');
+            utilities.verifyInnerText(audioResponsePage.recordingStatusText(), 'Recording...');
+            audioResponsePage.steps.waitForRecordingToStartBarPreview();
+            audioResponsePage.steps.stopRecordingBarPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementNotDisabled(audioResponsePage.barPreviewRetakeButton());
+        });
+
+        it('For "Bar" 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', () => {
+            audioResponsePage.barPreviewRetakeButton()
+                .verifyTooltip('Retake recording');
+        });
+
+        it('For "Compact" 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', () => {
+            cy.log('Pre-step: Switching to bar recorder style and unchecking the "Show students the retake limits on tooltip" checkbox')
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.selectAudioRecorderStyle('Compact');
+            audioResponsePage.steps.uncheckShowStudentsTheRetakeLimitsOnTooltipCheckbox();
+            audioResponsePage.steps.setRetakeLimit(1);
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingCompactPreview();
+            audioResponsePage.steps.waitForRecordingToStartCompactPreview();
+            audioResponsePage.steps.stopRecordingCompactPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            audioResponsePage.steps.retakeRecordingCompactPreview();
+            audioResponsePage.steps.confirmRetake();
+            utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'notExist');
+            utilities.verifyInnerText(audioResponsePage.recordingStatusText(), 'Recording...');
+            audioResponsePage.steps.waitForRecordingToStartCompactPreview();
+            audioResponsePage.steps.stopRecordingCompactPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementDisabled(audioResponsePage.compactPreviewRetakeButton());
+        });
+
+        it('For "Compact" 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', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.checkShowStudentsTheRetakeLimitsOnTooltipCheckbox();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingCompactPreview();
+            audioResponsePage.steps.waitForRecordingToStartCompactPreview();
+            audioResponsePage.steps.stopRecordingCompactPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            audioResponsePage.compactPreviewRetakeButton()
+                .verifyTooltip('Retake recording(1 retakes remaining)');
+        });
+
+        it('For "Compact" mode, When the user removes the retake limit, then the user should be able to retake the recording for n number of times', () => {
+            audioResponsePage.steps.switchToEditTab();
+            audioResponsePage.steps.clearRetakeLimitInputField();
+            audioResponsePage.steps.switchToPreviewTab();
+            audioResponsePage.steps.startRecordingCompactPreview();
+            audioResponsePage.steps.waitForRecordingToStartCompactPreview();
+            audioResponsePage.steps.stopRecordingCompactPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            audioResponsePage.steps.retakeRecordingCompactPreview();
+            audioResponsePage.steps.confirmRetake();
+            utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'notExist');
+            utilities.verifyInnerText(audioResponsePage.recordingStatusText(), 'Recording...');
+            audioResponsePage.steps.waitForRecordingToStartCompactPreview();
+            audioResponsePage.steps.stopRecordingCompactPreview();
+            audioResponsePage.steps.verifyResponseIsRecordedHelpText();
+            utilities.verifyElementNotDisabled(audioResponsePage.barPreviewRetakeButton());
+        });
+
+        it('For "Compact" 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', () => {
+            audioResponsePage.barPreviewRetakeButton()
+                .verifyTooltip('Retake recording');
+        });
+    });
+});