1489333 - Flex overlay sticks around after flex container becomes display:none

Status: RESOLVED WORKSFORME

(DevTools :: Inspector, defect, P3)

Description

[Daniel Holbert [:dholbert]]

STR:
 1. Load testcase.
 2. Click "flex" badge in Inspector panel to show flex overlay.
 3. Click the "Make display:none" button in the testcase.

EXPECTED RESULTS:
Overlay should go away when the element disappears.

ACTUAL RESULTS:
Overlay sticks around even though its content is gone (display:none'd).

Note: This bug seems to be specific to the flex overlay -- the grid overlay gives "expected results".

I ran into this in the wild, when using devtools' flexbox inspector to look at a video-thumbnail's title on https://www.youtube.com/ .  I activated the overlay, and then I clicked the video-thumbnail.  This makes YouTube set display:none on some ancestor & bring the video front-and-center. (It feels like a page-navigation, but it's not -- they just dynamically update the current page and use pushState to edit the URL, I think.)

I suspect we should fix this for the first simple version of flexbox inspector (and happily, we seem to already have a solution for this for the grid inspector, which I imagine we could apply to flex).  Hence, marking as blocking bug 1470379.

Comment 1

[Daniel Holbert [:dholbert]]

Attachment: testcase 1

Comment 2

[Daniel Holbert [:dholbert]]

Good news -- this seems to have been fixed in Nightly, presumably by one of the recent flex inspector changes.