Layout: alignItems and maxHeight incompatibility

[pstanton]

I've found that maxHeight is treated as height when the container has alignItems:"center".

Environment

snack.expo.io

Environment:
OS: Windows 10
Node: 9.0.0
Yarn: 1.3.2
npm: 5.5.1
Watchman: Not Found
Xcode: N/A
Android Studio: Version 3.0.0.0 AI-171.4408382

Packages: (wanted => installed)
react: 16.2.0 => 16.2.0
react-native: 0.53.0 => 0.53.0

^ however reproduced using snack

Steps to Reproduce

https://snack.expo.io/H1Ww4ctiG

The example i was working on when i noticed the issue is an auto-sizing section which scrolls if more than a certain height.

  render() {
    return (
      <View style={{ flex: 1, alignItems: 'center', justifyContent: 'flex-start', backgroundColor:"red" }}>
       <View style={{backgroundColor:"orange", maxHeight:200}}>
        <ScrollView contentContainerStyle={{backgroundColor:"yellow", flexGrow:0, padding:10}}>
          <Text style={{fontSize:18}}>
           Some content which could be short or long, in this example it is medium ;)
         </Text>
        </ScrollView>
       </View>
       <Text style={{fontSize:18, marginTop:10}}>some more content</Text>
      </View>
    );
  }

^ comment out/delete "alignItems:'center'" and it works

Expected Behavior

orange background should never be visible since the orange view should always bee the height of the child ScrollView. The expected behaviour can bee seen by removing the "alignItems:'center'" in the red view.

Actual Behavior

orange background is visible meaning the view is not shrunk to its content's height when the content is smaller than its 'maxHeight'.

[stale]

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as "For Discussion" or "Good first issue" and I will leave it open. Thank you for your contributions.

[pstanton]

reloaded the snack and it's still an issue.

[stale]

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as "For Discussion" or "Good first issue" and I will leave it open. Thank you for your contributions.

[pstanton]

how do i label? @hramos have re-tested and issue remains.

[hramos]

What would you like to re-label?

[pstanton]

as per bot. "For Discussion" or "Good first issue". i don't know what the strategy is with this project but it seems these admittedly minor issues seem to be routinely ignored. my opinion is it's better to document an issue and never fix it, then to never document it.

[thymikee]

@pstanton can you provide a web-based equivalent to prove that there's something wrong with RN implementation of Flexbox?

[cpojer]

Closing because there hasn't been an update in more than a week (and none for a long time before). Happy to reopen when a repo is provided but most likely this is a Yoga issue, not a React Native issue.