Я хочу протестировать загрузку файлов с помощью теста angularjs e2e. Как вы это делаете в тестах e2e? Я запускаю свой тестовый сценарий через ворчание кармы.
angularjs
file
file-upload
gruntjs
protractor
Паван Сингх
источник
источник
Ответы:
Вот как я это делаю:
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
модуль, чтобы разрешить полный путь к файлу, который вы хотите загрузить.Это не будет работать в 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();
источник
__dirname
иногда указывает на временный каталог (вероятно, куда тесты копируются средством запуска тестов). Вы можете использоватьprocess.cwd()
вместо,__dirname
если это так.Вы не можете напрямую.
По соображениям безопасности вы не можете имитировать пользователя, который выбирает файл в системе в рамках функционального набора тестирования, такого как ngScenario.
С Protractor, поскольку он основан на WebDriver, должно быть возможно использовать этот трюк
Это прекрасно работает:
$('input[type="file"]').sendKeys("/file/path")
источник
Вот комбинация советов Андреса Д. и 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's 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);
источник
var imagePath = 'http://placehold.it/120x120&text=image1'; element(by.id('fileUpload')).sendKeys(imagePath);
Это работает для меня.
источник
Это то, что я делаю для загрузки файла в firefox, этот скрипт делает элемент видимым для установки значения пути:
browser.executeScript("$('input[type=\"file\"]').parent().css('visibility', 'visible').css('height', 1).css('width', 1).css('overflow', 'visible')");
источник
Я понял, что ввод файла в веб-приложении, которое я тестирую, отображается в Firefox только тогда, когда он прокручивается в представление с помощью JavaScript, поэтому я добавил scrollIntoView () в код Андреса D, чтобы он работал в моем приложении:
browser.executeAsyncScript(function (callback) { document.querySelectorAll('input')[2] .style = ''; document.querySelectorAll('input')[2].scrollIntoView(); callback(); });
(Я также удалил все стили для элемента ввода файла)
источник
// Чтобы загрузить файл из 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();
};
источник
fileToUpload
?Если вы хотите выбрать файл, не открывая всплывающее окно, вот ответ:
var path = require('path'); var remote = require('../../node_modules/selenium-webdriver/remote'); browser.setFileDetector(new remote.FileDetector()); var fileToUpload = './resume.docx'; var absolutePath = path.resolve(process.cwd() + fileToUpload); element(by.css('input[type="file"]')).sendKeys(absolutePath);
источник
текущие документированные решения будут работать, только если пользователи загружают jQuery. я во всех разных ситуациях пользователи получат такую ошибку: Failed: $ is not defined
Я бы предложил задокументировать решение, используя собственный код angularjs.
например, я бы предложил вместо того, чтобы предлагать:
$('input[type="file"]') .....
предлагать:
angular.element(document.querySelector('input[type="file"]')) .....
последний более стандартный, поверх angular и, что более важно, не требует jquery
источник