Skip to content

Commit

Permalink
fix errorInfo metadata in Vue 3.4+
Browse files Browse the repository at this point in the history
  • Loading branch information
yousif-bugsnag committed Jan 3, 2024
1 parent 4d8aa3f commit 6b03a6d
Show file tree
Hide file tree
Showing 2 changed files with 33 additions and 2 deletions.
7 changes: 6 additions & 1 deletion packages/plugin-vue/src/vue.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,13 @@ module.exports = (app, client) => {
const handledState = { severity: 'error', unhandled: true, severityReason: { type: 'unhandledException' } }
const event = client.Event.create(err, true, handledState, 'vue error handler', 1)

// In Vue 3.4+, the info param is a link to the Vue error docs in prod, so we need to extract the error code from it
// https://github.com/vuejs/core/pull/9165/commits/c261beab2c0a26e401f2c3d5eae2e4c41de6fe4d
const code = typeof info === 'string' && info.indexOf('-') > 0 ? info.split('-')[1] : info
const errorInfo = ErrorTypeStrings[code] || info

event.addMetadata('vue', {
errorInfo: ErrorTypeStrings[info] || info,
errorInfo,
component: vm ? formatComponentName(vm, true) : undefined,
props: (vm && vm.$options) ? vm.$options.propsData : undefined
})
Expand Down
28 changes: 27 additions & 1 deletion packages/plugin-vue/test/index.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,32 @@ describe('bugsnag vue', () => {
errorHandler(new Error('oops'), { $parent: null, $options: {} }, 1)
})

it('handles URL info paramater', done => {
const mockVueApp: Vue3App = {
use: (plugin) => {
plugin.install(mockVueApp)
},
config: { errorHandler: undefined }
}
const client = new Client({ apiKey: 'API_KEYYY', plugins: [new BugsnagVuePlugin()] })
// eslint-disable-next-line
mockVueApp.use(client.getPlugin('vue')!)
client._setDelivery(client => ({
sendEvent: (payload) => {
expect(payload.events[0].errors[0].errorClass).toBe('Error')
expect(payload.events[0].errors[0].errorMessage).toBe('oops')
expect(payload.events[0]._metadata.vue).toBeDefined()
expect(payload.events[0]._metadata.vue.component).toBe('MyComponent')
expect(payload.events[0]._metadata.vue.errorInfo).toBe('render function')
done()
},
sendSession: () => {}
}))
expect(typeof mockVueApp.config.errorHandler).toBe('function')
const errorHandler = mockVueApp.config.errorHandler as unknown as Vue3ErrorHandler
errorHandler(new Error('oops'), { $options: { name: 'MyComponent' } }, 'https://vuejs.org/errors/#runtime-1')
})

it('tolerates unmappable info paramater', done => {
const mockVueApp: Vue3App = {
use: (plugin) => {
Expand All @@ -106,7 +132,7 @@ describe('bugsnag vue', () => {
errorHandler(new Error('oops'), { $options: { name: 'MyComponent' } }, 'abcz')
})

it('tolerates tolerates anonymous components', done => {
it('tolerates anonymous components', done => {
const mockVueApp: Vue3App = {
use: (plugin) => {
plugin.install(mockVueApp)
Expand Down

0 comments on commit 6b03a6d

Please sign in to comment.