Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is it possible to get the line number of an error in React Native?

I am writing a React Native app, and I find that the error messages that the iOS emulator generates never indicate the line in my code where the error occurred. In the screenshot below, I can see that this is a problem with the map() function in the Dashboard component, but since it doesn't give a line number, if there are multiple instances of map() in Dashboard, I don't know how to isolate which one is throwing the error. So my question is:

Can anyone explain why React Native doesn't indicate the line number in this scenario? Is this an inherent property of how React Native works and it will always be impossible to identify the given line (if so, please explain why in as much detail as possible)? Or is there a way I can build my app differently in order to show the line numbers of errors?

Thanks!

enter image description here

like image 300
gkeenley Avatar asked Jun 10 '19 15:06

gkeenley


People also ask

How do you get number of lines in React Native?

To determine number of lines of Text component with React Native, we can get it from the onTextLayout callback's parameter. to set numberOfLines to NUM_OF_LINES to restrict the number of lines to display. Then we set the onTextLayout prop to the onTextLayout function and get the number of lines displayed with e.

How do I check my errors in React Native?

First open Developer Tools in Simulator. Then press Command+D keyboard shortcut. It will open the developer tools. To debug the JavaScript code in Chrome, select "Debug JS Remotely" from the Developer Menu.

How do you catch a react error?

Error handling with Error Boundaries — For class components. Error boundaries are the most straightforward and effective way to handle errors that occur within your React components. You can create an error boundary component by including the life cycle method componentDidCatch(error, info) if you use class component.

How do you break line React Native?

To insert a line break into a Text component in React Native, we can add the '\n' character string. to add {'\n'} into the content of Text .


1 Answers

Answer is NO for most cases.

The screen you shared here is of very little use for knowing where error is coming from.

You can use react native debugger to get more info on state/props changes or any exceptions. Stack trace also will not be of much help. You can write your own global error handling function for dev environment. Also remember not all error are JS ones, some are thrown by native modules also.

You can also set breakpoints and do runtime debugging using sources tab or you can blackbox the whole script, whatever is suitable. Debugging is one of the major drawbacks of React Native

like image 167
Harshit Aggarwal Avatar answered Oct 13 '22 10:10

Harshit Aggarwal