如何对 ng-file-upload 进行 E2E 测试？
<div id="fileBTSToUpload" ngf-drop ngf-select ng-model="fileBTS" class="drop-box" ngf-accept="'.txt'" ngf-drag-over-class="'dragover'"> Drag and Drop here
</div>
【问题讨论】：
标签： testing jasmine protractor ng-file-upload
问题在于，仅使用Protractor，您无法将文件实际拖放到页面上的指定位置。而且，另一个问题是，如果您设法打开浏览器的上传对话框窗口，您将无法通过Protractor/WebDriverJS 控制它。
一种常见的方法是找到带有type="file" 的input 元素并将包含您要上传的文件的绝对路径的密钥发送给它。 input 必须在页面上才能上传才能工作，尽管 input 通常是隐藏的，您需要使其可见才能执行“发送密钥”。在此处查看示例解决方案：
【讨论】：
将 Protractor 版本设置为“1.6.1”，将 ng-file-upload 设置为“9.0.1”。为此，请执行以下操作：
npm install protractor@1.6.1
编辑文件：bower.json 并设置版本：
"ng-file-upload": "~9.0.1",
然后执行如下：
bower install
Angular 代码中还必须包含一个按钮才能工作：
<div id="fileBTSToUpload" ngf-drop ngf-select ng-model="fileBTS" class="drop-box" ngf-accept="'.txt'" ngf-drag-over-class="'dragover'"> Drag and Drop
</div>
<button id="btn2" ng-click="uploadFileToUrl(fileBTS, btsUrl);">upload</button>
Jasmine端到端测试代码如下：
it('a sample test...',function(){
//Assemble
browser.get('/the_page_url');
//Act
var fileToUpload = './some-file.csv';
var path = require('path');
var absolutePath = path.resolve(__dirname,fileToUpload);
var input = element(by.css('input[type=file]'));
input.sendKeys(absolutePath);
element(by.id('btn2')).click();
browser.waitForAngular();
//Assert
expect(2).toEqual(2);
//browser.sleep(5000);
//browser.pause();
});
对于要安装的路径，请执行以下操作：
npm install path
【讨论】：