<Text>{[React.createElement(() => null)]}</Text> trigger a totally unexpected error

Is this a bug report?

Yes

Have you read the Contributing Guidelines?

Yes

Environment

Sorry but in my current project, react-native info does not exist yet (0.42). This my bug is reproducible on Expo SDK 0.22 (so react-native 0.49) on both iOS and Android so my platform informations won’t help.

Steps to Reproduce

Create a component with a Text that have an array of children. One of the children is a component that in my case, might returns null. Easiest thing to reproduce is to throw in any project

<Text>{[React.createElement(() => null)]}</Text>

Expected Behavior

I expect the Text to just render nothing, like a null value normally does.

Actual Behavior

As we are speaking, this code trigger an fatal error (actually in production release, this can even crash your app.

The fatal error is not even appropriate as it says:

Views nested within a <Text> must have a width and height.

It can be very hard to debug in a big codebase.

This can looks like an edge case, but at the same time I am really surprised of this bug.

Reproducible Demo

https://snack.expo.io/@moox/text-with-null-components

Just load this on expo and you will get a white page instead of a “Test” string in the very top left corner.

[MoOx]

@cdlewis not directly removed as there is now <ImageBackground> that allows the same behavior as Image was offering. So not sure that’s a good idea to not give the ability to allow children to Text. For my experience, it’s very useful to be able to use components in a Text. A simple example I see is i18n.

[stale[bot]]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.