I have this in my Render method:

 <View style={{flexDirection:'row',}}>
                                
                                    
      <View style={{marginTop:15,}}>
                                        
            <HTMLView
                  renderNode={renderNode}
                  value={e["message"]["mess"].message}
            />
      </View>
  </View>

and also this some way down the markup:

{

      e["message"]["replies"] > 0 ?

      (
           <TouchableOpacity onPress={() => navigation.push("Poll Chat", {messageId : e["message"]["mess"].id, id: route.params.id, user:e["user"].firstname + " " + e["user"].lastname, uImage: e["user"].avatarImage, uN: e["user"].guid}) } style={{textAlign:'right',flex:1,}}><Text style={{textAlign:'right',marginTop:10,}}><MaterialCommunityIcons style={{textAlign:'right',marginRight:3,}} name="message-text-outline" color={"#bdbdbd"} size={8} /><Text style={{color:'blue',fontSize:8,textDecorationLine:'underline',width:200,marginTop:10,textAlign:'center',color:'#2E7D32',}}>{abbreviateNumber(e["message"]["replies"])} Replies</Text></Text></TouchableOpacity>
          )
          :
          (
               <TouchableOpacity onPress={() => navigation.push("Poll Chat", {messageId : e["message"]["mess"].id, id: route.params.id, user:e["user"].firstname + " " + e["user"].lastname, uImage: e["user"].avatarImage, uN: e["user"].guid}) } style={{textAlign:'right',flex:1,}}><Text style={{textAlign:'right',marginTop:10,}}><Text style={{color:'blue',fontSize:8,textDecorationLine:'underline',width:200,marginTop:10,textAlign:'center',color:'black', fontWeight:'bold',marginLeft:5,}}>Reply Here..</Text></Text></TouchableOpacity>
         )
      }

And this function to render the HTMLView:

function renderNode(node, index, siblings, parent, defaultRenderer) {
    console.log("node.name: " + node.name);
    if (node.name == 'iframe') {
      const a = node.attribs;
      console.log("a: " + youtube_parser(a.src));
      const iframeHtml = `<iframe src="${a.src}"></iframe>`;
      return (
        <View style={{height:200,width:windowWidth-40,backgroundColor:'#000000',paddingBottom:15,}}>
                <YoutubePlayer
                    height={200}
                    play={false}
                    videoId={youtube_parser(a.src)}
                    //onChangeState={onStateChange}
                />
                {/* <WebView source={{html: iframeHtml}} /> */}
                </View>
      );
    }
  }

When I remove the HTMLView Component that has the YouTube Video the TouchableOpacity works,
But when I add the HTMLView Component the TouchableOpacity Crashes without any error.

What’s happening why is this erroring without aby errors?

I want to allow YouTube Videos to appear, is there another way that using React-Native-HtmlView?

I tried with WebView but the same thing happens but its difficult to set the width and height of the WebView.