PowerSelectMultipleWithCreate triggers a form submit on enter

[makepanic]

It seems like using PowerSelectMultipleWithCreate inside a form with a submit listener will trigger the submit action when using the Enter key.

This doesn't seem to happen when wrapping a regular PowerSelectWithCreate with the form.

e.g. in the dummy app:

<form {{on 'submit' (action onFormSubmit)}}>
  <PowerSelectMultipleWithCreate
    @options={{countries}}
    @searchField="name"
    @selected={{selectedCountries}}
    @onChange={{action (mut selectedCountries)}}
    @onCreate={{action "createCountry"}} as |country|
  >
    {{country.name}}
  </PowerSelectMultipleWithCreate>
</form>

triggers the onFormSubmit method to be called when pressing the enter key.

I'm currently trying to trigger the Enter in a failing test but it's somewhat complicated 🤔

Seems like manually pressing Enter triggers a submit event on the form element.
If I do it via triggerKeyEvent() it doesn't work.

edit: It seems like the issue is that Multiple adds the input inline while the other one places the search input into the dropdown wormhole.

edit2: It seems like this is the expected behavior for any input inside a form element.
@cibernox do you think it would be a good idea to prevent the enter event inside the power-select trigger from bubbling up?

[makepanic]

It seems like there's already Enter handling in power-select:

https://github.com/cibernox/ember-power-select/blob/master/addon/components/power-select-multiple.js#L49

If i add e.preventDefault(); near the e.stopPropagation(); it works as expected.