How to upload file if element is <label> tagname?

问题

Here is HTML code:

<px-upload-zone class="dz-clickable" _ngcontent-c34="" _nghost-c35="">
<div class="upload-container" _ngcontent-c35="">
<!---->
<div class="dialog-wrapper dz-default dz-message" _ngcontent-c34="">
<span _ngcontent-c34="">Drag & Drop</span>
<span class="browse-label" _ngcontent-c34="">
<span _ngcontent-c34="">or</span>
<label class="link-label" _ngcontent-c34="">browse</label>
</span>
</div>
<div class="upload-summary" _ngcontent-c35="">
<div class="dropzone-previews" _ngcontent-c35="">
</div>
</px-upload-zone>

You can see in image detail: How to handle Upload function if element is not "input" tagname?

---

CURRENT SOLUTION:

The element input[type="file"] is hidden behind screen and you can sendkeys to this element (work for upload one or multi-file). This is my code:

Page Object:
    uploadDocument(fileName: string) {
    fileName = '../resources/' + fileName;
    const absolutePath = resolve(__dirname, fileName);
    this.sendKeyToElement(this.uploadPage.INPUT_FILE_UPLOAD, absolutePath);
    browser.sleep(2000);
}

Step Definition:
When(/^Upload document with file name$/, (table: TableDefinition) => {
    for (const file of table.rows()) {
        uploadPage.uploadDocument(file);
    }
});

Feature:
And Upload document with file name
        |Filename       |
        |Invoice 01.pdf |
        |Invoice 02.pdf |
        |Invoice 03.pdf |
        |Invoice 04.pdf |
        |Invoice 05.pdf |

回答1:

When you click on it if u get any desktop popup like this:-

sample of desktop window

Then you can use autoit to do operations on it(desktop window). Refer the below link

https://www.npmjs.com/package/autoit

The process is :-

1. Install auto it in your application.
2. Download auto it finder tool(https://www.autoitscript.com/site/autoit/downloads/) and get the elements.
3. Write a script and execute where required.

Example of code:-

var au = require('autoit');

au.Init();
au.WinWait("[Title:Open]");
au.ControlFocus("Open", "", "Edit1");
au.ControlSetText("Open", "", "Edit1", absolutePath); 
au.Sleep(1000);
au.ControlClick("Open", "", "Button1");

回答2:

You can find an input[type="file"] element hidden behind screen and when you drag and drop a file or upload the file it would internally set the value to the hidden input[type="file"] element. You can unhide the input element and then use the sendKeys to upload the file. I have faced similar issue before.

来源：https://stackoverflow.com/questions/47013345/how-to-upload-file-if-element-is-label-tagname