diff --git a/addon/components/power-select-multiple/trigger.hbs b/addon/components/power-select-multiple/trigger.hbs
index 6cfb56843..ed2e7609a 100644
--- a/addon/components/power-select-multiple/trigger.hbs
+++ b/addon/components/power-select-multiple/trigger.hbs
@@ -41,6 +41,7 @@
placeholder={{this.maybePlaceholder}}
disabled={{@select.disabled}}
tabindex={{@tabindex}}
+ form="power-select-fake-form"
{{on "focus" @onFocus}}
{{on "blur" @onBlur}}
{{on "input" this.handleInput}}
diff --git a/tests/dummy/app/templates/playground.hbs b/tests/dummy/app/templates/playground.hbs
index 729f8f1cd..2144df258 100644
--- a/tests/dummy/app/templates/playground.hbs
+++ b/tests/dummy/app/templates/playground.hbs
@@ -10,3 +10,13 @@
{{user.name}}
+
Multiple select inside a form
+
\ No newline at end of file
diff --git a/tests/integration/components/power-select/multiple-test.js b/tests/integration/components/power-select/multiple-test.js
index dc435fea9..0b505300d 100644
--- a/tests/integration/components/power-select/multiple-test.js
+++ b/tests/integration/components/power-select/multiple-test.js
@@ -43,6 +43,21 @@ module('Integration | Component | Ember Power Select (Multiple)', function(hooks
assert.dom('.ember-power-select-dropdown input').doesNotExist();
});
+ test('The searchbox of multiple selects has type="search" and a form attribute to prevent submitting the wrapper form when pressing enter', async function(assert) {
+ assert.expect(2);
+
+ this.numbers = numbers;
+ await render(hbs`
+
+ {{option}}
+
+ `);
+
+ await clickTrigger();
+ assert.dom('.ember-power-select-trigger input').hasAttribute('type', 'search');
+ assert.dom('.ember-power-select-trigger input').hasAttribute('form');
+ });
+
test('When the select opens, the search input (if any) in the trigger gets the focus', async function(assert) {
assert.expect(1);