Skip to content

dom.isVisible does not take into account 0 width element #3171

@straker

Description

@straker

Consider the following dom:

<style>
  .target {
    width: 0;
    height: 50px;
    overflow-y: scroll;
  }

  .sub {
    height: 200px;
    width: 200px;
    background: blue;
  }
  </style>

  <div class="target">
    <div class="sub">Hello World</div>
  </div>

Calling axe.commons.dom.isVisible on the .target element results in true, even though visually the element is hidden. However, if we swap the width/height values, the element is then considered hidden. It seems our isVisible function only looks at height as a way to hide the element but does not consider width.

.target {
    width: 50px;
    height: 0;
    overflow-y: scroll;
  }

This is the cause of #2674

Metadata

Metadata

Assignees

No one assigned

    Labels

    fixBug fixesprA pr has been created for the issue

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions