I'm trying to debug why <2% of my users receive "TypeError: Failed to fetch" on a given endpoint. I'm seeing this error in Sentry, but I cannot reproduce it.
What I've figured out is that browsers will print a detailed error line in the console about what the actual error is (CORS policy, net::ERR_FAILED, net::ERR_INTERNET_DISCONNECTED, etc.), but there is no way to actually read this from the application. All I get is "TypeError: Failed to fetch", no matter what I try in JS.
I believe the "replay" session debug tools won't be able to capture this either.
Is there a way in JS to capture the detailed messages, or are they pretty much only visible on the client's screen if the console is opened?
At least for Chromium-based browsers, looking at the source code, I can see that these are purposely only logged directly in the devtools console (code here), so there isn't really a way to get that information from JavaScript. It seems like you are out of luck.
In any case, at least you should know some of the details of the request that is failing if you catch that error, like URL, method, and so on. You could try reproducing your users' setup (same browser and version, same operating system, etc.). If that does not work, you may want to consider politely asking some of your users that you know are experiencing this issue to look at the console for you.