I have been attempting to upload a png file using Cypress and here is what I have tried so far:
Cypress.Commands.add('upload_image', (fileName, selector) => {
return cy.get(selector).then(subject => {
return cy.fixture(fileName, 'base64')
.then(Cypress.Blob.base64StringToBlob)
.then(blob => {
const el = subject[0]
const testFile = new File([blob], fileName, { type: 'image/png' })
const dataTransfer = new DataTransfer()
dataTransfer.items.add(testFile)
el.files = dataTransfer.files
return subject;
})
})
})
When calling this in my test as shown below:
cy.upload_image("logo.png", ".jss378");
No errors are thrown, but unfortunately nothing gets uploaded. It's worth noting that the selector (.jss378) is dynamic, and I am seeking a non-dynamic solution.
Below is an extract of my HTML code: view image description here