Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

.scrollTo fails if overflow set to overlay #991

Open
dwelle opened this issue Dec 1, 2017 · 5 comments
Open

.scrollTo fails if overflow set to overlay #991

dwelle opened this issue Dec 1, 2017 · 5 comments
Labels
E2E Issue related to end-to-end testing pkg/driver This is due to an issue in the packages/driver directory stage: ready for work The issue is reproducible and in scope topic: scrolling ↕️ Triaged Issue has been routed to backlog. This is not a commitment to have it prioritized by the team. type: unexpected behavior User expected result, but got another

Comments

@dwelle
Copy link

dwelle commented Dec 1, 2017 •
edited by jennifer-shehane
Loading

Current behavior:

If a container has overflow-y: overlay, then calling .scrollTo("bottom") fails on:

CypressError: Timed out retrying: cy.scrollTo() failed because this element is not scrollable:

I'm aware that overlay value is non-standard, but I feel like it shouldn't cause issues with cypress.

Either way, putting it here for reference for other people.

workaround:

.then( $elem => {
    $elem[0].scrollTop = 10000;
})
  • Operating System: win7
  • Cypress Version: 1.1.2
  • Browser Version: canary
@jennifer-shehane jennifer-shehane added pkg/driver This is due to an issue in the packages/driver directory type: unexpected behavior User expected result, but got another labels Dec 1, 2017
@Kittinutz
Copy link

need to solve can't click element when use

overflow:overlay

@jennifer-shehane jennifer-shehane added the stage: ready for work The issue is reproducible and in scope label Oct 20, 2018
@mitschmidt
Copy link

Experiencing the same issue with cypress 4.3.0. The element is obviously scrollable, it seems only the check performed by cypress has to be adjusted here?

@jennifer-shehane
Copy link
Member

jennifer-shehane commented Aug 18, 2020 •
edited
Loading

Reproducible example:

index.html

<html>
<body>
  <div id="scrollable" style="overflow-y: overlay; height: 2000px; background-color: red;"></div>
</body>
</html>
it('test', () => {
  cy.visit('index.html')
  cy.get('#scrollable').scrollTo('bottom')
})

Screen Shot 2020-08-18 at 5 35 58 PM

Why

The isScrollable is failing the check here: https://github.com/cypress-io/cypress/blob/develop/packages/driver/src/dom/elements.ts#L863:L863

The clientHeight is equal to the scrollHeight in this situation.

Screen Shot 2020-08-18 at 5 44 40 PM

I think this is precisely because of how it's implemented:

Behaves the same as auto, but with the scrollbars drawn on top of content instead of taking up space. Only supported in WebKit-based (e.g., Safari) and Blink-based (e.g., Chrome or Opera) browsers.

Even if it did pass this check, it wouldn't pass the next check, which is that we make sure the overlay is equal to scroll or auto.

This will be pretty low priority for us to implement a fix for since this overlay property is deprecated.

@jennifer-shehane jennifer-shehane mentioned this issue Oct 9, 2020
Closed
2 tasks
@cypress-app-bot
Copy link
Collaborator

This issue has not had any activity in 180 days. Cypress evolves quickly and the reported behavior should be tested on the latest version of Cypress to verify the behavior is still occurring. It will be closed in 14 days if no updates are provided.

@cypress-app-bot cypress-app-bot added the stale no activity on this issue for a long period label May 18, 2023
@scorphious
Copy link

scorphious commented May 29, 2023 •
edited
Loading

This is still an issue in the latest version - these days Overlay is very well supported by browsers as well, no reason Cypress shouldnt.

@nagash77 nagash77 added E2E Issue related to end-to-end testing Triaged Issue has been routed to backlog. This is not a commitment to have it prioritized by the team. and removed stale no activity on this issue for a long period labels May 30, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
E2E Issue related to end-to-end testing pkg/driver This is due to an issue in the packages/driver directory stage: ready for work The issue is reproducible and in scope topic: scrolling ↕️ Triaged Issue has been routed to backlog. This is not a commitment to have it prioritized by the team. type: unexpected behavior User expected result, but got another
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
7 participants
@nagash77 @jennifer-shehane @dwelle @Kittinutz @scorphious @mitschmidt @cypress-app-bot