Cypress file upload (image/jpeg)

Question

I am trying to upload a jpeg file in cypress. I am not that familiar with how this is done.

I have the following code:

cy.fixture(filename).then(fileContent =>
 {
cy.get('#file').upload({ fileContent, filename, mimeType: 'image/JPEG', })
     { subjectType: 'input' }
    })

This is the error I am getting:

One or more field is invalid within given file(s). Please look into docs to find supported "fileOrArray" values

Answer 1

I guess you're using this plug cypress-file-upload for uploading. Here is its api contract

interface FileData {
    fileContent: string;
    fileName: string;
    mimeType: string;
    encoding?: Cypress.Encodings;
  }
    upload(fileOrArray: FileData | FileData[], processingOpts?: FileProcessingOptions): Chainable<Subject>;

You made a typo that it should be fileName, not filename.

Answer 2

Upload image via cypress-file-upload works fine. Just convert the image into Blob.

const fileName= 'logo.jpeg'
        cy.fixture('logo.jpeg')
        .then(Cypress.Blob.base64StringToBlob)
        .then((fileContent) => {
        cy.get('#new_ad > div:nth-child(19) > div').attachFile(
          {fileContent, fileName, mimeType: 'image/**'},{subjectType: 'drag-n-drop'})
        })