Inconsistent event casing for render functions

[seanogdev]

Version

3.0.0

Reproduction link

https://codesandbox.io/s/nervous-surf-f5lbs

Steps to reproduce

Create a render function that recieves a custom event. In eslint-plugin-vue & the docs you recommend to use kebab case for events that are emitted.

This causes some friction for me when using render functions as when listening for those events in the prop arg of h we need to prefix the event name with on & the name of the event to listen to.

However I looked at the source and the only transformation done is that the first letter of the event is capitalised. This means that kebab-case events (as recommended) would need to be listened to as onEvent-emitted.

What is expected?

That the casing would adhere to either camel or kebab case listening for events & not combining both.

What is actually happening?

Its a mixture of both. onTest-Event is the key required rather than either on-test-event as specified in the component being emitted, or onTestEvent to avoid the need to wrap the event key in quotes.

---

I think the docs should be updated to clarify this inconsistency. I'll create an issue in the docs repo to talk about this once this has been clarified

[posva]

I think the only one expected to work on a render function should be onTestedEvent.
We should probably also warn like in Vue 2 for in-DOM templates

[shadowings-zy]

I think the only one expected to work on a render function should be onTestedEvent

I am agree with you, and I think onTest-Event worked is weird. So I fixed it in PR #2278