Cypress: position sticky and flex, cypress scrolls to the end of page to access element

[RomanHotsiy]

• Operating System: macOS High Sierra 10.13.3
• Cypress Version: 2.1.0
• Browser Version: Chrome 59

Is this a Feature or Bug?

Bug

Current behavior:

When using position: sticky and display: flex combination cypress gets mad when trying to access element inside sticky element:

It scrolls to the end of the page before performing any operations on the element while it is not required as the element is visible and accessible.

Desired behavior:

Should access elements without scrolling

How to reproduce:

https://github.com/RomanGotsiy/cypress-test-tiny

Just run npm run cypress:open and select the only available suite.
There are three tests there:

• type into the input
• click on the link
• both but with {force: true} which works as expected

[jennifer-shehane]

Yup, we've had some fun issues with visibility. Thanks for taking the time to create a reproducible example. It helps a lot!

[RomanHotsiy]

😱 Most of them seem to be not fixed by ages!
If you could point me where to start from I'd like to try to fix this issue myself.

UPD: no need. I have narrowed it down to ensureElementIsNotAnimating myself

[RomanHotsiy]

@jennifer-shehane managed to fix it 🎉 (https://github.com/cypress-io/cypress/pull/1478).

The hardest part was CoffeScript 😖

[OrganicCat]

I have a similar issue. I'm using Kendo Grid and the dropdowns are generated and then fixed to the element you clicked.

Cypress scrolls down to the bottom of my page, even though the area to be typed in is visible at the top.

A SECONDARY issue is that when coupled with .type() this SOMETIMES makes the dropdown vanish, making every test thereafter fail. This behavior is inconsistent and frustrating, because sometimes the scrolling will decide to close the dropdown and sometimes not.

This makes testing custom dropdowns in Kendo Grid almost impossible.

[brian-mann]

@OrganicCat you don't test kendo dropdowns like a real user. You can just programmatically control and interact with them thereby avoiding the entire plague of trying to "act like a real user" when there's not really any reason to.

Since kendo is a 3rd party library you expect it to behave correctly and there's no real reason in trying to mimic how a user would interact with it. As long as you just simply programmatically open, select, and close it, you can accomplish automation with 100% guarantees it will always work.

[brian-mann]

Released in 3.0.2.