lang2
lang2

Reputation: 11966

selenium webdriver: upload file by drag and drop

On a web page I'm trying to test, we implemented drag and drop file upload. I've looked at the drag and drop API for selenium action chain API. It looks like it supports only dragging and dropping between 2 elements on a page. How to emulate dragging from a file manager?

Upvotes: 1

Views: 4653

Answers (4)

Florent B.
Florent B.

Reputation: 42518

To perform an HTML5 file drop with Selenium:

static final String JS_DROP_FILE =
    "var tgt=arguments[0],e=document.createElement('input');e.type='" +
    "file';e.addEventListener('change',function(event){var dataTrans" +
    "fer={dropEffect:'',effectAllowed:'all',files:e.files,items:{},t" +
    "ypes:[],setData:function(format,data){},getData:function(format" +
    "){}};var emit=function(event,target){var evt=document.createEve" +
    "nt('Event');evt.initEvent(event,true,false);evt.dataTransfer=da" +
    "taTransfer;target.dispatchEvent(evt);};emit('dragenter',tgt);em" +
    "it('dragover',tgt);emit('drop',tgt);document.body.removeChild(e" +
    ");},false);document.body.appendChild(e);return e;";

WebDriver driver = new FirefoxDriver();
driver.get("http://html5demos.com/file-api");

WebElement drop_area = driver.findElement(By.id("holder"));

JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript(JS_DROP_FILE, new Object[] {
        drop_area
    }).sendKeys("C:\\image.png");

Upvotes: 4

parishodak
parishodak

Reputation: 4666

Use AWT Robot class for performing drag and drop:

Robot robot=new Robot();
// drag
robot.mouseMove(x1, y1);
robot.mousePress(InputEvent.BUTTON1_MASK);
// drop
robot.mouseMove(x2, y2);
robot.mouseRelease(InputEvent.BUTTON1_MASK);

Upvotes: 0

Norayr Sargsyan
Norayr Sargsyan

Reputation: 1868

Drop file using jsExecutor

public void dropFile(File filePath, WebElement target) {
    if (!filePath.exists())
        throw new WebDriverException("File not found: " + filePath.toString());

    JavascriptExecutor jse = (JavascriptExecutor) getDriver();

    String JS_DROP_FILE =
        "var target = arguments[0]," +
        "    offsetX = arguments[1]," +
        "    offsetY = arguments[2]," +
        "    document = target.ownerDocument || document," +
        "    window = document.defaultView || window;" +
        "" +
        "var input = document.createElement('INPUT');" +
        "input.type = 'file';" +
        "input.style.display = 'none';" +
        "input.onchange = function () {" +
        "  var rect = target.getBoundingClientRect()," +
        "      x = rect.left + (offsetX || (rect.width >> 1))," +
        "      y = rect.top + (offsetY || (rect.height >> 1))," +
        "      dataTransfer = { files: this.files };" +
        "" +
        "  ['dragenter', 'dragover', 'drop'].forEach(function (name) {" +
        "    var evt = document.createEvent('MouseEvent');" +
        "    evt.initMouseEvent(name, !0, !0, window, 0, 0, 0, x, y, !1, !1, !1, !1, 0, null);" +
        "    evt.dataTransfer = dataTransfer;" +
        "    target.dispatchEvent(evt);" +
        "  });" +
        "" +
        "  setTimeout(function () { document.body.removeChild(input); }, 25);" +
        "};" +
        "document.body.appendChild(input);" +
        "return input;";

    WebElement input = (WebElement) jse.executeScript(JS_DROP_FILE, target, 0, 0);
    input.sendKeys(filePath.getAbsoluteFile().toString());
    waitFor(ExpectedConditions.stalenessOf(input));
}

Upvotes: 0

Jan Regent
Jan Regent

Reputation: 21

AutoIt has the DLL wrapper. I use it directly from C#/Selenium code.

Upvotes: 0

Related Questions