Search code examples
javascriptselenium-chromedrivernightwatch.js

How to bring an element to the browser's viewpoint with Nightwatchjs


I am trying the scroll down and bring an element to the browser's viewpoint. Which is at the bottom of the page and not visible unless scroll down.

With the help of this Stackoverflow post I am able to get the x and y for the element but not able to bring it to the viewpoint.

    browser.getLocationInView('#element', function (result){
        console.log ('x: '+ result.value.x);
        console.log ('y: '+ result.value.y);
    })

This gives me x: 16, y: 519

After that I tried

browser.execute('scrollTo(16, 519)')

This does not scroll it to the viewpoint. What is the way to do this?

Well, perhaps I did not understood the use of these apis in right way.


Solution

  • There are Nightwatch APIs that work fine if you have to scroll an element into the viewport.

    moveToElement is my first choice always as it takes element selector as param and brings the element to top of the viewport.

    moveTo is a great choice if you have to use the element's location. The docs are available here.

    Below is the syntax.

    .moveToElement(selector, xoffset, yoffset, [callback])
    .moveToElement(using, selector, xoffset, yoffset, [callback])
    
    .moveTo([webElementId], xoffset, yoffset, [callback])
    .moveTo(null, xoffset, yoffset, [callback])