How to trigger a tap event on Chrome devtool console?

Question

How can I use the Chrome-devtool's console to test if my javascript works? I've located the xpath and converted it to an css locator. Basically it is a button that turns the color from grey to blye.

Here is my snippet code: browser.execute_script("$('button.nominate').trigger('tap');")

On the console, I tried something like:

$('button.nominate').trigger('tap')

The result shown below:

[]

I thought it would tap the button

Solution

I suppose you are doing some kind of functional testing on your mobile app. I was doing the same thing some time ago (using CasperJS) and, in the process, I've created this function:

// I've commented out CasperJS specific stuff, don't use it if you don't need it
function triggerEventOnPage(selector, eventName, memo) {
    //casper.evaluate(function(selector, eventName, memo){
        var event;
        var element = document.querySelector(selector);

        event = document.createEvent("Event");
        event.initEvent(eventName, true, true);
        event.memo = memo || { };

        element.dispatchEvent(event);
    //}, selector, eventName, memo);
    //wait();
}

You can use it in your tests by calling:

triggerEventOnPage(".edit-list-button", 'tap');

However, mind that there is no native tap event. There are only touchstart, tachmove, touchend events and implementation of tap is done based on those three. Therefore, implementation of tap event that you are using may differ from one that I was using and the function above may not work for you.

EDIT: since you are using jQuery, $('button.nominate').trigger('tap') should work just fine to. @NULL may be right that your selector is invalid.