Develop Reference

How do i download a file from Website that loaded before clicking

I'm trying to download files from a website but whenever I see Network it makes a request to ..te-guitar.com/tab/download?id={}&session_id= which means it downloading from a file from this URL but it seems like it loaded data with any other URL when the button is clicked then it make another request which doesn't contain any file.
This is website : https://tabs.ultimate-guitar.com/tab/ghost/kaisarion-guitar-pro-4104691
This is how the form of HTML looks like for downloading
<form action="https://tabs.ultimate-guitar.com/tab/download">
<input type="hidden" name="id" value="4104691">
<input type="hidden" name="session_id">
<div class="Z_7o4"><span class="wJEcW">Click the button to download “Kaisarion” Guitar Pro tab</span>
<button type="submit" class="rPQkl yDkT4 IxFbd exTWY lTEpj qOnLe">
<span class="KNVWh _sWeD">DOWNLOAD Guitar Pro TAB</span></button>
</div>
</form>```

Upload file using Selenium opens windows file explorer [duplicate]

I was trying to automate a WordPress post content creation using Selenium Webdriver (Python). Unfortunately, I can not upload files in the post content. I have searched for the solution but most of them used send_keys which is not applicable for WP insert media (see image below). In the insert media, there are two options:
Select files
Drag files
I need a solution which will work for cross-platform (Windows, Linux etc).
I guess there might be a way using some jQuery, JS or something else. I am not very familiar with JS so I did not understand the solutions with JS.
P.S. I am working in Python, so a Python code will be helpful.
Here is the source for the media insert frame in case you need them:
<div class="media-frame-content">
<div class="uploader-inline">
<div class="uploader-inline-content no-upload-message">
<div class="upload-ui">
<h2 class="upload-instructions drop-instructions">Drop files anywhere to upload</h2>
<p class="upload-instructions drop-instructions">or</p>
Select Files
</div>
<div class="upload-inline-status">
<div class="media-uploader-status" style="display: none;">
<h2>Uploading</h2>
<button type="button" class="button-link upload-dismiss-errors"><span class="screen-reader-text">Dismiss Errors</span>
</button>
<div class="media-progress-bar">
<div></div>
</div>
<div class="upload-details">
<span class="upload-count">
<span class="upload-index"></span> / <span class="upload-total"></span>
</span>
<span class="upload-detail-separator">–</span>
<span class="upload-filename"></span>
</div>
<div class="upload-errors"></div>
</div>
</div>
<div class="post-upload-ui">
<p class="max-upload-size">Maximum upload file size: 32 MB.</p>
</div>
</div>
</div>
</div>

Finally, I've got a solution for WP add media file upload.
Actually, I have found that when the file selection window opens upon clicking the select files button, it generates a dynamic input field. Dynamic means, the ID for the input field is unique each time. Fortunately, the first part of the input field's ID remains same. For example, the ID is like html5_1bc7564i41pq5f7m1voce561a0e5. See the HTML below:
<input id="html5_1bc7564i41pq5f7m1voce561a0e5" style="font-size: 999px; opacity: 0; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;" multiple="" accept="" type="file"/>
So, what I did is, create an XPATH using the first part of the ID (html5_) and simply used send_keys and it worked perfectly. My XPATH is like:
input_file = "//input[starts-with(#id,'html5_')]"
The selenium code is:
driver.find_element_by_xpath(input_file).send_keys(file_path)
Here, file_path is the location of the file which I need to upload.
I missed the input field at the first place because it was not visible and did not realize that it is associated with the file upload. So I record the file upload steps with selenium IDE and found the dynamic input ID.
Thanks everyone, for all the suggestions and guidance.

drag and drop is possible:
Python Selenium WebDriver drag-and-drop
you can try move mouse and click "manually":
http://selenium-python.readthedocs.io/api.html#selenium.webdriver.common.action_chains.ActionChains.move_to_element

Here is the solution for you using AutoIT.
WordPress provides a select button to Upload New Media. So let us take help of that functionality.
On clicking "Select Files", File Upload dialog box would open up.
Pass the properties of File Upload dialog box to AutoIT exe.
AutoIT will fill up the filepath area with the selected file.
Now let the WebDriver click on the "Upload" button.
Let me know if this answers your query.

Trying to automate a file upload with chromedriver but type="file" doesn't exist till I click

I apologize in advance if this is to detailed, I really tried my best to make my problem clear.
I need to upload a bunch of jpg files. Unfortunately if I don't automate the process it means days of clicking.
I'm using Python, Jupyter Notebook and chromebrowser to login and navigate through the interface, to where I want to upload the jpg. This is the stuff in my header.
from selenium import webdriver
from selenium.common.exceptions import TimeoutException
import time
import datetime
import csv
import getpass
import os
import win32com.client
import pandas as pd
from selenium.webdriver.common.keys import Keys
Mostly I navigate by using some form of id, class, or xpath
element = driver.find_element_by_xpath("copy_of_the_xpath")
element.send_keys("password")
Or
element = driver.find_element_by_xpath("copy_of_the_xpath")
element.click()
So I navigate to the "selectFileBtn" which allows me to select a jpg for uploading. If I was doing this manually, I'd click this button, it would open a new window so I can select the file I want to. I would then have to click second button to confirm the upload "commitFileBtn"
<div style="float:right;">
<input type="button" name="" value="Select Material" id="selectFileBtn" class="button_basic">
<input type="button" name="" value="Upload" id="commitFileBtn" class="button_basic button_right">
</div>
Now I don't want to click the "selectFileBtn". I just want to give it the file. Normally I would just send the file using.
element = driver.find_element_by_xpath("xpath_to_selectFileBtn")
element.send_keys("file_to_be_uploaded")
But unfortunately "selectFileBtn" is type=button and I need type=file to send something. So I was really lost. Then I realized if I click the button the elements change from
<div style="float:right;">
<input type="button" name="" value="Select Material" id="selectFileBtn" class="button_basic">
<input type="button" name="" value="Upload" id="commitFileBtn" class="button_basic button_right">
</div>
to
<div style="float:right;">
<input type="button" name="" value="Select Material" id="selectFileBtn" class="button_basic">
<input type="file" style="display:none;" multiple="" accept=".jpg">
<input type="button" name="" value="Upload" id="commitFileBtn" class="button_basic button_right">
</div>
And if I then send my file to the xpath
element = driver.find_element_by_xpath('//*[#id="uploadCond"]/div/input[2]')
element.send_keys("file_to_be_uploaded")
of this element
<input type="file" style="display:none;" multiple="" accept=".jpg">
the whole thing works as intended.
Now I have a different problem: I can not make
<input type="file" style="display:none;" multiple="" accept=".jpg">
available through anything but clicking on it. And if I use the command
element.click()
then it takes 60+ seconds to open the window because some javascript black magic is happening and that is unfortunately to long. If I click it manually it almost instantly opens.
So I tried to create the node myself:
def create_material_node():
execu='''
var x = document.createElement("INPUT");
x.setAttribute("type", "file");
x.setAttribute("style", "display:none;");
x.setAttribute("multiple", "");
x.setAttribute("accept", ".jpg");
var element = document.getElementById("uploadCond").getElementsByTagName("div")[0];
element.insertBefore(x, element.children[1]);
'''
browser.execute_script(execu)
And to clone the node I wanted to send to:
def clone_node():
clone='''
var menu = document.getElementById("uploadCond").getElementsByTagName("div")[0].getElementsByTagName("input")[1];
var clonedMenu = menu.cloneNode();
var element = document.getElementById("uploadCond").getElementsByTagName("div")[0];
element.insertBefore(clonedMenu, element.children[1]);
'''
browser.execute_script(clone)
But both the creation and the clone couldn't upload the jpg I sent.
One thing I noticed was that the clone was missing an event listener called "change". I looked at change source panel but it was in Jquery and Javascript and I don't even know were to begin. I'm just stuck at this point. Does anyone know how I can automate uploading these files?
("#selectFileBtn").click(function(){
var extName = "";
if (self.getExtName) {
extName = self.getExtName();
}
$(this).parent().remove("input:file");
$(this).after("<input type='file' style='display:none;' multiple />");
$(this).next("input:file").attr("accept", extName).change(function(evt){
self.doUpload(evt.target);
}).click();
});

Selecting dropdown option from website using Python script for automation

On the website I have to select a specific time duration from the drop down menu as shown in the attached picture. I need to automate it using a Python script. I am having a script in which I need to add this one thing to make the script perfectly customize. Below is some info from the website highlighting the options.
<button id="duration" type="button" class="Blockreact__Block-sc-1xf18x6-0 Buttonreact__StyledButton-sc-glfma3-0 OKxo hJoTEY" aria-expanded="false" style="font-weight: 500; width: 100%;">
<div aria-hidden="true" class="Blockreact__Block-sc-1xf18x6-0 Flexreact__Flex-sc-1twd32i-0 cwzTQS jYqxGr">
<i value="calendar_today" size="24" class="Iconreact__Icon-sc-1gugx8q-0 irnoQt material-icons">calendar_today</i>
</div>
<div class="Overflowreact__OverflowContainer-sc-7qr9y8-0 jPSCbX" tabindex="-1">7 days</div>
</button>
The purpose over here is to change 7 days to 1 month using a Python script.

I believe you should be able to do this with selenium.

Python WebDriver - can not use send_keys to uploading file to site. API will active file selection window

Test scenario：
1. Launch to site (https://app.box.com/files)
2. Login to site, page will redirect to All File page.
3. Click "Upload" button. ---- After click "upload files" and "upload folders" options appeared.
4. Click "upload Files" --- After click it windows file selection window display.
Then Upload files HTML code:
<ul id="ui-id-1" class="ui-menu ui-widget ui-widget-content ui-corner-all" style="position: absolute; top: 34px; left: 0.5px; display: block;" data-type="upload-menu" role="menu" tabindex="0" aria-activedescendant="ui-id-3">
<li class="ui-menu-item" data-type="upload-files-option" role="presentation" style="position: relative;" tabindex="-1">
<a id="ui-id-2" class="ui-corner-all" href="#" tabindex="-1" role="menuitem">Upload Files</a>
</li>
I use following code try to uploading file.
self.driver = webdriver.Firefox()
sDataFile = "D:\\TestData\\Test.txt"
self.driver.find_element_by_xpath("//a[#id='ui-id-2']").send_keys(sDataFile)
When I run this code the file cannot be uploaded successfully, webdriver will activate windows file selection dialog, but file cannot been uploaded. How to solve this problem?

When you are doing the below line make sure you are selecting the input component for send_keys.
self.driver.find_element_by_xpath
i.e. in html you will have a component like below. Make sure using xpath you select below element and then apply send_keys
<input type="file" />