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

fix: Update visibility check for position: fixed combined with pointer-events: none #8095

Merged
merged 7 commits into from
Jul 29, 2020

Conversation

panzarino
Copy link
Contributor

@panzarino panzarino commented Jul 27, 2020

User facing changelog

Fixes a bug where position: fixed combined with pointer-events: none can cause an element to be reported as hidden when it is actually visible

Additional details

document.elementFromPoint ignores elements that have pointer-events: none, and gets the element underneath instead. Previously, we would just check that that element was the same element or a descendant of the one we were trying to check. This adds another check if the element is a parent, which covers the case that the click fell through (and due to the other checks beforehand, does not accidentally misreport a hidden element as visible).

PR Tasks

  • Have tests been added/updated?
  • Has the original issue been tagged with a release in ZenHub?
  • Has a PR for user-facing changes been opened in cypress-documentation?
  • Have API changes been updated in the type definitions?
  • Have new configuration options been added to the cypress.schema.json?

@cypress-bot
Copy link
Contributor

cypress-bot bot commented Jul 27, 2020

Thanks for taking the time to open a PR!

@cypress
Copy link

cypress bot commented Jul 27, 2020



Test summary

7914 0 130 2


Run details

Project cypress
Status Passed
Commit 8f12395
Started Jul 28, 2020 4:47 PM
Ended Jul 28, 2020 4:53 PM
Duration 05:58 💡
OS Linux Debian - 10.1
Browser Multiple

View run in Cypress Dashboard ➡️


This comment has been generated by cypress-bot as a result of this project's GitHub integration settings. You can manage this integration in this project's settings in the Cypress Dashboard

@panzarino panzarino changed the title Update visibility check for pointer-events none fix: Update visibility check for position: fixed combined with pointer-events: none Jul 27, 2020
@panzarino panzarino marked this pull request as ready for review July 27, 2020 21:21
Copy link
Member

@jennifer-shehane jennifer-shehane left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Fixes the original issue. 👍 Just had some comments about the tests.


this.$parentPointerEventsNone = add(`\
<div style="pointer-events: none;">
<span style="position: fixed; top: 20px;">parent pointer-events: none</span>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can't tell this HTML from the HTML below it on the page since it's the same content.

Suggested change
<span style="position: fixed; top: 20px;">parent pointer-events: none</span>
<span style="position: fixed; top: 20px;">parent pointer-events: none; top: 20px</span>

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should be updated now with the self-contained covering element.

Copy link
Member

@jennifer-shehane jennifer-shehane left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great! Much clearer now in the tests.

@jennifer-shehane
Copy link
Member

Ignoring percy visual change as it is a timing issue - the collapsible is not fully opened, so that'll need to be addressed elsewhere.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
2 participants