Naresh
Naresh

Reputation: 25753

Getting the count of elements in a list from Nightwatch

I have the following DOM structure:

<div data-qa-id="criteriaDisplay">
    <ul>
        <li>...</li>
        <li>...</li>
        <li>...</li>
    </ul>
</div>

I would like to write a command that returns the number of items in the list above. I am a newbie to Nightwatch. Here's my attempt to do this. My thinking is to start with the <ul> under the criteriaDisplay element and then count the <li> items under it. So I am trying to use the elementIdElements api, but it is not working:

var criteriaDisplayCommands = {
    getNumberOfItems: function(callback) {
        var self = this;
        console.log(this);
        return this.api.elementIdElements('@myList', 'css selector', 'li', function(result) {
            callback.call(self, result);
        });
    }
};

module.exports = {
    url: function() {
        return this.api.launchUrl + '/search';
    },

    sections: {
        criteriaDisplay: {
            selector: '[data-qa-id="criteriaDisplay"]',
            commands: [criteriaDisplayCommands],
            elements: {
                myList: 'ul'
            }
        }
    }
};

Can someone please help me with the right way to do this?

Upvotes: 2

Views: 7619

Answers (1)

dominik.mank
dominik.mank

Reputation: 131

I dont think this is right:

return this.api.elementIdElements('@myList', 'css selector', 'li', function(result) {
     callback.call(self, result);
});

Since elementIdElements requires the first parameter to be an elementId. In your case its a css selector.

The second i'm not sure about is that you are using custom selectors in the selenium api. I dont think that this is gonna work (but i'm not sure about this)

From the doc's section about defining-elements:

Using the elements property allows you to refer to the element by its name with an "@" prefix, rather than selector, when calling element commands and assertions (click, etc).

Since you are using the selenium api and not a command or assertion, i dont think that it would be a valid input.

You could use elements for getting your result, or an combination of element and elementIdElements.

The simple one is only using elements as shown below:

this.api.elements('css selector', 'ul li', function (result) {
    console.log(result.value.length) //(if there are 3 li, here should be a count of 3)
    callback.call(self, result);
});`

Upvotes: 4

Related Questions