Steps to reproduce: - Open the following URL in nightly data:text/html,<div style="display:flex;width:400px;">this is just a text node that will be wrapped in an anonymous flex item element</div> - Open the inspector - Click on the [Flex] badge in the inspector Expected result: the text node is a flex item (well, really it's wrapped in an anonymous block container), so it should be highlighted as such. Actual result: only the first line of text is being highlighted, and depending on where the text wraps, there might be some justify-content area being highlighted where it should not. Indeed, the anonymous container wrapping the text node takes all of the 400px that is available, so there really is no gap around the item. It only appears to be one because of the way we currently highlight flex items. I'm guessing we use getBoxQuads and default to highlighting the first quad returned. That will always work fine for actual ELEMENT_NODE items, but for TEXT_NODE items, we will probably need to use getBoundingClientRect or similar. The thing is, this doesn't work on text nodes.
This shows that only the first line is highlighted, and that there is some unwanted gap being highlighted at the end of the container.
7 months ago
Priority: -- → P2
7 months ago
Assignee: nobody → mratcliffe
Status: NEW → ASSIGNED
Duplicate of this bug: 1505079
Depends on: 1505578
Depends on: 1508297
Pushed by email@example.com: https://hg.mozilla.org/integration/autoland/rev/d71137840bd8 Text nodes that are flex items aren't highlighted correctly in the flexbox highlighter when they wrap r=gl
You need to log in before you can comment on or make changes to this bug.