Inconsistent sizing of flex:1 child of a flex:0 parent

[nichtverstehen]

I have searched existing issues and this is not a duplicate to the best of my knowledge.

Issues and Steps to Reproduce

Wrap a child T with flex: 1 in a parent with flex: 0 in a grandparent with fixed dimensions.

Essentially <View style={{width: 200, height: 200}}><View><Text style={{flex: 1}}>Foo</Text></View></View>.

React Native-based example here:
https://snack.expo.io/SyAwsCXrz

Expected Behavior

The child is sized to content, because its parent is non-growing.

See (expected) CSS behavior: https://jsfiddle.net/54bwp3qy/.

Actual Behavior

If the grandparent has alignItems: center, the child grows to the full height of the grandparent.
If the grandparent has alignItems: stretch, the child gets a height of 200.

Neither of the two outcomes are expected nor are consistent with browser's flexbox implementation. I couldn't quite wrap my head around what is the correct according to the flex spec.

Why this is useful

I'd like the parent to be a generic wrapper and behave as one with its child for the purposes of the layout. The setting is explained in more details on StackOverflow:
https://stackoverflow.com/questions/48391114/react-native-component-to-wrap-a-child-in-a-layout-agnostic-way

Link to Code

https://snack.expo.io/SyAwsCXrz

[NickGerleman]

This seems likely related to React Native's usage of UseLegacyStretchBehaviour, which causes flex-basis to incorrectly be expanded, even for non-flexible containers. RN enables this for compatibility, but there is an effort to move away from it.