如何使用 webdriver 自动化 bootstrap fileupload 上传控件

Question

我想使用 bootstrap 中内置的文件上传控件自动执行文件上传过程。我正在使用 webdriver 做同样的事情。下面是我的代码，但不幸的是它不起作用：

element=driver.findElement(By.xpath("//[@id='upload']/fieldset/div[2]/input[1]"));
element.sendKeys(pathToFile);

出现 element not visible 错误。

这是我试图自动化的 bootstrap 文件上传控件的示例- 通过 JavaScript：在这个 URL http://markusslima.github.io/bootstrap-filestyle/ 请看下面的样式-

$(":file").filestyle({icon: false});

Answer 1

好的。我想我解决了。

    WebElement fileInput = driver.findElement(By.id("document"));

    JavascriptExecutor js = (JavascriptExecutor) driver;
    WebElement element = driver.findElement(By.id("document"));
    js.executeScript("arguments[0].setAttribute('style', 'left:30px')",
            element);

    fileInput.sendKeys(fileName);

bootstrap-filestyle.js隐藏一个输入元素，所以你必须将它移动到可见区域，然后以标准方式设置它。

如此简单的解决方案，真是太麻烦了。

这是我原来的 html 代码：

<span id="documentUpload">
    <input type="file" id="document" name="document" class="notMandatory" onkeypress="return noenter(event)" tabindex="-1" style="position: absolute; left: -9999px;">
    <div class="bootstrap-filestyle" style="display: inline;" tabindex="0">
        <input type="text" class="input-xlarge" disabled="" autocomplete="off"> 
        <label for="document" class="btn"><i class="icon-folder-open"></i> <span>Upload</span></label>
    </div>
</span>

如何使用 webdriver 自动化 bootstrap fileupload 上传控件

How to automate the bootstrap fileupload upload control using webdriver

file-upload

webdriver