[React Native] flexWrap has definite issues

[idibidiart]

Not sure if this is Yoga related, so feel free to close if it's not, but the wrapping behavior with flexWrap has what seems to be a very strange behavior that cannot be explained away by referring to flexbox spec:

facebook/react-native#8960 (comment)

I'll add more examples later, but FYI in case this is am issue with the underlying Yoga layout algorithm

[idibidiart]

Here is a separate issue with a Snack (Expo running on web) that reproduces it:

facebook/react-native#14429

I suspect this is a layout framework issue.

[woehrl01]

Even so I can reproduce that behaviour in Expo (https://snack.expo.io/S1tFa_Vmb). The layout is calculated correctly with Yoga on the master with the same layout:

<div id="wrap_nodes_test" style="flex-direction: row; flex-wrap: wrap; width: 350px;">
  <div style="margin: 15px; width: 10px;"></div>
  <div style="margin: 15px; width: 10px;"></div>
  <div style="margin: 15px; width: 300px;"></div>
  <div style="margin: 15px; width: 20px; height: 20px;"></div>
</div>

As Expo uses RN 0.43 and your issue states that you also use this version, I'd suggest using a more up to date version of RN+Yoga, or even compile one with the latest Yoga version on your own. I would be happy if you could verify if you experience the same problem with the latest yoga revision. As I don't use RN on my own, I can't help you with that.

[woehrl01]

@idibidiart I'd like to give a a heads up. I tried this with the latest react native and the layout works as expected there 👍 .