Web Inconsistency: In some cases, text is unexpectedly collapsed

[rigdern]

As shown below, I have a couple of lines of text placed within some nodes which set flexGrow/flexShrink. One of the lines is unexpectedly invisible. Sorry I don't have a better description of the problem.

Here's a relatively small repro case I extracted from my team's app expressed using React Native components (there's a JSFiddle later):

<View style={{"position":"absolute","left":0,"right":0,"top":0,"bottom":0}}>
  <View style={{"alignSelf":"flex-start"}}>
    <View style={{"flexShrink":1}}>
      <Text>
        Top Text
      </Text>
    </View>
    <View>
      <View style={{"flexGrow":1}}>
        <Text>
          Bottom Text
        </Text>
      </View>
    </View>
  </View>
</View>

Expected Result

Both "Top Text" and "Bottom Text" are visible (JSFiddle: https://jsfiddle.net/pygpx2oq/):

Actual Result

Only "Bottom Text" is visible:

Reproed using a version of React Native (https://github.com/facebook/react-native/commit/4c7576e485973391d4042e694523dbfe70e49b50) which appears to be using a version of Yoga from today (March 8).

[woehrl01]

This is still reproducable in the latest RN. See https://snack.expo.io/r1V-wTceG