Subscribe on changes!

Regression: event with name in camel case won't be fired (eg. onMouseEnter [not ok], onMouseenter [ok])

avatar
Feb 25th 2021

Version

3.0.6

Reproduction link

https://codesandbox.io/s/event-case-306-08jke?file=/src/index.ts

Steps to reproduce

3.0.6 https://codesandbox.io/s/event-case-306-08jke?file=/src/index.ts not ok

3.0.5 https://codesandbox.io/s/event-case-305-hkt6f?file=/src/index.ts ok

What is expected?

onMouseEnter should be called

What is actually happening?

onMouseEnter is not called

This may break some libraries which used to add event handlers in js/jsx/ts rather than in template.

avatar
Feb 25th 2021

I would not rate this a regression, rather the 3.0.5 behaviour was a side-effect of a bug.

Intended behaviour: camelCased Events translate into kebap-case events, i.e.:

onMouseEnter -> mouse-enter onMouseenter-> mouseenter

The DOM event is called mouseenter, not mouse-enter, hence onMousEnter is not a valid DOM event to apply.

It still worked in 3.0.5 by accident, but was fixed with this PR: https://github.com/vuejs/vue-next/pull/2847/files