javascript - 如果 &lt;input&gt; 元素不可见且仅由 anchor 标记 <a> 引用，我如何设置上传文件的路径？

Question

使用 WebDriver，如果元素的类型为 type="file"，我通常只需将 .sendKeys() 直接发送到元素即可，效果非常好。

不幸的是，我现在的情况是使用了一个自定义按钮，它有一个引用输入元素的 anchor 标记:

//anchor tag which is a custom button referring to non visible file input element
    <a id="image-upload-button" class="control_button button" href="#/create_channel/addImage" data-ember-action="151">

//refers to this file input element which is not visible
    <input id="image-selector-button" name="image-selector" type="file" class="selectImageBtn" {{action "selectImage" on="change" target="view"}} {{action "onBlur" on="blur" target="App.router.imageSelectorView"}} {{action "onFocus" on="focus" target="view"}}/>

在这种情况下，sendKeys() 对 anchor 标记不起作用:

driver.findElement(By.id("image-upload-button ")).sendKeys(“c:\\myFile.bmp”);

错误: org.openqa.selenium.WebDriverException: focusElement 执行失败；无法发送 key ，因为无法聚焦元素

sendKeys() 也不对不可见的文件输入元素起作用:

driver.findElement(By.id("image-selector-button ")).sendKeys(“c:\\myFile.bmp”);

错误: org.openqa.selenium.ElementNotVisibleException:必须显示元素才能单击

我已经尝试通过几种不同的方式(见下文)注入(inject) javaScript 来设置不可见输入元素上的路径值，但似乎没有任何效果。关于如何设置这条路径的任何想法？

//nothing happens when I try this

JavascriptExecutor js = (JavascriptExecutor) driver;

js.executeScript("window.document.getElementById('image-selector-button').setAttribute('value','C:\\MyFile.jpg');");  



//I tried firing a change even first as well and that didn't appear to do anything either

js.executeScript(
"var el=document.getElementById('image-selector-button'); " +
" function fire(evttype) { " +
" if (document.createEvent) { " +
" var evt = document.createEvent('HTMLEvents'); " +
" evt.initEvent( evttype, false, false); "+
" el.dispatchEvent(evt); " +
" } else if (document.createEventObject) { "+
"  el.fireEvent('on' + evttype); " +
" }    }; " +
" fire(el,'change'); " );

如有任何帮助或建议，我们将不胜感激!

Answer 1

尝试先显示控件，然后设置值，再隐藏:

JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("document.getElementById('image-selector-button').style.display = 'block';");
driver.findElement(By.id("image-selector-button ")).sendKeys("c:\\myFile.bmp");
js.executeScript("document.getElementById('image-selector-button').style.display = 'none';");