Cypress: Standard scrollTo usage often results in errors

[ctrlplusb]

Current behavior:

Running the example code, which performs a simple scrollTo often results in an error stating that multiple elements cannot be scrolled.

Desired behavior:

Don't error, and scroll the page. 🤡

How to reproduce:

Run the example code.

Test code:

  context('Page Scroll', () => {
    it('should work', () => {
      cy.visit('https://www.theguardian.com/uk')
      cy.scrollTo('0%', '35%')
    })
  })

Additional Info (images, stack traces, etc)

• Operating System: Mac OS 10.12.6
• Cypress Version: 1.0.2
• Browser Version: Chrome 61

[jennifer-shehane]

Verified this is bug.

Code for this command can be found here: https://github.com/cypress-io/cypress/blob/develop/packages/driver/src/cy/commands/actions/scroll.coffee

My first impression is that we are either:

1. Not testing this command on a website with multiple windows (iframes)
2. Not passing the window subject correctly to the scrollTo command.

[binaryst4r]

Any updates to this?

[omaotzu]

Also window.scrollTo isnt cross browser supported

https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollTo

[jennifer-shehane]

The implementation actually uses jQuery scrollTo, which I'd have to look back into to remember their implementation of.

[samuelmartineau]

@ctrlplusb You could temporarily use vanilla js before having a real fix on scrollTo

cy.window().then(win => {
  win.scrollTo('0%', '35%');
})

[jennifer-shehane]

I'm no longer able to get this code example working. Can anyone provide a basic example of this scroll bug?

[ca-pli]

This is because window.length is equal to the number of iframes on the page, causing above assertion error if the page has iframe.

[Kjir]

I reproduced it easily in my project by just having a google map on the page: it will create an iframe and the previously existing cy.scrollTo(0, 1); suddenly breaks.
We worked around it by not displaying the map on the e2e tests, not ideal, but does the job...

[Kjir]

Here is a simple reproduction script:

describe('ScrollTo with iframe', () => {
  it('does not scroll', () => {
    cy.visit('https://www.nytimes.com');
    cy.scrollTo('bottom');
  });
});

[jennifer-shehane]

Thanks @Kjir, I can recreate this again.

It may be trying to scroll all windows within the page, so errors when iframes. This is a complete guess though.

[jayeshhpl]

Are there any other ways to scroll the page or please atleast fix this issue

[jennifer-shehane]

The key to this issue was here: https://github.com/cypress-io/cypress/issues/751#issuecomment-465876618

This is because window.length is equal to the number of iframes on the page, causing above assertion error if the page has iframe.

This was fixed in https://github.com/cypress-io/cypress/pull/4397 and released in 3.3.2