DevExpress / testcafe

A Node.js tool to automate end-to-end web testing.
https://testcafe.io
MIT License
9.82k stars 671 forks source link

Method setFilesToUpload stop working #8162

Closed gnig closed 6 months ago

gnig commented 6 months ago

What is your Scenario?

Hi all, i would like to ask you to help me to solve something strange :)

Method setFilesToUpload sstop working.

I have web application with form where i want to upload file.

<div class="col-md-12" ng-show="attachmentType" style="">
                        <file-upload ng-model="fileArray" accept=".pdf" label="inputLabel" class="ng-pristine ng-untouched ng-valid ng-isolate-scope ng-not-empty"><div class="custom-file">
    <input type="file" class="custom-file-input ng-pristine ng-untouched ng-valid ng-not-empty" lang="cs" accept=".pdf" ng-model="fileArray" ng-change="change()" custom-file-input="">
    <label class="custom-file-label ng-binding" for="customFile">Drag or select file to upload</label>
</div></file-upload></div>

Then iam using next code that will insert specific filename from local storage to this window

const finput = Selector('input[type="file"]')
await t.setFilesToUpload(finput,'myFile.pdf')

And this wokring until upgrading testcafe to 3+ version I have tried every 3* version, but problem persisting.

What is the Current behavior?

Starting from testcafe version 3+ this methond stop working for me. image

What is the Expected behavior?

File shoud be inserting into input field image

What is the public URL of the test page? (attach your complete example)

private web

What is your TestCafe test code?

const finput = Selector('input[type="file"]')
await t.setFilesToUpload(finput,'myFile.pdf')

Your complete configuration file

{
    "browsers": "chrome",
    "cache": true,
    "screenshots": {
        "path": "./src/screenshots/",
        "takeOnFails": true,
        "fullPage": true,
        "pathPattern": "${DATE}_${TIME}/test-${TEST_INDEX}/${USERAGENT}/${FILE_INDEX}.png"
    },
    "speed": 0.8,
    "skipJsErrors": true,
    "assertionTimeout": 20000,
    "selectorTimeout": 30000,
    "pageLoadTimeout": 20000,
    "reporter": [
        {
            "name": "xunit",
            "output": "reports/xunit-report.xml"
        },
        {
            "name": "json",
            "output": "reports/json-report.json"
        }
    ]
}

Your complete test report

empty, no errors at all.

Screenshots

Wrong actual behavior image

And this is how its working before image

Steps to Reproduce

1.const finput = Selector('input[type="file"]') 2.await t.setFilesToUpload(finput,'myFile.pdf')

TestCafe version

3.5.0

Node.js version

v18.14.0

Command-line arguments

testcafe testcafe.test.ts -L

Browser name(s) and version(s)

Chrome Version 123.0.6312.59 (Official Build) (64-bit)

Platform(s) and version(s)

Windows 11 Pro Insider Preview 23620.1000

Other

its does not work in any browsers ihave tried, like edge,firefox,chrome

PavelMor25 commented 6 months ago

Hello @gnig,

I tested your example, and the file is uploaded. To check upload input, I added some uploadInput.value logs to your test:

const finput = Selector('input[type="file"]')
await t.setFilesToUpload(finput,'myFile.pdf')
console.log(await finput.value)

Please refer the following help topic to learn how to observe the state of the input element.

However, to investigate your scenario, we need a more detailed example.

Please let us know your results.

gnig commented 6 months ago

working on way how to show you behavior. gimme time :) before ticket get close

gnig commented 6 months ago

Project folder: C:\Users\username\WebstormProjects\epp-test\ Test file location: C:\Users\username\WebstormProjects\epp-test\src\tests\done Helper file with some script inc. upload file to form: C:\Users\username\WebstormProjects\epp-test\src\helpers PDF file i want to upload (storing in same folder as test file): C:\Users\username\WebstormProjects\epp-test\src\tests\done

Function that trying upload file to form: image

Test output:


 Stavebni sporeni - Dite a Zastupce
 √ Test 1 - check
 × Add document Contract 
   1) Uncaught object

   "{"callsite":{"filename":"C:\\Users\\username\\WebstormProjects\\bt-epp-test\\src\\test-data\\Epp.CommonFunctions.ts","lineNum":710,"callsiteFrameIdx":5,"stackFrames":[{},{},{},{},{},{},{},{},{}],"isV8Frames":true}}"
      was thrown. Throw Error instead.
      Browser: Chrome 123.0.0.0 / Windows 11
1/2 failed (49s)
PavelMor25 commented 6 months ago

I tried to reproduce the issue with the scenario you described, but I couldn't replicate the error. However, we encountered a similar issue previously, which was related to lite-server, which utilizes browser-sync. You can try the solution described in the thread.

If that doesn't work, please share a Minimal Working Example, so that our team can research the issue and help you.

ayemelyanenko-chegg commented 6 months ago

I seem to be running into something similar here

https://github.com/DevExpress/testcafe/issues/8173

github-actions[bot] commented 6 months ago

This issue was automatically closed because there was no response to our request for more information from the original author. Currently, we don't have enough information to take action. Please reach out to us if you find the necessary information and are able to share it. We are also eager to know if you resolved the issue on your own and can share your findings with everyone.