Fix test util to measure text properly based on flex direction #1768
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
Summary: Depending on the flex direction text will either be capped to the measured size or to the longest word, so I added that functionality Differential Revision: D67106199
joevilches
force-pushed
the
export-D67106199
branch
from
1c79694 to
7ef49a9
Compare
|
This pull request was exported from Phabricator. Differential Revision: D67106199 |
|
This pull request was exported from Phabricator. Differential Revision: D67106199 |
|
This pull request has been merged in 909e4be. |
|
@joevilches I don't think this is right. I believe the measure function should still return the size floored by the longest word size, but the parent container should override that size due to the max-width style (which probably is different for flexbox row vs. column due to Flexbox having a weird quirk of not applying min/max sizes to children when determining the flex base size in the main axis). As a general principle, the min- or max- content size of box is never affected by the parent's display mode (although the resultant size of the box may be). |
|
@nicoburns that makes sense thanks for commenting. I am curious how Yoga would yield the same results as chrome in this case, since it did seem like at some point we would need to measure with some smaller width than the longest word to get the correct height. I can take a look again, maybe the issue is something else. |
|
@joevilches I think I previously misunderstood this code (not helped by the fact I was trying to read it on my phone!). The width you are using does seem broadly correct to me with default styles. Although the way we deal with this in Taffy is by using (what Yoga calls) an "Exact" sizing constraint in the column case (depending on I think the reason this is (/seems to be) different for columns vs. rows is because The following HTML: <div style="display: flex;width: 50px;flex-direction: column;">
<div>
orheg irehg ireh girehg iorhioh iroegh
jhnreuighuirebghuierhguierbuigbreuibuebgiuerbgiuberuigberuibguirebg
righierhg ihe irogh eriohg iorehg ioerhg iorehg
</div>
</div>Results in: 
But if you add an 
|
Summary: Depending on the flex direction text will either be capped to the measured size or to the longest word, so I added that functionality
Differential Revision: D67106199