Cypress selectFile does not work for .wav files

Question

I am writing a Cypress test to check if uploaded .mp3 and .wav files correctly show up in the UI. I am using the selectFile api to simulate uploading files to the browser.

In the test below, the .mp3 test passes, but the .wav test fails at .contains because the .wav file is not found in the UI after selectFile runs.

  context('Upload tos UI', () => {
    it('upload audio.mp3', () => {
      cy.getByTestId('upload-button').eq(0).selectFile('cypress/fixtures/audio.mp3', { force: true });
      cy.getByTestId('uploaded-file-list').contains('audio.mp3');
    });
    it('upload audio.wav', () => {
      cy.getByTestId('upload-button').eq(0).selectFile('cypress/fixtures/audio.wav', { force: true });
      cy.getByTestId('uploaded-file-list').contains('audio.wav');
    });
  });

There is an open github issue about how when a .wav file is uploaded using selectFile(), the file.type attached to the file is 'audio/wave' when the correct type is 'audio/wav'.

Is this cypress issue the reason for why my .wav test fails? Has anyone else experienced this?

Answer 1

The mimeType was the issue. To resolve it, add the correct 'audio/wav' mimeType like so

cy.getByTestId('upload-button').eq(0).selectFile({ contents: 'cypress/fixtures/audio.wav', mimeType: 'audio/wav' }, { force: true });