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.

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

.should("be.visible") doesn't interpet elements with " style='transform: scale(0,0)' " correctly #723

garrett-thompson opened this issue Oct 10, 2017 · 3 comments · Fixed by #5590 · May be fixed by ngChile/ngx-devkit-cypress-builder#20 or qsays/grafana#1


Copy link

@garrett-thompson garrett-thompson commented Oct 10, 2017

Current behavior:

.should('be.visible') recognizes elements with style="transform: scale(0,0)" as being visible.

Desired behavior:

.should('be.visible') should determine that elements with style="transform: scale(0,0)" are actually not visible

How to reproduce:

  1. create an element on a page that has style="transform: scale(0,0)"
  2. write test that checks that element's visibility like so: cy.get('#el').should('be.visible');

Additional Info (images, stack traces, etc)

screen shot 2017-10-10 at 4 08 01 pm

  • Operating System: Mac OS Sierra
  • Cypress Version: 1.0.1
  • Browser Version: Chrome 61
@cypress-bot cypress-bot bot added the stage: ready for work label Feb 19, 2019
@jennifer-shehane jennifer-shehane added difficulty: 1️⃣ stage: ready for work and removed stage: ready for work labels Feb 19, 2019
Copy link

@jennifer-shehane jennifer-shehane commented Jun 11, 2019

Can recreate with following code. The span should clearly not be visible as it cannot be seen.


<!DOCTYPE html>
  <div style="transform: scale(0,0)">
    <span id="transform-scale">TRANSFORMERS</span>

spec file

it('should not be visible', function () {


Added a failing test here: #4421

jennifer-shehane added a commit that referenced this issue Jun 12, 2019
jennifer-shehane added a commit that referenced this issue Jun 19, 2019
* Add failing test case for visible element within overflow hidden then position absolute element.

Addresses #4395

* Write failing test case for when parent is flex and overflow hidden with el outside bounds

Addresses #4161

* Wrote failing test for visibility outside of clip-path

Addresses #1178

* Add failing tests for transform scale

Addresses #723

* Add failing test for backfact-visibility hidden example

* cs -> js fixes

* Add more specific error when el is not element

* Always return as visible when checking html or body

* Add comments + rename methods to be more exact

* Add case for isHidden when visibility is collapse

* Add failing test cases for visibility issues

* Add comment about how ensureVisibility works under the hood

* Add checks and tests for opacity: 0 to be hidden

* Simplify if/case statements to be more readable

* Expand check for offset parents to also check children of ancestor for positioning attributes

close #4395
close #755

* Fix issue where els with parents with absolute position inside overflow hidden would be calculated as not visible

* comment out opacity checks for patch release

* Add more tests around new visibility assertions

- Add case to make sure display none is not on the option or optgroup

* Fix failing assertion - where el was undefined when looking for visibiliyt

* remove commented out code involving opacity 😬
@cypress-bot cypress-bot bot added stage: work in progress and removed stage: ready for work labels Nov 4, 2019
@cypress-bot cypress-bot bot added stage: needs review stage: work in progress and removed stage: work in progress stage: needs review labels Nov 26, 2019
@cypress-bot cypress-bot bot added the stage: pending release label Dec 5, 2019
Copy link

@cypress-bot cypress-bot bot commented Dec 5, 2019

The code for this is done in cypress-io/cypress#5590, but has yet to be released.
We'll update this issue and reference the changelog when it's released.

@cypress-bot cypress-bot bot removed the stage: needs review label Dec 5, 2019
Copy link

@cypress-bot cypress-bot bot commented Dec 12, 2019

Released in 3.8.0.

@cypress-bot cypress-bot bot removed the stage: pending release label Dec 12, 2019
@cypress-io cypress-io locked as resolved and limited conversation to collaborators Dec 16, 2019
@cypress-io cypress-io unlocked this conversation Dec 18, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment