itemengine-cypress-automation 1.0.183 → 1.0.184

package/cypress/pages/audioPlayerPage.js

@@ -1,518 +1,319 @@
-import constants from "../fixtures/constants";
 import utilities from "../support/helpers/utilities";
+import { commonComponents, createQuestionBasePage, playbackControlsBaseComponent } from "./components";
 import { dialogBoxBase } from "./dialogBoxBase";
-import { selectQuestionResourceToolPage } from "./selectQuestionResourceToolPage";
-import { createQuestionBasePage, commonComponents, ckEditorToolbar, equationEditorFlyout, playbackControlsBaseComponent } from "./components"
 
 const selectors = {
-    ...commonComponents,
-    ...ckEditorToolbar,
     ...playbackControlsBaseComponent,
-    addUrlLabel: () => cy.get('[class*="RadioGroupMUI5styles__RadioOptionContainer"] .ngie-radio-label').eq(0),
-    addUrlRadioButton: () => cy.get('.ngie-radio-btn input').eq(0),
-    addAudioFileLabel: () => cy.get('[class*="RadioGroupMUI5styles__RadioOptionContainer"] .ngie-radio-label').eq(1),
-    addAudioFileRadioButton: () => cy.get('.ngie-radio-btn input').eq(1),
-    sourceUrlLabel: () => cy.get('.inline-text-property-label').eq(0),
+    ...commonComponents,
+    ...dialogBoxBase,
+    uploadAudioFileLabel: () => cy.get('[class*="RadioGroupMUI5styles__RadioOptionContainer"] .ngie-radio-label').eq(0),
+    uploadAudioFileRadioButton: () => cy.get('.ngie-radio-btn input').eq(0),
+    addAudioURLLabel: () => cy.get('[class*="RadioGroupMUI5styles__RadioOptionContainer"] .ngie-radio-label').eq(1),
+    addAudioURLRadioButton: () => cy.get('.ngie-radio-btn input').eq(1),
+    uploadAudioFileUploadLabel: () => cy.get('[class*="AudioPlayerstyles__AudioLabel"]').eq(0),
+    uploadAudioFileNameLabel: () => cy.get('[class*="AudioPlayerstyles__AudioLabel"]').eq(1),
+    deleteAudioFileButton: () => cy.get('[aria-label*="Delete audio file]'),
+    sourceUrlLabel: () => cy.get('[class*="AudioPlayerstyles__AudioLabel"]').eq(0),
     sourceUrlInputField: () => cy.get('input[aria-label="Source URL"]'),
-    noFileChosenLabel: () => cy.get('[aria-label="No file chosen"]'),
+    uploadAudioChooseFileButton: () => cy.get('.choose-file-upload-button'),
+    uploadAudioNoFileChosenLabel: () => cy.get('[aria-label="No file chosen"]').eq(0),
     uploadedFileNameLabel: () => cy.get('.selected-file'),
-    uploadLabel: () => cy.get('[class*="AudioPlayerstyles__AudioLabel"]').eq(0),
-    fileNameLabel: () => cy.get('[class*="AudioPlayerstyles__AudioLabel"]').eq(1),
-    chooseFileButton: () => cy.get('.choose-file-button'),
-    fileUploadProgressBar: () => cy.get('[class*="AudioPlayerstyles__ProgressBar-"]'),
+    audioFileUploadProgressBar: () => cy.get('[class*="AudioPlayerstyles__ProgressBar-"]').eq(0),
     inputTypeFile: () => cy.get('input[type="file"]'),
-    playerTypeLabel: () => cy.get('.player-type-dropdown-label'),
-    playerTypeDropdown: () => cy.get('#Player-type-select'),
-    playbackLimitLabel: () => cy.get('.playback-limit-wrapper [class*="Label"]'),
-    playbackLimitInputField: () => cy.get('.playback-limit-wrapper input'),
-    titleLabel: () => cy.get('.inline-text-property-label').last(),
-    titleInputField: () => cy.get('input[aria-label="Title"]'),
-    descriptionLabel: () => cy.get('.additional-settings-label').eq(0),
-    descriptionInputField: () => cy.get('[role="textbox"][title="Description"]'),
-    transcriptLabel: () => cy.get('.additional-settings-label').eq(1),
+    audioPlayerStyleLabel: () => cy.get('.player-style-label'),
+    standardStyleToggleButton: () => cy.get('[data-ngie-testid="standard-toggle-button"]'),
+    barStyleToggleButton: () => cy.get('[data-ngie-testid="bar-toggle-button"]'),
+    compactStyleToggleButton: () => cy.get('[data-ngie-testid="compact-toggle-button"]'),
+    standardStyleToggleButtonLabel: () => cy.get('[data-ngie-testid="standard-toggle-button"] .ngie-toggle-button-label'),
+    barStyleToggleButtonLabel: () => cy.get('[data-ngie-testid="bar-toggle-button"] .ngie-toggle-button-label'),
+    compactStyleToggleButtonLabel: () => cy.get('[data-ngie-testid="compact-toggle-button"] .ngie-toggle-button-label'),
+    compactPlayerOptionsLabel: () => cy.get('.options-label'),
+    defaultPlayerOptionButton: () => cy.get('[data-ngie-testid="default-toggle-button"]'),
+    textPlayerOptionButton: () => cy.get('[data-ngie-testid="text-toggle-button"]'),
+    imagePlayerOptionButton: () => cy.get('[data-ngie-testid="image-toggle-button"]'),
+    iconPlayerOptionButton: () => cy.get('[data-ngie-testid="icon-toggle-button"]'),
+    audioDescriptionInputField: () => cy.get('.description-wrapper [role="textbox"]'),
+    uploadTranscriptFileLabel: () => cy.get('[class*="RadioGroupMUI5styles__RadioOptionContainer"] .ngie-radio-label').eq(2),
+    uploadTranscriptFileRadioButton: () => cy.get('.ngie-radio-btn input').eq(2),
+    typeInTranscriptLabel: () => cy.get('[class*="RadioGroupMUI5styles__RadioOptionContainer"] .ngie-radio-label').eq(3),
+    typeInTranscriptRadioButton: () => cy.get('.ngie-radio-btn input').eq(3),
     transcriptInputField: () => cy.get('[role="textbox"][title="Transcript"]'),
-    customizeUIControlAccordion: () => cy.get('.ngie-accordion-summary[role="button"]').eq(0),
-    advancedPlayerSettingsAccordion: () => cy.get('.ngie-accordion-summary[role="button"]').eq(1),
-    customizeControlPlayButton: () => cy.get('[data-ngie-testid="play-toggle-button"]'),
-    customizeControlButtonLabel: () => cy.get('[data-ngie-testid="play-toggle-button"]').find('.ngie-toggle-button-label'),
-    customizeControlPauseButton: () => cy.get('[data-ngie-testid="pause-toggle-button"]'),
-    customizeControlSeekButton: () => cy.get('[data-ngie-testid="seek-toggle-button"]'),
-    advancedPlayerButtonLabel: () => cy.get('[data-ngie-testid="timer-toggle-button"]').find('.ngie-toggle-button-label'),
-    advancedPlayerTimerButton: () => cy.get('[data-ngie-testid="timer-toggle-button"]'),
-    advancedPlayerProgressBarButton: () => cy.get('[data-ngie-testid="progress-bar-toggle-button"]'),
-    advancedPlayerVolumeControlButton: () => cy.get('[data-ngie-testid="volume-control-toggle-button"]'),
-    allowStudentsToDownloadAudioLabel: () => cy.get('[data-ngie-testid="allow-students-to-download-the-audio-checkbox"] .MuiFormControlLabel-label'),
-    allowStudentsToDownloadAudioCheckbox: () => cy.get('[data-ngie-testid="allow-students-to-download-the-audio-checkbox"] input'),
-    selectedButtonIcon: () => cy.get('.ngie-toggle-button-tick-icon'),
-    accordionChevronIcon: () => cy.get('[class*="expandIcon"]'),
-    accordionButtonLabel: () => cy.get('.customized_button_label'),
-    audioDownloadButton: () => cy.get('.audio-download-icon-wr'),
-    playbackLimitHelpText: () => cy.get('.playback-limit-remaining'),
-    playbackElapsedTime: () => cy.get('.audio-player-current-time'),
-    playbackTotalTime: () => cy.get('.audio-player-duration'),
+    deleteTranscriptButton: () => cy.get('[aria-label*="Delete transcript]'),
+
+    //Preview tab
+    backwardButton: () => cy.get('.forward-backward-buttons-wrapper [aria-label*="Backward"]'),
+    forwardButton: () => cy.get('.forward-backward-buttons-wrapper [aria-label*="Forward"]'),
+    playbackElapsedTime: () => cy.get('.audio-player-current-time').eq(0),
+    playbackTotalTime: () => cy.get('.audio-player-duration').eq(0),
+    addPinButton: () => cy.get('.audio-add-pin-wr button'),
     audioFileSrc: () => cy.get('.audio-player-toolbar audio'),
-    titlePreviewTab: () => cy.get('.audio-resource-title'),
     descriptionPreviewTab: () => cy.get('.audio-resource-preview-wrapper .question-text-wrapper'),
     transcriptTitlePreviewTab: () => cy.get('.transcript-title'),
     transcriptPrintButton: () => cy.get('button[aria-label="Print preview"]'),
     transcriptModalCloseButton: () => cy.get('button[aria-label="Close"]'),
-    transcriptContentPreviewTab: () => cy.get('[class*="Transcriptstyles__TranscriptContent"]'),
+    transcriptContentPreviewTab: () => cy.get('.transcript-content'),
     transcriptButton: () => cy.get('button[aria-label="Transcript"]'),
     transcriptModal: () => cy.get('[class*="Transcriptstyles__TranscriptWrapper"]'),
-    audioDownloadButton: () => cy.get('.audio-download-icon-wr'),
-    playbackLimitHelpText: () => cy.get('.playback-limit-remaining'),
-    playbackPlayer: () => cy.get('.audio-player-toolbar')
+    standardPreviewPlayerWrapper: () => cy.get('.standard-audio-resource-preview'),
+    audioPlayerToolbar: () => cy.get('.audio-player-toolbar'),
+    compactPlayerPlayButton: () => cy.get(' button'),
+    playButton: () => cy.get('.audio-player-not-visible button'),
+    stopButton: () => cy.get('.audio-player-visible button'),
 }
 
 const steps = {
-    ...createQuestionBasePage.steps,
-    ...ckEditorToolbar.steps,
-    ...equationEditorFlyout.steps,
-    ...commonComponents.steps,
     ...playbackControlsBaseComponent.steps,
-    verifyAddUrlCheckedState: () => {
-        audioPlayerPage.addUrlRadioButton()
-            .should('be.checked');
+    ...createQuestionBasePage.steps,
+    ...dialogBoxBase.steps,
+    /**
+    * Uploads a file to the audio player by attaching the file located at the specified filePath.
+    * @param {string} filePath - The file path to the file to be uploaded.
+    * @returns {void}
+    */
+    uploadFile: (filePath) => {
+        audioPlayerPage.inputTypeFile()
+            .attachFile(filePath);
+        utilities.verifyElementVisibilityState(audioPlayerPage.audioFileUploadProgressBar(), 'hidden');
     },
 
-    verifyAddUrlUncheckedState: () => {
-        audioPlayerPage.addUrlRadioButton()
-            .should('not.be.checked');
+    /**
+    * Uploads a file to the audio player by attaching the file located at the specified filePath.
+    * @param {string} filePath - The file path to the file to be uploaded.
+    * @returns {void}
+    */
+    attachFile: (filePath) => {
+        audioPlayerPage.inputTypeFile()
+            .attachFile(filePath);
     },
 
-    clickOnAddUrlRadioButton: () => {
-        audioPlayerPage.addUrlRadioButton()
-            .click();
+    addInputToAudioDescriptionInputField: (text) => {
+        audioPlayerPage.audioDescriptionInputField()
+            .type(text)
+            .should('have.text', text)
+            .blur();
     },
 
-    verifyAddAudioFileCheckedState: () => {
-        audioPlayerPage.addAudioFileRadioButton()
+    selectTypeInTranscriptRadioButton: () => {
+        audioPlayerPage.typeInTranscriptRadioButton()
+            .click()
             .should('be.checked');
     },
 
-    verifyAddAudioFileUncheckedState: () => {
-        audioPlayerPage.addAudioFileRadioButton()
+    enterTextInTranscriptInputField: (text) => {
+        audioPlayerPage.transcriptInputField()
+            .type(text)
+            .should('have.text', text)
+            .blur();
+    },
+
+    verifyUploadAudioFileRadioButtonIsSelected: () => {
+        audioPlayerPage.uploadAudioFileRadioButton()
+            .should('be.checked');
+    },
+
+    verifyUploadAudioFileRadioButtonIsNotSelected: () => {
+        audioPlayerPage.uploadAudioFileRadioButton()
             .should('not.be.checked');
     },
 
-    clickOnAddAudioFileRadioButton: () => {
-        audioPlayerPage.addAudioFileRadioButton()
-            .click();
+    verifyAddAudioURLRadioButtonIsNotSelected: () => {
+        audioPlayerPage.addAudioURLRadioButton()
+            .should('not.be.checked');
     },
 
-    focusInAndFocusOutOfSourceURLInputField: () => {
-        audioPlayerPage.sourceUrlInputField()
+    selectUploadAudioFileRadioButton: () => {
+        audioPlayerPage.uploadAudioFileRadioButton()
             .click()
-            .blur();
+            .should('be.checked');
     },
 
-    /**
-     * Enters text into the source URL input field on the audio player page.
-     * @param {string} text - The text to be entered into the source URL input field.
-     * @returns {void}
-     */
-    enterTextInSourceURLInputField: (text) => {
-        audioPlayerPage.sourceUrlInputField()
-            .type(text, { delay: 0 })
-            .blur();
+    selectAddAudioURLRadioButton: () => {
+        audioPlayerPage.addAudioURLRadioButton()
+            .click()
+            .should('be.checked');
     },
 
-    clearTextInSourceURLInputField: () => {
+    focusInAndFocusOutOfSourceURLInputField: () => {
         audioPlayerPage.sourceUrlInputField()
-            .clear();
+            .click()
+            .blur();
     },
 
     /**
-     * Uploads a file to the audio player by attaching the file located at the specified filePath.
-     * @param {string} filePath - The file path to the file to be uploaded.
-     * @returns {void}
+     * @description Verify audio player style toggle button is selected
+     * @param {string} toggleButton Toggle button label
      */
-    uploadFile: (filePath) => {
-        audioPlayerPage.inputTypeFile()
-            .attachFile(filePath);
-        utilities.verifyElementVisibilityState(audioPlayerPage.fileUploadProgressBar(), 'hidden');
+    verifyAudioPlayerStyleToggleButtonIsSelected: (toggleButton) => {
+        switch (toggleButton) {
+            case 'Standard':
+                audioPlayerPage.standardStyleToggleButton()
+                    .should('have.attr', 'aria-pressed', 'true');
+                break;
+            case 'Bar':
+                audioPlayerPage.barStyleToggleButton()
+                    .should('have.attr', 'aria-pressed', 'true');
+                break;
+            case 'Compact':
+                audioPlayerPage.compactStyleToggleButton()
+                    .should('have.attr', 'aria-pressed', 'true');
+                break;
+            default:
+                throw new Error('Invalid audio player style');
+        }
     },
 
-    verifyPlayerTypeDropdownDisabledState: () => {
-        audioPlayerPage.playerTypeDropdown()
-            .should('have.class', 'Mui-disabled');
+    /**
+     * @description Verify audio player style toggle button is not selected
+     * @param {string} toggleButton Toggle button label
+     */
+    verifyAudioPlayerStyleToggleButtonIsNotSelected: (toggleButton) => {
+        switch (toggleButton) {
+            case 'Standard':
+                audioPlayerPage.standardStyleToggleButton()
+                    .should('have.attr', 'aria-pressed', 'false');
+                break;
+            case 'Bar':
+                audioPlayerPage.barStyleToggleButton()
+                    .should('have.attr', 'aria-pressed', 'false');
+                break;
+            case 'Compact':
+                audioPlayerPage.compactStyleToggleButton()
+                    .should('have.attr', 'aria-pressed', 'false');
+                break;
+            default:
+                throw new Error('Invalid audio player style');
+        }
     },
 
     /**
-     * Sets the playback limit value in the audio player's input field.
-     * @param {string|number} value - The value to set as the playback limit.
-     * @returns {void}
+     * @description Select audio player style toggle button
+     * @param {string} toggleButton Toggle button label
      */
-    setPlaybackLimit: (value) => {
-        audioPlayerPage.playbackLimitInputField()
-            .clear()
-            .type(value)
+    selectAudioPlayerStyleToggleButton: (toggleButton) => {
+        switch (toggleButton) {
+            case 'Standard':
+                audioPlayerPage.standardStyleToggleButton()
+                    .click()
+                    .should('have.attr', 'aria-pressed', 'true');
+                break;
+            case 'Bar':
+                audioPlayerPage.barStyleToggleButton()
+                    .click()
+                    .should('have.attr', 'aria-pressed', 'true');
+                break;
+            case 'Compact':
+                audioPlayerPage.compactStyleToggleButton()
+                    .click()
+                    .should('have.attr', 'aria-pressed', 'true');
+                break;
+            default:
+                throw new Error('Invalid audio player style');
+        }
     },
 
     /**
-     * Verifies that the playback limit input field in the audio player has the expected value.
-     * @param {string|number} value - The expected value to be verified.
-     * @returns {void}
+     * @description Verify compact player option button is selected
+     * @param {string} button button label
      */
-    verifyPlaybackLimitInputFieldValue: (value) => {
-        audioPlayerPage.playbackLimitInputField()
-            .should('have.attr', 'value', value);
+    verifyCompactPlayerOptionButtonIsSelected: (button) => {
+        switch (button) {
+            case 'Default':
+                audioPlayerPage.defaultPlayerOptionButton()
+                    .should('have.attr', 'aria-pressed', 'true');
+                break;
+            case 'Text':
+                audioPlayerPage.textPlayerOptionButton()
+                    .should('have.attr', 'aria-pressed', 'true');
+                break;
+            case 'Image':
+                audioPlayerPage.imagePlayerOptionButton()
+                    .should('have.attr', 'aria-pressed', 'true');
+                break;
+            case 'Icon':
+                audioPlayerPage.iconPlayerOptionButton()
+                    .should('have.attr', 'aria-pressed', 'true');
+                break;
+            default:
+                throw new Error('Invalid compact player option');
+        }
     },
 
-    focusInAndFocusOutOfPlaybackLimitInputField: () => {
-        audioPlayerPage.playbackLimitInputField()
-            .click()
-            .blur();
+    /**
+     * @description Verify compact player option button is not selected
+     * @param {string} button button label
+     */
+    verifyCompactPlayerOptionButtonIsNotSelected: (button) => {
+        switch (button) {
+            case 'Default':
+                audioPlayerPage.defaultPlayerOptionButton()
+                    .should('have.attr', 'aria-pressed', 'false');
+                break;
+            case 'Text':
+                audioPlayerPage.textPlayerOptionButton()
+                    .should('have.attr', 'aria-pressed', 'false');
+                break;
+            case 'Image':
+                audioPlayerPage.imagePlayerOptionButton()
+                    .should('have.attr', 'aria-pressed', 'false');
+                break;
+            case 'Icon':
+                audioPlayerPage.iconPlayerOptionButton()
+                    .should('have.attr', 'aria-pressed', 'false');
+                break;
+            default:
+                throw new Error('Invalid compact player option');
+        }
     },
 
     /**
-     * Enters text into the title input field on the audio player page.
-     * @param {string} text - The text to be entered into the title input field.
-     * @returns {void}
+     * @description Verify compact player option button is selected
+     * @param {string} toggleButton button label
      */
-    enterTextInTitleInputField: (text) => {
-        audioPlayerPage.titleInputField()
-            .type(text, { delay: 0 });
+    selectCompactPlayerOptionButton: (toggleButton) => {
+        switch (button) {
+            case 'Default':
+                audioPlayerPage.defaultPlayerOptionButton()
+                    .click()
+                    .should('have.attr', 'aria-pressed', 'true');
+                break;
+            case 'Text':
+                audioPlayerPage.textPlayerOptionButton()
+                    .click()
+                    .should('have.attr', 'aria-pressed', 'true');
+                break;
+            case 'Image':
+                audioPlayerPage.imagePlayerOptionButton()
+                    .click()
+                    .should('have.attr', 'aria-pressed', 'true');
+                break;
+            case 'Icon':
+                audioPlayerPage.iconPlayerOptionButton()
+                    .click()
+                    .should('have.attr', 'aria-pressed', 'true');
+                break;
+            default:
+                throw new Error('Invalid compact player option');
+        }
     },
 
     /**
-     * Verifies that the title input field in the audio player has the expected text value.
-     * @param {string} value - The expected text value to be verified.
+     * Enters text into the source URL input field on the audio player page.
+     * @param {string} text - The text to be entered into the source URL input field.
      * @returns {void}
      */
-    verifyTextInTitleInputField: (value) => {
-        audioPlayerPage.titleInputField()
-            .should('have.attr', 'value', value)
-    },
-
-    focusInDescriptionInputField: () => {
-        audioPlayerPage.descriptionInputField()
-            .click();
-    },
-
-    enterTextInDescriptionInputField: (text) => {
-        audioPlayerPage.descriptionInputField()
-            .type(text)
+    enterTextInSourceURLInputField: (text) => {
+        audioPlayerPage.sourceUrlInputField()
+            .type(text, { delay: 0 })
             .blur();
     },
 
-    clearDescriptionInputField: () => {
-        audioPlayerPage.descriptionInputField()
+    clearTextInSourceURLInputField: () => {
+        audioPlayerPage.sourceUrlInputField()
             .clear();
     },
 
-    verifyImageAndAltTextInDescriptionInputField: () => {
-        audioPlayerPage.descriptionInputField()
-            .find('img')
-            .should('have.attr', 'src', constants.foxImageLink)
-            .and('have.attr', 'alt', constants.foxImageAltText);
-    },
-
-    verifyImageAndAltTextInDescriptionPreviewTab: () => {
-        audioPlayerPage.descriptionPreviewTab()
-            .find('img')
-            .should('have.attr', 'src', constants.foxImageLink)
-            .and('have.attr', 'alt', constants.foxImageAltText);
-    },
-
-    verifyEquationInDescriptionInputField: () => {
-        audioPlayerPage.descriptionInputField()
-            .find('[data-widget="ngie_equation"]')
-            .should('have.attr', 'aria-label', constants.CKEditorInputFieldEnteredEquationAriaLabel)
-            .contains(constants.CKEditorInputFieldEnteredEquationText);
-    },
-
-    verifyEquationInDescriptionPreviewTab: () => {
-        audioPlayerPage.descriptionPreviewTab()
-            .find('[role="math"]')
-            .should('have.attr', 'aria-label', constants.CKEditorInputFieldEnteredEquationAriaLabel)
-            .contains(constants.CKEditorInputFieldEnteredEquationText);
-    },
-
-    verifyLinkInDescriptionInputField: () => {
-        audioPlayerPage.descriptionInputField()
-            .find('a')
-            .should('have.text', 'lorem')
-            .and('have.attr', 'href', `${Cypress.config().baseUrl}`);
-    },
-
-    verifyLinkInDescriptionPreviewTab: () => {
-        audioPlayerPage.descriptionPreviewTab()
-            .find('a')
-            .should('have.text', 'lorem')
-            .and('have.attr', 'href', `${Cypress.config().baseUrl}`);
-    },
-
-    verifyBoldTextInDescriptionInputField: () => {
-        audioPlayerPage.descriptionInputField()
-            .find('strong')
-            .should('exist')
-            .should('have.text', '​​​​​​​This is a bold text in description input field');
-    },
-
-    verifyBoldTextInDescriptionPreviewTab: () => {
-        audioPlayerPage.descriptionPreviewTab()
-            .find('strong')
-            .should('exist')
-            .should('have.text', 'This is a bold text in description');
-    },
-
-    focusInTranscriptInputField: () => {
-        audioPlayerPage.transcriptInputField()
-            .click();
-    },
-
-    enterTextInTranscriptInputField: (text) => {
-        audioPlayerPage.transcriptInputField()
-            .type(text)
-            .blur();
-    },
-
-    clearTranscriptInputField: () => {
-        audioPlayerPage.transcriptInputField()
-            .clear();
-    },
-
-    verifyImageAndAltTextInTranscriptInputField: () => {
-        audioPlayerPage.transcriptInputField()
-            .find('img')
-            .should('have.attr', 'src', constants.foxImageLink)
-            .and('have.attr', 'alt', constants.foxImageAltText);
-    },
-
-    verifyImageAndAltTextInTranscriptPreviewTab: () => {
-        audioPlayerPage.transcriptContentPreviewTab()
-            .find('img')
-            .should('have.attr', 'src', constants.foxImageLink)
-            .and('have.attr', 'alt', constants.foxImageAltText);
-    },
-
-    verifyEquationInTranscriptInputField: () => {
-        audioPlayerPage.transcriptInputField()
-            .find('[data-widget="ngie_equation"]')
-            .should('have.attr', 'aria-label', constants.CKEditorInputFieldEnteredEquationAriaLabel)
-            .contains(constants.CKEditorInputFieldEnteredEquationText);
-    },
-
-    verifyEquationInTranscriptPreviewTab: () => {
-        audioPlayerPage.transcriptContentPreviewTab()
-            .find('[role="math"]')
-            .should('have.attr', 'aria-label', constants.CKEditorInputFieldEnteredEquationAriaLabel)
-            .contains(constants.CKEditorInputFieldEnteredEquationText);
-    },
-
-    verifyLinkInTranscriptInputField: () => {
-        audioPlayerPage.transcriptInputField()
-            .find('a')
-            .should('have.text', 'lorem')
-            .and('have.attr', 'href', `${Cypress.config().baseUrl}`);
-    },
-
-    verifyLinkInTranscriptPreviewTab: () => {
-        audioPlayerPage.transcriptContentPreviewTab()
-            .find('a')
-            .should('have.text', 'lorem')
-            .and('have.attr', 'href', `${Cypress.config().baseUrl}`);
-    },
-
-    verifyBoldTextInTranscriptInputField: () => {
-        audioPlayerPage.transcriptInputField()
-            .find('strong')
-            .should('exist')
-            .should('have.text', '​​​​​​​This is a bold text in transcript input field');
-    },
-
-    verifyBoldTextInTranscriptPreviewTab: () => {
-        audioPlayerPage.transcriptContentPreviewTab()
-            .find('strong')
-            .should('exist')
-            .should('have.text', 'This is a bold text in transcript');
-    },
-
-    verifyCustomizeUIControlAccordionChevronIcon: () => {
-        audioPlayerPage.customizeUIControlAccordion()
-            .within(() => {
-                audioPlayerPage.accordionChevronIcon()
-                    .should('be.visible');
-            });
-    },
-
-    verifyAdvancedPlayerAccordionChevronIcon: () => {
-        audioPlayerPage.advancedPlayerSettingsAccordion()
-            .within(() => {
-                audioPlayerPage.accordionChevronIcon()
-                    .should('be.visible');
-            });
-    },
-
-    verifyCustomizeUIControlAccordionCollapsedState: () => {
-        audioPlayerPage.customizeUIControlAccordion()
-            .should('have.attr', 'aria-expanded', 'false');
-    },
-
-    verifyCustomizeUIControlAccordionExpandedState: () => {
-        audioPlayerPage.customizeUIControlAccordion()
-            .should('have.attr', 'aria-expanded', 'true');
-    },
-
-    clickOnCustomizeUIControlAccordion: () => {
-        audioPlayerPage.customizeUIControlAccordion()
-            .click();
-    },
-
-    verifyAdvancedPlayerSettingsAccordionCollapsedState: () => {
-        audioPlayerPage.advancedPlayerSettingsAccordion()
-            .should('have.attr', 'aria-expanded', 'false');
-    },
-
-    verifyAdvancedPlayerSettingsAccordionExpandedState: () => {
-        audioPlayerPage.advancedPlayerSettingsAccordion()
-            .should('have.attr', 'aria-expanded', 'true');
-    },
-
-    clickOnAdvancedPlayerSettingsAccordion: () => {
-        audioPlayerPage.advancedPlayerSettingsAccordion()
-            .click();
-    },
-
-    verifyCustomizeControlPlayButtonSelectedState: () => {
-        audioPlayerPage.customizeControlPlayButton()
-            .should('have.class', 'ngie-toggle-button-selected')
-            .within(() => {
-                utilities.verifyElementVisibilityState(audioPlayerPage.selectedButtonIcon(), 'visible');
-            });
-    },
-
-    verifyCustomizeControlPauseButtonSelectedState: () => {
-        audioPlayerPage.customizeControlPauseButton()
-            .should('have.class', 'ngie-toggle-button-selected')
-            .within(() => {
-                utilities.verifyElementVisibilityState(audioPlayerPage.selectedButtonIcon(), 'visible');
-            });
-    },
-
-    verifyCustomizeControlSeekButtonSelectedState: () => {
-        audioPlayerPage.customizeControlSeekButton()
-            .should('have.class', 'ngie-toggle-button-selected')
-            .within(() => {
-                utilities.verifyElementVisibilityState(audioPlayerPage.selectedButtonIcon(), 'visible');
-            });
-    },
-
-    verifyCustomizeControlPlayButtonDeselectedState: () => {
-        audioPlayerPage.customizeControlPlayButton()
-            .should('have.class', 'ngie-toggle-button-not-selected')
-            .within(() => {
-                utilities.verifyElementVisibilityState(audioPlayerPage.selectedButtonIcon(), 'hidden');
-            });
-    },
-
-    verifyCustomizeControlPauseButtonDeselectedState: () => {
-        audioPlayerPage.customizeControlPauseButton()
-            .should('have.class', 'ngie-toggle-button-not-selected')
-            .within(() => {
-                utilities.verifyElementVisibilityState(audioPlayerPage.selectedButtonIcon(), 'hidden');
-            });
-    },
-
-    verifyCustomizeControlSeekButtonDeselectedState: () => {
-        audioPlayerPage.customizeControlSeekButton()
-            .should('have.class', 'ngie-toggle-button-not-selected')
-            .within(() => {
-                utilities.verifyElementVisibilityState(audioPlayerPage.selectedButtonIcon(), 'hidden');
-            });
-    },
-
-    clickOnCustomizeControlPlayButton: () => {
-        audioPlayerPage.customizeControlPlayButton()
-            .click();
-    },
-
-    clickOnCustomizeControlPauseButton: () => {
-        audioPlayerPage.customizeControlPauseButton()
-            .click();
-    },
-
-    clickOnCustomizeControlSeekButton: () => {
-        audioPlayerPage.customizeControlSeekButton()
-            .click();
-    },
-
-    verifyAdvancedPlayerTimerButtonSelectedState: () => {
-        audioPlayerPage.advancedPlayerTimerButton()
-            .should('have.class', 'ngie-toggle-button-selected')
-            .within(() => {
-                utilities.verifyElementVisibilityState(audioPlayerPage.selectedButtonIcon(), 'visible');
-            });
-    },
-
-    verifyAdvancedPlayerProgressBarButtonSelectedState: () => {
-        audioPlayerPage.advancedPlayerProgressBarButton()
-            .should('have.class', 'ngie-toggle-button-selected')
-            .within(() => {
-                utilities.verifyElementVisibilityState(audioPlayerPage.selectedButtonIcon(), 'visible');
-            });
-    },
-
-    verifyAdvancedPlayerVolumeControlButtonSelectedState: () => {
-        audioPlayerPage.advancedPlayerVolumeControlButton()
-            .should('have.class', 'ngie-toggle-button-selected')
-            .within(() => {
-                utilities.verifyElementVisibilityState(audioPlayerPage.selectedButtonIcon(), 'visible');
-            });
-    },
-
-    verifyAdvancedPlayerTimerButtonDeselectedState: () => {
-        audioPlayerPage.advancedPlayerTimerButton()
-            .should('have.class', 'ngie-toggle-button-not-selected')
-            .within(() => {
-                utilities.verifyElementVisibilityState(audioPlayerPage.selectedButtonIcon(), 'hidden');
-            });
-    },
-
-    verifyAdvancedPlayerProgressBarButtonDeselectedState: () => {
-        audioPlayerPage.advancedPlayerProgressBarButton()
-            .should('have.class', 'ngie-toggle-button-not-selected')
-            .within(() => {
-                utilities.verifyElementVisibilityState(audioPlayerPage.selectedButtonIcon(), 'hidden');
-            });
-    },
-
-    verifyAdvancedPlayerVolumeControlButtonDeselectedState: () => {
-        audioPlayerPage.advancedPlayerVolumeControlButton()
-            .should('have.class', 'ngie-toggle-button-not-selected')
-            .within(() => {
-                utilities.verifyElementVisibilityState(audioPlayerPage.selectedButtonIcon(), 'hidden');
-            });
-    },
-
-    clickOnAdvancedPlayerTimerButton: () => {
-        audioPlayerPage.advancedPlayerTimerButton()
-            .click();
-    },
-
-    clickOnAdvancedPlayerProgressBarButton: () => {
-        audioPlayerPage.advancedPlayerProgressBarButton()
-            .click();
-    },
-
-    clickOnAdvancedPlayerVolumeControlButton: () => {
-        audioPlayerPage.advancedPlayerVolumeControlButton()
-            .click();
-    },
-
-    verifyAllowStudentsToDownloadAudioCheckboxNotChecked: () => {
-        audioPlayerPage.allowStudentsToDownloadAudioCheckbox()
-            .should('not.be.checked');
-    },
-
-    verifyAllowStudentsToDownloadAudioCheckboxChecked: () => {
-        audioPlayerPage.allowStudentsToDownloadAudioCheckbox()
-            .should('be.checked');
-    },
-
-    checkUncheckAllowStudentsToDownloadAudioCheckbox: () => {
-        audioPlayerPage.allowStudentsToDownloadAudioCheckbox()
+    deleteAudioFile: () => {
+        audioPlayerPage.deleteAudioFileButton()
             .click();
     },
 
@@ -523,18 +324,25 @@ const steps = {
             .should('have.text', '00:01');
     },
 
+    waitForAudioFileSrcToLoad: () => {
+        audioPlayerPage.audioFileSrc()
+            .should('have.attr', 'src')
+            .and('not.be.empty');
+    },
+
+
     /**
-     * Verifies the audio playback timer on the audio player.
-     * @param {string} time - The elapsed time and total time in the format "elapsed/total."
-     * @returns {void}
-     */
+    * Verifies the audio playback timer on the audio player.
+    * @param {string} time - The elapsed time and total time in the format "elapsed/total."
+    * @returns {void}
+    */
     verifyAudioPlaybackTimer: (time) => {
         const elapsedTime = time.split('/')[0];
         const totalTime = time.split('/')[1];
         audioPlayerPage.playbackElapsedTime()
             .should('have.text', elapsedTime)
         audioPlayerPage.playbackTotalTime()
-            .should('have.text', `/${totalTime}`)
+            .should('have.text', totalTime)
     },
 
     /**
@@ -551,74 +359,36 @@ const steps = {
             .click();
     },
 
-    closeTranscriptModal: () => {
-        audioPlayerPage.transcriptModalCloseButton()
+
+    clickOnBackwardButton: () => {
+        audioPlayerPage.backwardButton()
             .click();
     },
 
-    focusAwayFromElement: () => {
-        cy.get('body')
-            .click({ position: 'topLeft' });
+    clickOnForwardButton: () => {
+        audioPlayerPage.forwardButton()
+            .click();
     },
 
-    verifyWindowOpenMethodAfterClickingOnDownloadAudioButton: () => {
-        cy.window()
-            .then((win) => {
-                cy.stub(win, 'open')
-                    .as('windowOpen')
-            });
-        audioPlayerPage.audioDownloadButton()
+    clickOnPlayButton: () => {
+        utilities.verifyElementVisibilityState(audioPlayerPage.playButton(), 'visible'); //Added to counter error occurrence when switching to preview tab and clinking on play button 
+        audioPlayerPage.playButton()
             .click();
-        cy.get('@windowOpen')
-            .should('be.calledWith', '');
     },
 
-    waitForAudioFileSrcToLoad: () => {
-        audioPlayerPage.audioFileSrc()
-            .should('have.attr', 'src')
-            .and('not.be.empty');
+    clickOnStopButton: () => {
+        audioPlayerPage.stopButton()
+            .click();
+    },
+
+    verifyUnmutedVolumeIconIsDisplayedInPreviewTab: () => {
+        utilities.verifyElementVisibilityState(audioPlayerPage.unmutedVolumeIcon(), 'visible');
     }
 }
 
 const tests = {
-    ...createQuestionBasePage.tests,
     ...commonComponents.tests,
-    //Header section
-    verifyCancelButton: () => {
-        it('When user has made no edits and clicks on Cancel button, the user should be directed back to the \'Select a Question\' page', () => {
-            createQuestionBasePage.cancelButton()
-                .click();
-            utilities.verifyElementVisibilityState(selectQuestionResourceToolPage.selectAQuestionHeaderText(), 'visible');
-            utilities.verifyElementVisibilityState(selectQuestionResourceToolPage.questionTypeOptionTitle(), 'visible');
-        });
-
-        it('When user has made some edits/changes and clicks on Cancel button, a popup should be displayed', () => {
-            selectQuestionResourceToolPage.steps.selectResourceType('Audio Player');
-            audioPlayerPage.steps.setPlaybackLimit('5');
-            createQuestionBasePage.cancelButton()
-                .click();
-            utilities.verifyElementVisibilityState(dialogBoxBase.dialogBox(), 'visible')
-        });
-
-        dialogBoxBase.tests.verifyContentsOfLeavePagePopupWithCSSAnda11y();
-
-        it(`Clicking on \'No, I'd like to go back\' button should close the popup and user should remain on the edit interface of the question`, () => {
-            dialogBoxBase.buttonReject()
-                .click();
-            createQuestionBasePage.editTab()
-                .should('have.attr', 'aria-selected', 'true')
-            audioPlayerPage.steps.verifyPlaybackLimitInputFieldValue('5');
-        });
-
-        it(`Clicking on \'Yes, I want to leave this page\' button should discard all changes and direct the user to the \'Select a question\' page.`, () => {
-            createQuestionBasePage.cancelButton()
-                .click();
-            dialogBoxBase.buttonAccept()
-                .click();
-            utilities.verifyElementVisibilityState(selectQuestionResourceToolPage.selectAQuestionHeaderText(), 'visible');
-            utilities.verifyElementVisibilityState(selectQuestionResourceToolPage.questionTypeOptionTitle(), 'visible');
-        });
-    },
+    ...playbackControlsBaseComponent.tests,
 }
 
 export const audioPlayerPage = {