How to listen to custom element events in Vue?

[shadow-light]

I'm using custom elements (specifically Material Web Components) but I can't figure out how to listen to events from custom elements using the usual v-on syntax.

The following doesn't work:

<mwc-drawer ref='drawer' v-on='{"MDCDrawer:opened": opened}'>

Where as this does:

onMounted(() => {
    drawer.value.addEventListener('MDCDrawer:opened', () => {
        console.log('opened')
    })
})

Does Vue only listen to native events rather than custom ones when it thinks it is a native element (but actually a custom element)?

(already asked on Stack Overflow)