फाइल को एंगुलरज e2e प्रोट्रेक्टर टेस्टिंग में कैसे अपलोड करें

Question 1

मैं एक angularjs e2e टेस्ट का उपयोग करके फ़ाइल अपलोडिंग का परीक्षण करना चाहता हूं। आप इसे e2e परीक्षणों में कैसे करते हैं? मैं अपनी परीक्षा की स्क्रिप्ट ग्रन्ट कर्म के माध्यम से चलाता हूं।

Question 2

यह मेरा इसे करने का तरीका है:

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जिस फ़ाइल को आप अपलोड करना चाहते हैं, उसके पूर्ण पथ को हल करने के लिए मॉड्यूल का उपयोग करें।
इनपुट प्रकार = "फ़ाइल" तत्व के लिए पथ सेट करें ।
अपलोड बटन पर क्लिक करें।

यह फ़ायरफ़ॉक्स पर काम नहीं करेगा। प्रोटेक्टर शिकायत करेगा क्योंकि तत्व दिखाई नहीं दे रहा है। फ़ायरफ़ॉक्स में अपलोड करने के लिए आपको इनपुट दृश्यमान बनाने की आवश्यकता है। मैं यह करता हूं:

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();

Question 3

आप सीधे नहीं कर सकते।

सुरक्षा कारण के लिए, आप एक उपयोगकर्ता का अनुकरण नहीं कर सकते हैं जो ngScenario जैसे कार्यात्मक परीक्षण सूट के भीतर सिस्टम पर एक फ़ाइल चुन रहा है।

प्रोट्रैक्टर के साथ, चूंकि यह वेबड्राइवर पर आधारित है, इसलिए इस ट्रिक का उपयोग करना संभव होना चाहिए

प्रश्न: वेबड्राइवर फ़ाइल अपलोड का समर्थन करता है? A: हाँ।

आप सीधे देशी OS फ़ाइल ब्राउज़र संवाद के साथ बातचीत नहीं कर सकते, लेकिन हम कुछ जादू करते हैं ताकि यदि आप फ़ाइल अपलोड तत्व पर WebElement # sendKeys ("/ path / to / file") कहते हैं, तो यह सही काम करता है। सुनिश्चित करें कि आप वेब अपलोड # क्लिक () फ़ाइल अपलोड तत्व नहीं करते हैं, या ब्राउज़र शायद लटकाएगा।

यह ठीक काम करता है:

$('input[type="file"]').sendKeys("/file/path")

Question 4

यहाँ एंड्रेस डी और davidb583 की सलाह का एक कॉम्बो है जिसने मुझे इस के माध्यम से काम करने में मदद की होगी ...

मैं फ्लोजेक्स नियंत्रणों के खिलाफ निष्पादित किए जाने वाले प्रॉटेक्टर टेस्ट प्राप्त करने की कोशिश कर रहा था।

    // 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);

Question 5

var imagePath = 'http://placehold.it/120x120&text=image1';
element(by.id('fileUpload')).sendKeys(imagePath);

यह मेरे लिए काम कर रहा है।

Question 6

यह वही है जो मैं फ़ायरफ़ॉक्स पर फ़ाइल अपलोड करने के लिए करता हूं, यह स्क्रिप्ट पथ मान सेट करने के लिए तत्व को दिखाता है:

   browser.executeScript("$('input[type=\"file\"]').parent().css('visibility', 'visible').css('height', 1).css('width', 1).css('overflow', 'visible')");

Question 7

मुझे एहसास हुआ कि वेब ऐप में मैं जो फ़ाइल परीक्षण कर रहा हूं, वह फ़ाइल इनपुट केवल फ़ायरफ़ॉक्स में दिखाई देती है, जब इसे जावास्क्रिप्ट का उपयोग करते हुए स्क्रॉल किया जाता है, इसलिए मैंने एंड्रेस डी कोड में स्क्रॉल इनटू व्यू () को अपने ऐप के लिए काम करने के लिए जोड़ा:

  browser.executeAsyncScript(function (callback) {
        document.querySelectorAll('input')[2]
     .style = '';
        document.querySelectorAll('input')[2].scrollIntoView();

        callback();
    });

(मैंने फ़ाइल इनपुट तत्व के लिए सभी शैलियों को भी हटा दिया)

Question 8

// 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();

};

Question 9

यदि आप नीचे पॉपअप खोले बिना किसी फ़ाइल का चयन करना चाहते हैं, तो इसका उत्तर है:

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);

Question 10

वर्तमान प्रलेखित समाधान केवल तभी काम करेगा जब उपयोगकर्ता jQuery लोड कर रहे हैं। i सभी विभिन्न स्थितियों में उपयोगकर्ताओं को एक त्रुटि मिलेगी जैसे: विफल: $ परिभाषित नहीं है

मैं मूल angularjs कोड का उपयोग करके किसी समाधान का दस्तावेज़ देने का सुझाव दूंगा।

उदाहरण के लिए मैं सुझाव देने के बजाय सुझाव दूंगा:

    $('input[type="file"]') .....

करने के लिए सुझाव:

    angular.element(document.querySelector('input[type="file"]')) .....

उत्तरार्द्ध अधिक मानक है, कोणीय के ऊपर और अधिक महत्वपूर्ण को jquery की आवश्यकता नहीं है