Bad sorting of manual breadcrumbs?

1

I’m not sure if this is by design but what I’ve done is that I set config with autoBreadcrumbs options set like this:

        autoBreadcrumbs: {
                    'console': false,  // console logging
                }

This means that I’m handling my console output by myself, it looks like this:

        Raven.captureBreadcrumb({
                        message,
                        timestamp,
                        data: [{ clicked, initialReq }, { hasNavigator: Boolean(window.navigator) } ],
                        category: 'INFO',
                        type: 'console'
                    })

I keep my console messages in an array and then just before I track exception using Raven.captureException, I loop through them and call the code above. The timestamp attribute has the correct time of when it actually happened.

Which brings me to web interface where I can clearly see that the timestamp is correct but the ordering is wrong:

Image%202018-04-18%20at%204.52.56%20PM.png864×672 94.3 KB

Basically I can see that ui.click events are happening. On each of these events I print stuff into the console. It has the correct time but the manually captured breadcrumbs are at the bottom.

What is wrong? My configuration?

1 Like
2

OK so I figured out the solution to this. Honestly I think this is something Sentry (raven-js) could do by default:

Raven.config('xxx',   { dataCallback: (data) => {
                    if (!data.breadcrumbs.values) {
                        return data
                    }
                    const cleanBreadcrumbs = data.breadcrumbs.values.sort((prev, next) => {
                        if (prev.timestamp > next.timestamp) {
                            return 1
                        }

                        if (prev.timestamp < next.timestamp) {
                            return -1
                        }
                        return 0
                    })
                    data.breadcrumbs.values = cleanBreadcrumbs
                    return data
                }
})

With this I basically sort all the breadcrumbs being sent to the server by timestamp attribute.

3

Good investigation. We’re going to address this in the sentry UI! https://github.com/getsentry/sentry/pull/8397