javascriptreactjsreact-adminbug-trackingrollbar

How to track errors in the react-admin dataProvider


I've installed Rollbar, a bug tracker, into my react-admin app and it works great for uncaught errors, but errors thrown by the dataProvider are not being sent to Rollbar.

I think errors thrown by the dataProvider are caught somewhere within react-admin and a notification is shown to the user so they are no longer "uncaught". Is there a simple way to get these errors sent to Rollbar?

For example, my dataProvider looks like this

const dataProvider = (type, resource, params) => {
    throw new Error('foo')
}

Rollbar is installed with a single script tag at the top of the page. See https://docs.rollbar.com/docs/browser-js


Solution

  • react-admin is catching the provider error because it's trying to display an appropriate user-facing error message for it.

    I'm not familiar with Rollbar, but according to the docs, it should be possible to explicitly report errors with handleUncaughtException(). So maybe try something like this:

    const dataProvider = (type, resource, params) => {
        try {
            // data provider code
        }
        catch (err) {
            rollbar.handleUncaughtException('data provider error', null, null, null, err);
            throw err; // let react-admin display its error message
        }
    }
    

    That's assuming a rollbar global is available, of course – not sure if it actually works that way.