Navigate context menu with nightwatch.js?

Question

Im using nightwatchjs and having some difficulties with selecting a text and triggering a right-click and navigate a context menu that I built. This image is an example of what im trying to achieve. Select the 1957 text, right click, nagivate to down to toolkit, then nagivate right, and right again, and click search zone.

My nightwatchjs code is as follow:

    it('Api test call', function (browser) {
        browser
            .url('http://sandbox.com/apiTest.html')
            .pause()
        browser.expect.element('#zoneId').text.to.equal('1957')
        .moveToElement('#zoneId')
        .mouseButtonClick('right')
        .keys(browser.Keys.DOWN_ARROW)
        .keys(browser.Keys.DOWN_ARROW)
        .keys(browser.Keys.DOWN_ARROW)
        .keys(browser.Keys.DOWN_ARROW)
        .keys(browser.Keys.DOWN_ARROW)
        .keys(browser.Keys.RIGHT_ARROW)
        .keys(browser.Keys.RIGHT_ARROW)
        .end();
    });

Right now it doesn't work, it just loads the page but nothing gets selected and navigation does not happen. Anyone can advise me if this is possible or how I can make it work? Thank you.

Answer 1

Can you try this. I have replaced browser.expect.element('#zoneId').text.to.equal('1957') with .assert.containsText('#zoneId', '1957'). And also added xoffset and offset to moveToElement.

it('Api test call', function(browser) {
  browser
    .url('http://sandbox.com/apiTest.html')
    .assert.containsText('#zoneId', '1957')
    .moveToElement('#zoneId', 10, 10)
    .mouseButtonClick('right')
    .pause(1000)
    .keys(browser.Keys.DOWN_ARROW)
    .pause(1000)
    .keys(browser.Keys.DOWN_ARROW)
    .pause(1000)
    .keys(browser.Keys.DOWN_ARROW)
    .pause(1000)
    .keys(browser.Keys.DOWN_ARROW)
    .pause(1000)
    .keys(browser.Keys.DOWN_ARROW)
    .pause(1000)
    .keys(browser.Keys.RIGHT_ARROW)
    .pause(1000)
    .keys(browser.Keys.RIGHT_ARROW)
    .end();
});