fix: declare component events that can be emitted MP-873 MP-901 #5577
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
With Vue 3 it is best practice to declare the events that can be emitted by a component using the
emits
option or thedefineEmits
method (see https://v3-migration.vuejs.org/breaking-changes/emits-option.html). This is especially important for components that emit events with the same name as native html events (click, change, update, input, etc.) because:If the events are not declared it can lead to unexpected behavior, like event listeners being called twice; first with the custom event value, and then again with an html event.
Events that are not named the same as html events behave as expected whether or not they are declared, which is why this issue was not obvious.
Here are components changed in this PR that use native html event names that we should confirm still work after these changes:
change
click
update
input
select
I'm not sure how the
emits
option is merged when it is used in a mixin, or if it works in a mixin at all, so we should also confirm that components using these mixins still work: