Selenium WebDriver: Java: Mac OS X: how control file upload automation for CuteWebUI_Uploader_Resource from CuteWebUI for ASP.NET

Question

硒2.37.0

Firefox 24.0（虽然也在 Chrome 上尝试过）

Mac OS X 山狮 10.8.5

涉及 Windows、Windows 特定自动化工具/库或 Mac OS X 以外的 O/S 的解决方案是不可接受的答案

首先我要说的是，在 Stackoverflow 上经常会问到非常相似的问题，我检查了每个提供的答案，但没有一个适用于 CuteWebUI_Uploader_Resource AJAX 文件上传器，我将在下面详细说明。

我有一个包含数据和文件的 Enterprise Java Web 应用程序，并希望自动映射和上传来自该 Web 应用程序的数据和文件的选定子集，以针对（进入）一个单独的 ASP.NET Web 应用程序，该应用程序使用 CuteWebUI 工具包以及来自CuteSoft 的 CuteWebUI_Uploader_Resource。

在撰写本文时，http://cutesoft.net 服务器已经关闭了几天；谷歌搜索提供了一些可能有助于解决此问题的 CuteSoft 论坛点击，但我目前无法访问它们。

像许多文件上传器一样，CuteWebUI AJAX 文件上传器有一个浏览按钮和一个上传按钮。

我希望能够在不使用浏览按钮的情况下直接上传到 CuteWebUI AJAX 文件上传器（并且不必使用 Mac OS X 上的浏览​​对话框玩任何技巧，因为我希望上传的文件将不可用到本地文件系统上的浏览器，而是存储在可通过 Java 访问 Java Web 应用程序的服务器上，尽管为了测试我可以将它们放在本地文件系统上，如下所示）。

我很感激其他文件上传者已经多次回答了这个问题（请参阅本文末尾的详尽列表），并且通常描述为大多数文件上传者的解决方案的过程大致是：

• 确定由“浏览”按钮填充的文件上传路径（有时隐藏）的 INPUT 字段。有时需要使用 JavascriptExecutor 取消隐藏它并确保它是一个文本字段，然后使用 sendKeys 来填充它。

• 识别匹配的 SUBMIT Upload 按钮并单击（）它。

这不适用于 CuteWebUI AJAX 文件上传器。

我的目标系统确实有一个 INPUT 元素，顾名思义，它用于存储文件上传路径，但实际上当我手动尝试它（并使用 Firebug 和 Selenium IDE 检查它）时，它的值根本没有填充，而是出现了一个全新的可上传文件临时表。

以下 HTML 显示了尝试任何文件浏览或上传之前的情况。我省略了一些样式标记和一些不相关的值：

<script src="/CuteWebUI_Uploader_Resource.axd?type=script&amp;_ver=" type="text/javascript"></script>
<input 
type="hidden" 
autocomplete="off" 
name="fileuploader_433"
id="fileuploader_433"
isuploaderfield="1" 
value="">
<button>Browse</button>
<span style="display: none;"></span>
<button style="display: none;">Cancel upload</button>
<img 
showprogressbar="1" 
canceluploadmsg="Cancel upload" 
resourcehandler="/CuteWebUI_Uploader_Resource.axd" 
uploadtype="Auto" 
cancelallmsg="Cancel all Uploads" 
uploadurl="/Handlers/UploadHandler.ashx" 
insertext="Upload a file" 
uploadingmsg="Uploading.." filetoolargemsg=".." maxfileslimitmsg=".." 
inserttext="Browse"
numfilesshowcancelall="2147483647" 
barstyle="Continuous" 
showprogressinfo="0" 
multiplefilesupload="0" 
windowsdialoglimitmsg=".." 
manualstartupload="1" 
extensions=""
contextvalue=".." 
onerror="this.onload()" 
onload="this.style.display=&quot;none&quot; ; 
if(!window.CuteWebUI_AjaxUploader_Initialize){
var xh=window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject('Microsoft.XMLHttp');
xh.open('GET','/CuteWebUI_Uploader_Resource.axd?type=script&amp;amp;_ver=',false);xh.send('');eval(xh.responseText)}CuteWebUI_AjaxUploader_Initialize(this.id);" 
src="/CuteWebUI_Uploader_Resource.axd?type=file&amp;file=continuous.gif" 
pageupload="1" 
namespace="CuteWebUI" 
uniqueid="fileuploader_433" 
id="fileuploader_433_Loader_unique" 
style="display: none;">
<button 
onclick="return submitbutton_click('433')" 
class="submitbutton" 
name="SubmitButton" 
id="SubmitButton">Upload</button>

Java 中的以下 Selenium 正确取消隐藏并填充了 fileuploader_433 INPUT 字段，但是在提交时执行 click() 时，我仍然得到一个弹出窗口，断言我必须使用浏览按钮并显示消息“请使用浏览文件上传”：

    String name_fileuploader = "fileuploader_434";
    JavascriptExecutor jse = (JavascriptExecutor) driver;
    jse.executeScript("document.getElementsByName('" + name_fileuploader + "')[0].setAttribute('type', 'text');");
    WebElement element_uploader = driver.findElement(By.xpath("//input[@name='" + name_fileuploader + "']"));
    element_uploader.clear();
    String filepath="/path/to/file.pdf";
    element_uploader.sendKeys(filepath);        
    driver.findElement(By.xpath("(//button[@id='SubmitButton'])[2]")).click();

Firebug 确认即使您手动操作，也不会使用 INPUT 字段！相反，会出现一个新的文件队列表：

<script src="/CuteWebUI_Uploader_Resource.axd?type=script&amp;_ver=" type="text/javascript"></script>
<input type="hidden" autocomplete="off" name="fileuploader_434" id="fileuploader_434" isuploaderfield="1" value="">
<button>Browse</button>
<table .. class="AjaxUploaderQueueTable">
<tbody>
<tr class="AjaxUploaderQueueTableRow">
<td>
<img src="/CuteWebUI_Uploader_Resource.axd?type=file&amp;file=circle.png&amp;_ver=null" title="">
</td>
<td>file.pdf</td><td>
<img src="/CuteWebUI_Uploader_Resource.axd?type=file&amp;file=stop.png&amp;_ver=null" title="Remove" style="cursor: pointer;">
</td>
</tr>
</tbody>
</table>
<span style="display: none;"></span>
<button style="display: none;">Cancel upload</button>
<img showprogressbar="1" canceluploadmsg="Cancel upload" ..   
resourcehandler="/CuteWebUI_Uploader_Resource.axd" uploadtype="Auto"  
cancelallmsg="Cancel all Uploads" uploadurl="/Handlers/UploadHandler.ashx" [snip]
onerror="this.onload()" onload="this.style.display=&quot;none&quot; ; 
if(!window.CuteWebUI_AjaxUploader_Initialize){var xh=window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject('Microsoft.XMLHttp');xh.open('GET','/CuteWebUI_Uploader_Resource.axd?type=script&amp;amp;_ver=',false);xh.send('');eval(xh.responseText)}CuteWebUI_AjaxUploader_Initialize(this.id);" 
src="/CuteWebUI_Uploader_Resource.axd?type=file&amp;file=continuous.gif" 
pageupload="1" namespace="CuteWebUI" uniqueid="fileuploader_434"
id="fileuploader_434_Loader_unique" style="display: none;">

<button onclick="return submitbutton_click('434')" class="submitbutton" name="SubmitButton" id="SubmitButton">Upload</button>

请注意：

• 隐藏的 INPUT 元素永远不会填充文件路径值！

• 相反，字符串 file.pdf 没有完整的文件路径出现在浏览按钮下方的 class="AjaxUploaderQueueTable" 的新 TABLE 中。

插入的 AjaxUploaderQueueTable 显然只是装饰性的；似乎在浏览操作期间选择的文件路径存储在服务器端。在使用 Firebug 使用“浏览”按钮进行选择后，我已经搜索了完整的文件路径，但它不存在于页面中。

我对那些涉及在 Mac OS X 中操纵“浏览”对话框的技巧持开放态度（仅出于测试目的），但这种方法不能满足我的最终要求，因为我不能依赖它将许多文件从 Enterprise Java Web 应用程序上传到目标 ASP.NET Web 应用程序的最终任务的方法。我必须完全避开浏览对话框。

背景研究

以下所有问题都有相关的问题和答案，但这些都不能解决CuteWebUI AJAX文件上传器的问题：

How to type some text in hidden field in Selenium WebDriver using Java

How to handle windows file upload using Selenium WebDriver?

How to force Selenium WebDriver to click on element which is not currently visible?

how does selenium webdriver upload files to the browser?

How to deal with file uploading in test automation using selenium or webdriver

https://stackoverflow.com/questions/18886970/selenium-webdriver-upload-file-sendkeys-dont-work

File Upload using Selenium WebDriver and Java

How to handle with uploading files from modal window Selenium WebDriver Java

Handling a popup window using selenium

http://selenium.10932.n7.nabble.com/Handling-browser-pop-up-dialog-to-upload-a-file-td29153.html

CuteSoft 的这个可能相关的论坛链接已关闭：

Jul 24, 2012 - Hi,I'm doing automated testing for my web system using selenium webdriver, the problem is that I can't interact with ajaxuploader component

还有一个使用 INPUT 取消隐藏技巧的 WebDriver 论坛发帖：https://groups.google.com/forum/#!topic/webdriver/JAXC_qEbQvI

Answer 1

我已经找到了解决方案；它带有一些警告，但它适用于我的情况。希望对你也有帮助。

最大的警告是，我只知道它适用于今天下载的当前版本的 AjaxUploader。我一直在使用工作方式不同的旧版本；我无法指定版本号，因为 CuteSoft 似乎病态地倾向于使 AjaxUploader 的版本号几乎无法弄清楚。我找不到当前版本或我正在使用的旧版本的版本号。

另一个需要注意的是，它依赖于页面上一次只有一个 AjaxUploader 控件。似乎 AjaxUploader 确实创建了一个 <input type='file'> 元素，但它在 <body> 标记顶部的 div 中悬空，没有任何 id 或 name 属性或任何其他将其链接到特定上传者的东西。我不确定当存在多个 AjaxUploader 时会做什么：也许它会创建多个文件输入和轨道，这是由 javascript 提供的；也许它共享一个。对于我的情况，我不需要解决那部分，所以我没有尝试。

无论如何，诀窍是找到文件输入如下：

webDriver.findElements(By.cssSelector("body > div > input[type='file']")).get(0).sendKeys(fileName);

请注意，此处的选择器与您正在使用的特定上传按钮的 ID 或任何其他特征无关。它只是“直接在 body 标签内的 div 内的第一个文件输入”。这就是 AjaxUploader 插入其文件输入的地方。

似乎不需要与 UI 的任何其余部分进行交互，包括“浏览”按钮：sendKeys将文件名输入到正确的文件输入会导致立即开始上传。 （这是一个编辑；我原本认为点击按钮也是必要的，但似乎不是）

请注意，为了确保您的测试时间正确运行，您可能希望在此点击之后执行等待操作，等待文件完成上传（例如，通过等待 AjaxUploader 在上传后插入的 HTML 是完成），然后再继续下一步。