How do I upload an image from another directory of my project on web site with Selenium - Python?

Question

I need to upload an image on web site, and I wanna store the image in my project in a separate directory "image", so everyone can run my test and upload image with no path issues.

here's html code of uploading form:

<form id="imageUploadForm" class="ant-form ant-form-horizontal image-upload-form">
<div class="ant-row ant-form-item">
<div class="ant-col ant-form-item-label ant-col-xs-24 ant-col-sm-4">
<label class="" title="Image list">Image list</label>
</div>
<div class="ant-col ant-form-item-control-wrapper ant-col-xs-24 ant-col-sm-16">
<div class="ant-form-item-control">
<span class="ant-form-item-children">
<div class="images-list">
<div class="images-list__upload-btn">
<span class="">
<div class="ant-upload ant-upload-select ant-upload-select-text">
<span tabindex="0" class="ant-upload" role="button">
<input id="image" type="file" accept="" style="display: none;">
<button type="button" class="ant-btn image-upload__btn">
<i aria-label="icon: plus" class="anticon anticon-plus">
<svg viewBox="64 64 896 896" class="" data-icon="plus" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false">

as for uploading form : there's no input field on a site, u can choose a file only via a system window.

here's my code:

import os

image_upload = wd.find_element_by_xpath("//*[@id='imageUploadForm']/div[1]/div[2]/div/span/div/div[1]/span/div")

// tap on a button which opens a system window
 image_upload.click()

//trying to send path to a file which stored in my project
image_upload.send_keys(os.getcwd().replace("fixture", "") + "images/variant_1.png")

obviously, does not work. Also read smth about interaction with "input file", but didn't get how to apply.

Any ideas? Thanks in advance!

Answer 1

Hi from your snapshot there is an input tag with id="image". try sending the path of your image you are willing to upload using sendtext and click on submit it will work.

the code should be as follows:

xpath ="//*[@id=\\"image\\"]; driver.FindElement(By.XPath(xpath)).SendKeys("Your image path");

then perform click event on the upload button and it will work

Answer 2

first there is an input element which you send key to instead of an form element. Then try not click to input element because it will trigger click event and open os file detector which selenium could not handle.

image_upload_input = wd.find_element_by_xpath("//*[@id='image']")
image_upload.send_keys(os.getcwd().replace("fixture", "") + "images/variant_1.png")

If somehow send key still trigger opening os file detector, you need to override this by file_detector in selenium:

from selenium.webdriver.remote.file_detector import UselessFileDetector
wd.file_detector = UselessFileDetector()

In nutshell, whole code will be:

from selenium.webdriver.remote.file_detector import UselessFileDetector
wd.file_detector = UselessFileDetector()
image_upload_input = wd.find_element_by_xpath("//*[@id='image']")
image_upload.send_keys(os.getcwd().replace("fixture", "") + "images/variant_1.png")