callstack / callstack/masked-view

[iOS][Fabric] MaskedView crashes when rendered inline, inside <Text> subtree

Open
#248 2 comments 1 reaction 0 assignees View on GitHub
Dominant language
JavaScript
Stars
1.2k
Forks
131
PR merge metrics
No merged PRs in 30d

Description

## Environment

Expo SDK: 54
newArch: True
React-Native: 0.81.6
React: 19.1.4
Platform: iOS `18.x.x` and `26.x.x`

## Description

When `@react-native-masked-view/masked-view` is rendered inside a `` subtree on iOS with Fabric / New Architecture enabled, the app crashes with a native assertion instead of failing gracefully.

The assertion I see is:

```txt
*** Assertion failure in -[RCTComponentViewFactory createComponentViewWithComponentHandle:](), /Users/runner/work/react-native/react-native/packages/react-native/React/Fabric/Mounting/RCTComponentViewFactory.mm:217
```

## Summary

`@react-native-masked-view/masked-view` crashes on iOS with React Native New Architecture / Fabric when `MaskedView` is rendered inside a `` subtree.

This is the pattern that triggers it:

```tsx

Prefix highlighted text

```

## Reproducible Demo

```tsx
// GradientText.tsx
import React from 'react';
import { SafeAreaView, Text, StyleSheet } from 'react-native';
import MaskedView from '@react-native-masked-view/masked-view';
import { LinearGradient } from 'expo-linear-gradient';

function GradientText({ children }: { children: string }) {
return (

{children}

}
>


{children}



);
}

const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#140034',
padding: 24,
},
title: {
color: '#fff',
fontSize: 32,
fontWeight: '800',
lineHeight: 40,
textAlign: 'center',
},
gradientText: {
fontSize: 32,
fontWeight: '800',
lineHeight: 40,
},
gradient: {
flexDirection: 'row',
},
hidden: {
opacity: 0,
},
});
```

Works fine on android.

Contributor guide

Open the contributing guide

Research direction

Start by reproducing the provided GradientText and MaskedView example on iOS with Fabric/New Architecture, then trace the @react-native-masked-view/masked-view rendering entry point involved in a subtree. Done means the inline case no longer triggers the RCTComponentViewFactory assertion and has a regression check.

Written by the indexing model from the issue text.

Assessment

Tech stack
ios, react-native
Domain
mobile
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.