Open kevinleedrum opened 1 year ago
Hi @kevinleedrum , thanks for letting us know about this. Also, thanks so much for the reproduction! Visibility is one of the trickiest things we have to juggle (it's pretty complex for anyone else stumbling across this comment).
I can confirm this is a hole in our logic so I'll get this passed along to the team to look into, but it might be a little while before we have time to work it. If anyone in the community would like to take a stab at improving this logic a good place to start would be packages/driver/src/dom/visibility.ts
.
@kevinleedrum See also my discussion here https://github.com/cypress-io/cypress/discussions/23900 which is also about display: contents
. My code samples revolve around the problem on how to make sure that selectors in page objects are pointing to the correct element but I could remove some hacky code if the "display: contents" visibility check would be different (i.e. check child elements for visibility as you suggested as well)..
I am also experiencing this, the CSS property overflow-x is not found, however, if I will assert that it exists, it passed.
hi can you pls guide me how i can start this means how i can take to this my local machine i dont know anything i know how to fork but not able to understand how to start this and go for pull request
Hi @developernarendra , thanks for showing an interest in contributing to Cypress! I would recommend starting with our Contributors Guide. That document includes (or links to) information on how to clone Cypress locally, build it, make changes, and finally open a PR.
Hello, currently working on this since I reproduced locally with latest and started to have a good idea on how to fix.
Should b fixed in https://github.com/cypress-io/cypress/pull/29680
Current behavior
If an element has an ancestor with both
overflow: hidden
anddisplay: contents
, Cypress will think that element is not visible because Cypress sees the ancestor element as having zero width and height (and no overflow).Desired behavior
Although it is silly to combine
overflow: hidden
withdisplay: contents
, and I can easily work around this issue in the app being tested, the child elements are technically visible, so ideally this should be fixed in cypress.Cypress should give elements with
display: contents
a pass when checking that the element has a width and height since those elements don't really render a box to measure. The visibility check would then fall to the next descendent.Test code to reproduce
See https://github.com/kevinleedrum/cypress-test-tiny. The markup is in
index.html
;npm run cypress:run
should reproduce the failure.The relevant bit is that the
<section>
below will be seen as NOT visible, even though it is.Cypress Version
12.1.0
Node version
v14.17.0
Operating System
macOS 13.0.1
Debug Logs
Other
No response