फैंटमज; एक तत्व क्लिक करें

Question 1

मैं PhantomJS में किसी तत्व को कैसे क्लिक करूं?

page.evaluate(function() {
    document.getElementById('idButtonSpan').click();  
});

यह मुझे एक त्रुटि देता है "अपरिभाषित एक फ़ंक्शन नहीं है ..."

अगर मैं इसके बजाय

 return document.getElementById('idButtonSpan');

और फिर इसे प्रिंट करें,

तब यह प्रिंट करता है [ऑब्जेक्ट ऑब्जेक्ट], इसलिए तत्व मौजूद है।

तत्व एक बटन के रूप में कार्य करता है, लेकिन यह वास्तव में सिर्फ एक स्पैन तत्व है, न कि सबमिट इनपुट।

मैं कैस्पर के साथ काम करने के लिए इस बटन को क्लिक करने में सक्षम था, लेकिन कैस्पर की अन्य सीमाएं थीं इसलिए मैं फैंटमजस वापस आ गया हूं।

Question 2

.click()मानक नहीं है। आपको एक घटना बनाने और उसे भेजने की आवश्यकता है:

function click(el){
    var ev = document.createEvent("MouseEvent");
    ev.initMouseEvent(
        "click",
        true /* bubble */, true /* cancelable */,
        window, null,
        0, 0, 0, 0, /* coordinates */
        false, false, false, false, /* modifier keys */
        0 /*left*/, null
    );
    el.dispatchEvent(ev);
}

Question 3

वैकल्पिक रूप से @ torazaburo की प्रतिक्रिया के अनुसार, आप HTMLElement.prototype.clickPhantomJS में दौड़ने पर रुक सकते हैं। उदाहरण के लिए, हम अपने परीक्षण चलाने के लिए PhantomJS + Qunit का उपयोग करते हैं और हमारे qunit-config.jsपास इस तरह से कुछ हैं:

if (window._phantom) {
  // Patch since PhantomJS does not implement click() on HTMLElement. In some 
  // cases we need to execute the native click on an element. However, jQuery's 
  // $.fn.click() does not dispatch to the native function on <a> elements, so we
  // can't use it in our implementations: $el[0].click() to correctly dispatch.
  if (!HTMLElement.prototype.click) {
    HTMLElement.prototype.click = function() {
      var ev = document.createEvent('MouseEvent');
      ev.initMouseEvent(
          'click',
          /*bubble*/true, /*cancelable*/true,
          window, null,
          0, 0, 0, 0, /*coordinates*/
          false, false, false, false, /*modifier keys*/
          0/*button=left*/, null
      );
      this.dispatchEvent(ev);
    };
  }
}

Question 4

यह सुंदर नहीं है, लेकिन मैं इसे चयन के लिए jQuery का उपयोग करने की अनुमति देने के लिए उपयोग कर रहा हूं:

var rect = page.evaluate(function() {
    return $('a.whatever')[0].getBoundingClientRect();
});
page.sendEvent('click', rect.left + rect.width / 2, rect.top + rect.height / 2);

लेकिन आप हमेशा jQuery का उपयोग न करने के $(s)[0]साथ बदल सकते हैं document.querySelector(s)।

(यह तत्व को देखने के दिमाग में होने पर निर्भर करता है, यानी आपका viewportSize.height काफी बड़ा है)।

Question 5

आशा है कि निम्नलिखित विधि उपयोगी होगी। इसने मेरे लिए संस्करण 1.9 में काम किया

page.evaluate(function(){
    var a = document.getElementById("spr-sign-in-btn-standard");
    var e = document.createEvent('MouseEvents');
    e.initMouseEvent('click', true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
    a.dispatchEvent(e);
    waitforload = true;
});

इसने मेरे लिए काम किया। आशा है कि यह दूसरों के लिए भी उपयोगी होगा

Question 6

इसके 1.9.2लिए मेरे साथ काम करने पर, क्लिक हैंडलर चालू हो गए:

var a = page.evaluate(function() {
    return document.querySelector('a.open');
});

page.sendEvent('click', a.offsetLeft, a.offsetTop);

Question 7

evaluateइस तरह से सरल जावास्क्रिप्ट का उपयोग करें:

page.evaluate(function() {
    document.getElementById('yourId').click();
});

Question 8

मैं तत्व को सीधे क्लिक करने में सक्षम नहीं था। इसके बजाय, मैंने यह देखने के लिए html को देखा कि किस फ़ंक्शन को ऑनक्लिक के साथ बुलाया गया था, और फिर उस फ़ंक्शन को कहा गया।

Question 9

Document.querySelector (तत्व) .click () फैंटमज 2.0 का उपयोग करते समय काम करता है

click: function (selector, options, callback) {
    var self = this;
    var deferred = Q.defer();
    options = options || {timeout:1000}; 
    setTimeout(function () { 
        self.page.evaluate(function(targetSelector) {
            $(document).ready(function() {
                document.querySelector(targetSelector).click();
            }) ;
        }, function () {
                deferred.resolve();
        }, selector);
    }, options.timeout);
    return deferred.promise.nodeify(callback);
},

Question 10

PhantomJS के साथ डबल क्लिक भी संभव है।

सिफारिश की

इस से अनुकूलित है जवाब की stovroz और एक देशी चलाता है dblclickसहित mousedown, mouseupऔर clickघटनाओं (प्रत्येक के दो)।

var rect = page.evaluate(function(selector){
    return document.querySelector(selector).getBoundingClientRect();
}, selector);
page.sendEvent('doubleclick', rect.left + rect.width / 2, rect.top + rect.height / 2);

दूसरा तरीका

निम्नलिखित दो तरीके केवल dblclickघटना को ट्रिगर करते हैं , लेकिन अन्य घटनाओं को नहीं जो इसे पूर्ववर्ती होना चाहिए।

से अनुकूलित इस उत्तर के torazaburo :

page.evaluate(function(selector){
    var el = document.querySelector(sel);
    var ev = document.createEvent("MouseEvent");
    ev.initMouseEvent(
        'dblclick',
        true /* bubble */, true /* cancelable */,
        window, null,
        0, 0, 0, 0, /* coordinates */
        false, false, false, false, /* modifier keys */
        0 /*left*/, null
    );
    el.dispatchEvent(ev);
}, selector);

से अनुकूलित इस उत्तर के Jobins जॉन :

page.evaluate(function(selector){
    var el = document.querySelector(sel);
    var e = document.createEvent('MouseEvents');
    e.initMouseEvent('dblclick', true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
    el.dispatchEvent(e);
}, selector);

पूर्ण परीक्षण स्क्रिप्ट

Question 11

सबसे आसान तरीका jQuery का उपयोग कर रहा है।

page.evaluate(function() {
  page.includeJs("your_jquery_file.js", function() {
    page.evaluate(function() {
      $('button[data-control-name="see_more"]').click();
    });
  });
});

Question 12

JQuery का उपयोग करने वालों के लिए, JQuery UI ने इनका अनुकरण करने के लिए एक उपयोगिता बनाई: jquery-simulate । मैं इसे PhantomJS और Chrome में उपयोग करता हूं

$ele..simulate( "click" );