fix(input-datepicker): prevent button from submitting forms

Co-authored-by: Daniel Alarcon Amador <daniel.amador@ing.com>

Author: Mikhail Bashkirov

packages/input-datepicker/package.json

@@ -46,6 +46,7 @@
     "@lion/button": "^0.1.14",
     "@open-wc/demoing-storybook": "^0.2.0",
     "@open-wc/testing": "^0.11.1",
-    "@polymer/iron-test-helpers": "^3.0.1"
+    "@polymer/iron-test-helpers": "^3.0.1",
+    "sinon": "^7.2.2"
   }
 }

packages/input-datepicker/src/LionInputDatepicker.js

@@ -274,6 +274,7 @@ export class LionInputDatepicker extends LionInputDate {
     // (a.k.a. dropdowns) as well. Important: will be breaking for subclassers
     return html`
       <button
+        type="button"
         @click="${this.__openCalendarOverlay}"
         id="${this.__invokerId}"
         aria-haspopup="dialog"

packages/input-datepicker/test/lion-input-datepicker.test.js

@@ -1,4 +1,5 @@
 import { expect, fixture, aTimeout, defineCE } from '@open-wc/testing';
+import sinon from 'sinon';
 import { localizeTearDown } from '@lion/localize/test-helpers.js';
 import { html, LitElement } from '@lion/core';
 import {
@@ -422,4 +423,20 @@ describe('<lion-input-datepicker>', () => {
       it.skip('can configure the overlay presentation based on media query switch', async () => {});
     });
   });
+
+  describe('regression tests', async () => {
+    it('does not submit a form when datepicker is opened', async () => {
+      const submitSpy = sinon.spy();
+      const form = await fixture(html`
+        <form @submit="${submitSpy}">
+          <lion-input-datepicker></lion-input-datepicker>
+        </form>
+      `);
+      const el = form.children[0];
+      await el.updateComplete;
+      const elObj = new DatepickerInputObject(el);
+      await elObj.openCalendar();
+      expect(submitSpy.callCount).to.equal(0);
+    });
+  });
 });