Image nested In Text with lineHeight specified overflows container

Description

An <Image> nested within <Text> with a lineHeight specified causes the image to overflow the parent container.

Workarounds attempted:

• Specifying a fixed height on the image
• Wrapping the image in a <View> with a fixed height and/or lineHeight
• Wrapping the Image in another <Text> with a fixed height and/or lineHeight
• Wrapping the image in another <Text> with lineHeight set to undefined or null

Expected behaviour:

To be able to nest images in Text with a non-default lineHeight.

(Please let me know if any more details are required for this issue. Thanks!)

Steps to reproduce

Please see expo snack.

Code below:

export default function App() {
  return (
    <View style={styles.container}>
      <View style={styles.box}>
        <Text style={styles.text}>
          Hello
          <Image style={styles.image} source={require('./assets/snack-icon.png')} />
        </Text>
      </View>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    backgroundColor: '#ecf0f1',
    padding: 8,
  },
  box: {
    backgroundColor: 'red',
  },
  text: {
    backgroundColor: 'blue',
    // lineHeight: 20,
  },
  image: {
    height: 300,
  }
});

React Native Version

0.76.0

Affected Platforms

Runtime - iOS, Runtime - Android

Output of npx react-native info

Please see expo snack.

Stacktrace or Logs

N/A

Reproducer

https://snack.expo.dev/@tomkelsey/image-nested-in-text-lineheight-bug

Alternative reproducer:
https://github.com/OzymandiasTheGreat/rn-view-in-text-bug

Screenshots and Videos

Without lineHeight specified:

With lineHeight specified:

Beginne mit der App-Komponente und den Styles im bereitgestellten Expo Snack und im alternativen Reproducer, und vergleiche anschließend das Layout mit und ohne ein nicht standardmäßiges lineHeight auf iOS und Android. Erledigt ist die Aufgabe, wenn ein in Text verschachteltes Image auf beiden Plattformen innerhalb des übergeordneten Containers bleibt.