Protractor: Test Window Scrolling Behavior

I need to check if the window will not scroll if overflow: hidden applies to the body tag.

Unfortunately, scrollTo and any jQuery equivalent actually scroll (or set the position) of the window, even if overflow: hidden is applied.

WebDriverJS / Protractor does not have a "Window (). Scroll" method.

Is there any way to check my code?

Another thing that I found strange was that window (). getPosition () does not seem to pull out the same browser window, since in the test below, if you try to getPosition using Protractor, the window position is still 0.0, although you executed the script in the browser.

In connection with these two questions:

Protractor code

Suppose below mywebpage may scroll, but has overflow: hidden set

describe('My webpage', function() {
    beforeEach(function() {
        browser.get('https://127.0.0.1/mywebpage');
        browser.driver.manage().window().setSize(1400,800);                  
        browser.driver.manage().window().setPosition(0,0);
    });
  
    it('Scrolling y is disabled', function() {
        var scrollFunction = function() { 
            window.scrollTo(0,55);
        };
        var getOffsetTop = function() { 
            return document.body.scrollTop; 
        };
        browser.executeScript(scrollFunction).then(function (yes) {
            browser.executeScript(getOffsetTop).then(function (newposition) {
                expect(newposition).toBe(0);
            });
        });
    
    });

    it('Scrolling y is disabled looking at Protractor Window', function() {
      var scrollFunction = function() { 
          window.scrollTo(0,55);
      };
      var getOffsetTop = function() { 
          return document.body.scrollTop; 
      };
      browser.executeScript(scrollFunction).then(function (yes) {
          browser.driver.manage().window().getPosition().then(function (newposition) {
              expect(newposition.getY()).toBe(0); // This is falsely true, if your scrolling y is enabled, this still remains position 0 
          });
      });

    });

  });
Run codeHide result
+4
source share
1 answer

This may not be exactly what you are asking for, but what we did in a similar case, we introduce a reusable custom jasmine set that checks if the element has a scroll:

toHaveScroll: function() {
    return {
        compare: function(elm) {
            return {
                pass: protractor.promise.all([
                    elm.getSize(),
                    elm.getAttribute("scrollHeight")
                ]).then(helpers.spread(function (size, scrollHeight) {
                    return scrollHeight >= size.height;
                }))
            };
        }
    };
},

Using:

expect(elm).toHaveScroll();
0
source

All Articles