Cypress-file-upload: Unable to Upload Photos

[akashtippa123]

i tried to upload photos with this code

it('upload', function() {
const yourFixturePath = 'cypressfixtureshd4.jpg';
cy.get('.upload-button').attachFile(yourFixturePath);
}

it is not working with the above code, I tried an alternative way

cy.fixture('hd4').then((fileContent) => {
cy.get('.upload-button').attachFile({
fileContent: fileContent.toString(),
fileName: 'hd4',
mimeType: 'image/jpg'
})
})

if I try this above code, but the file is present in the cypressfixtureshd4.jpg I received this error
please advise if anything wrong

[Buthrakaur]

@akashtippa123 did you try to use the path without cypress/fixtures prefix? I think cypress automatically uses this path so you should provide just file name:

it('upload', function() {
  const yourFixturePath = 'hd4.jpg';
  cy.get('.upload-button').attachFile(yourFixturePath);
}

[akashtippa123]

yes I tried without the cypress/fixtures prefix, it is not working

[mariuspatrick]

I also have the same problem, only it's not giving me any errors. Does anyone have a fix for this?
Two weeks when I tried it, it was working.

[abramenal]

It accepts the filename of a file placed in fixtures folder that you want to upload.
So in case you have your test.png file put into cypress/fixtures, what you should provide into the command is just test.png.

[mariuspatrick]

I added the .jpg in the fixtures folder. Then I assign it to a const in my test file, after which I call the .attachFile(variableName)

For some reason, it's not adding the file to the website

[abramenal]

@mariuspatrick is there any error log in console or cypress ui?
Which setup you're using (framework, library for file uploader, library version, etc.)?

[mariuspatrick]

I am using the latest file-uploader version, 4.1.1

There is no error in the cypress ui. The test passes as long as I don't make any assertions to check whether the image is on page, which is strange

[mariuspatrick]

The problem was I was using a cypress recorder and it was selecting the button div, but I needed the input field to upload the file. I used inspect element to find the input field, I selected it and it worked.

[akashtippa123]

I also inspected input field, and trying to upload image it's not uploaded
for me, I didn't given any error

On Mon, 28 Sep, 2020, 9:02 pm mariuspatrick, [e-mail]
wrote:

The problem was I was using a cypress recorder and it was selecting the
button div, but I needed the input field to upload the file. I used inspect
element to find the input field, I selected it and it worked.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/abramenal/cypress-file-upload/issues/233#issuecomment-700091978,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/AOY2SKF62OXCQHQCPGSUIFLSICUAXANCNFSM4RPY6MQQ
.

[akashtippa123]

Can you tell me in detail how it works for you

On Mon, 28 Sep, 2020, 9:46 pm Akash Tippa, [e-mail]
wrote:

I also inspected input field, and trying to upload image it's not uploaded
for me, I didn't given any error

On Mon, 28 Sep, 2020, 9:02 pm mariuspatrick, [e-mail]
wrote:

The problem was I was using a cypress recorder and it was selecting the
button div, but I needed the input field to upload the file. I used inspect
element to find the input field, I selected it and it worked.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/abramenal/cypress-file-upload/issues/233#issuecomment-700091978,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/AOY2SKF62OXCQHQCPGSUIFLSICUAXANCNFSM4RPY6MQQ
.

[akashtippa123]

@mariuspatrick please help me how did you resolve this issue, I am also trying to resolve this from long day

[mariuspatrick]

I will try to explain this in detail, not sure if it will help solve your issue as well

First, I inspected the button element using inspect element in chrome dev tools. My button was inside a div, composed of 2 other elements. One of them was another div and the 2nd element was the actual input data element. I just had to use the 2nd element's selector, which was the input data element, and then it worked.

[akashtippa123]

is your input data element is disabled or enabled?
my file upload is like this(input data field is disabled)

[MohmedEmad]

@akashtippa123 it's fixed with me by selecting the right input selector from the page, that is it

Thanks @mariuspatrick for your last comment

[debbyzang]

I try to upload files, but it doesn't work. I tried three ways, none is work for me . And I attach the expect result and the actual result

"cypress": "^6.2.0"
chrome:87.0.4280.88（正式版本） （64 位）