Vue-next: Emitting event with cabeb-case name format doesn't work

[boussadjra]

Version

3.0.2

Reproduction link

https://codesandbox.io/s/emit-with-camel-case-issue-tsqn0?file=/src/components/Child.vue

Steps to reproduce

I have a Child component in which I emit an event to the parent component Container with cabeb-case name format:

export default defineComponent({ name: "Child", emits: ["enlarge-text"], methods: { tryThis() { console.log("trying"); this.$emit("enlarge-text", "someValue"); }, }, });

in parent :

    <Child @enlarge-text="onEnlargeText" />
  ....
  methods: {
    onEnlargeText() {
      console.log("enlarging text");
    },
  },

What is expected?

i expect that the emitted event should be fired in parent component

What is actually happening?

this doesn't fire the event, but if I change the name to camelCase format it works fine

---

The linter doesn't accept the camelCase named event

I remarked this after trying to answer this question on Stackoverflow

[edison1105]

see #2429

[edison1105]

<Child @EnlargeText="onEnlargeText" />

works

[boussadjra]

<Child @EnlargeText="onEnlargeText" />

works

Yes it works but the linter raises a warning

[vhoyer]

it doesn't raise a warning for me :thinking:

[edison1105]

see https://jsfiddle.net/yyx990803/3scy68d5/1/

[boussadjra]

it doesn't raise a warning for me 🤔

@vhoyer i'm talking about the camelCase format which works but the linter raises a warning

[boussadjra]

@edison1105 i updated that module to the version 3.0.2 but it's still not working

[69hunter]

Hi @boussadjra I just peeked into the package-lock.json in your reproduction link. It seems that the @vue/compiler-sfc is at version 3.0.0. If you can try to upgrade the module to 3.0.2, it should work.