Я хочу протестировать загрузку файлов с помощью теста angularjs e2e. Как вы это делаете в тестах e2e? Я запускаю свой тест script через грубую карму.
Как загрузить файл в angularjs e2e испытание транспортира
Ответ 1
Вот как я это делаю:
var path = require('path');
it('should upload a file', function() {
var fileToUpload = '../some/path/foo.txt',
absolutePath = path.resolve(__dirname, fileToUpload);
element(by.css('input[type="file"]')).sendKeys(absolutePath);
element(by.id('uploadButton')).click();
});
- Используйте модуль
path
, чтобы разрешить полный путь к файлу, который вы хотите загрузить. - Задайте путь к элементу input type="file".
- Нажмите кнопку загрузки.
Это не будет работать на firefox. Транспортир будет жаловаться, потому что элемент не виден. Для загрузки в firefox вам необходимо сделать вход видимым. Это то, что я делаю:
browser.executeAsyncScript(function(callback) {
// You can use any other selector
document.querySelectorAll('#input-file-element')[0]
.style.display = 'inline';
callback();
});
// Now you can upload.
$('input[type="file"]').sendKeys(absolutePath);
$('#uploadButton').click();
Ответ 2
Вы не можете напрямую.
По соображениям безопасности вы не можете смоделировать пользователя, который выбирает файл в системе, в комплекте функционального тестирования, таком как ngScenario.
С Protractor, так как он основан на WebDriver, должна быть возможность использовать этот трюк
Q: Поддерживает ли WebDriver загрузку файлов? A: Да.
Вы не можете напрямую взаимодействовать с диалоговым окном браузера файлов собственной операционной системы, но мы делаем некоторую магию, чтобы, если вы вызываете WebElement # sendKeys ("/path/to/file") для элемента загрузки файла, это делает правильную вещь. Убедитесь, что вы не используете WebElement # click() для элемента загрузки файла, иначе браузер, возможно, зависнет.
Это работает просто отлично:
$('input[type="file"]').sendKeys("/file/path")
Ответ 3
Вот комбо советов Андреса D и davidb583, которые помогли бы мне, когда я работал над этим...
Я пытался получить тесты транспортира, выполненные против элементов управления flowjs.
// requires an absolute path
var fileToUpload = './testPackages/' + packageName + '/' + fileName;
var absolutePath = path.resolve(__dirname, fileToUpload);
// Find the file input element
var fileElem = element(by.css('input[type="file"]'));
// Need to unhide flowjs secret file uploader
browser.executeScript(
"arguments[0].style.visibility = 'visible'; arguments[0].style.height = '1px'; arguments[0].style.width = '1px'; arguments[0].style.opacity = 1",
fileElem.getWebElement());
// Sending the keystrokes will ultimately submit the request. No need to simulate the click
fileElem.sendKeys(absolutePath);
// Not sure how to wait for the upload and response to return first
// I need this since I have a test that looks at the results after upload
// ... there is probably a better way to do this, but I punted
browser.sleep(1000);
Ответ 4
var imagePath = 'http://placehold.it/120x120&text=image1';
element(by.id('fileUpload')).sendKeys(imagePath);
Это работает для меня.
Ответ 5
Я понял, что ввод файла в тестируемом веб-приложении отображается только в Firefox, когда он прокручивается в окно с использованием JavaScript, поэтому я добавил scrollIntoView() в код Andres D, чтобы он работал для моего приложения:
browser.executeAsyncScript(function (callback) {
document.querySelectorAll('input')[2]
.style = '';
document.querySelectorAll('input')[2].scrollIntoView();
callback();
});
(Я также удалил все стили для элемента ввода файла)
Ответ 6
Это то, что я делаю для загрузки файла в firefox, этот script делает элемент видимым для установки значения пути:
browser.executeScript("$('input[type=\"file\"]').parent().css('visibility', 'visible').css('height', 1).css('width', 1).css('overflow', 'visible')");
Ответ 7
//Загрузить файл из C:\Directory
{
var path = require('path');
var dirname = 'C:/';
var fileToUpload = '../filename.txt';
var absolutePath = path.resolve('C:\filename.txt');
var fileElem = ptor.element.all(protractor.By.css('input[type="file"]'));
fileElem.sendKeys(absolutePath);
cb();
};
Ответ 8
текущие документированные решения будут работать только в том случае, если пользователи загружают jQuery. я в разных ситуациях пользователи получат такую ошибку: Failed: $не определен
Я предлагаю документировать решение с использованием собственного кода угловойа.
например. я предложил бы вместо того, чтобы предлагать:
$('input[type="file"]') .....
предложить:
angular.element(document.querySelector('input[type="file"]')) .....
последнее более стандартное, на вершине angular и более важно не требовать jquery