You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository was archived by the owner on Sep 22, 2022. It is now read-only.
This function fails to score elements that are dependents of a closed details as not visible.
Why? Previously (and in other browsers) elements that were dependents of a closed details had no bounding rect: ie el.offsetWidth and el.offsetHeight both returned 0. However, a recent change in Chromium (https://bugs.chromium.org/p/chromium/issues/detail?id=1276028) means that descendants of a closed details now do have bounding rects.
Solutions
There are a few options:
1. Add code to check if the element is a child of a closed dialog.
we can see this approach in effect in the focus-trap library:
Activity
theinterned commentedon Feb 22, 2022
Discovered this in #72. I spent a bit of time trying to debug but was unsuccessful and bailed.
Skip failing test for managing focus
theinterned commentedon Mar 1, 2022
With a git bisect @koddsson and I isolated this to #48 it appears that tests were passing at the time so this is likely a change to Chrome since then.
theinterned commentedon Mar 1, 2022
@koddsson and I traced this to the
visibile
function:details-dialog-element/src/index.ts
Lines 36 to 42 in 2aa3a08
This function fails to score elements that are dependents of a closed
details
as not visible.Why? Previously (and in other browsers) elements that were dependents of a closed
details
had no bounding rect: ieel.offsetWidth
andel.offsetHeight
both returned0
. However, a recent change in Chromium (https://bugs.chromium.org/p/chromium/issues/detail?id=1276028) means that descendants of a closeddetails
now do have bounding rects.Solutions
There are a few options:
1. Add code to check if the element is a child of a closed dialog.
we can see this approach in effect in the
focus-trap
library:https://github.com/focus-trap/focus-trap/blob/0a5ce1bfd913edc4410aadfc98b1583de9d034cf/docs/demo-bundle.js#L406-L411
2. Update the CSS of descendants of a closed dialog
@koddsson asked about our specific use case in the chromium issue and received a useful suggestion to simply set the descendants of a closed details to
display: none
: