From 94525254cba02c66da2e761f5aebcaddca524841 Mon Sep 17 00:00:00 2001
From: Ravindra Mitke <mitke_r@India.XoriantCorp.com>
Date: Tue, 21 Jan 2020 19:46:15 +0530
Subject: [PATCH 1/3] Issue 850: Datepicker triggers form Submission when
 clicked on month/year button

---
 src/Calendar/Calendar.js     | 12 ++++++++----
 src/DatePicker/DatePicker.js |  3 ++-
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/Calendar/Calendar.js b/src/Calendar/Calendar.js
index 90ba263b9..78eaa5056 100644
--- a/src/Calendar/Calendar.js
+++ b/src/Calendar/Calendar.js
@@ -305,14 +305,16 @@ class Calendar extends Component {
                             disableStyles={this.props.disableStyles}
                             glyph='slim-arrow-left'
                             onClick={this.handlePrevious}
-                            option='light' />
+                            option='light'
+                            typeAttr='button' />
                     </div>
                     <div className='fd-calendar__action'>
                         <Button
                             compact
                             disableStyles={this.props.disableStyles}
                             onClick={this.showMonths}
-                            option='light'>
+                            option='light'
+                            typeAttr='button'>
                             <span>
                                 {months[this.state.currentDateDisplayed.month()]}
                             </span>
@@ -323,7 +325,8 @@ class Calendar extends Component {
                             compact
                             disableStyles={this.props.disableStyles}
                             onClick={this.showYears}
-                            option='light'>
+                            option='light'
+                            typeAttr='button'>
                             <span>
                                 {this.state.currentDateDisplayed.year()}
                             </span>
@@ -336,7 +339,8 @@ class Calendar extends Component {
                             disableStyles={this.props.disableStyles}
                             glyph='slim-arrow-right'
                             onClick={this.handleNext}
-                            option='light' />
+                            option='light'
+                            typeAttr='button' />
                     </div>
                 </div>
             </header>
diff --git a/src/DatePicker/DatePicker.js b/src/DatePicker/DatePicker.js
index b3318613f..1fc505983 100644
--- a/src/DatePicker/DatePicker.js
+++ b/src/DatePicker/DatePicker.js
@@ -186,7 +186,8 @@ class DatePicker extends Component {
                                     disableStyles={disableStyles}
                                     glyph='calendar'
                                     onClick={() => this.openCalendar()}
-                                    option='light' />
+                                    option='light'
+                                    typeAttr='button' />
                             </InputGroup.Addon>
                         </InputGroup>
                     </div>

From f69f68579a8f1abb2abc68b990c0cba0cae95f4d Mon Sep 17 00:00:00 2001
From: Ravindra Mitke <mitke_r@India.XoriantCorp.com>
Date: Wed, 22 Jan 2020 13:52:17 +0530
Subject: [PATCH 2/3] Issue 850: Added Default props for typeAttr to button in
 Button component

---
 src/Button/Button.js         |  4 ++++
 src/Calendar/Calendar.js     | 12 ++++--------
 src/DatePicker/DatePicker.js |  3 +--
 3 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/src/Button/Button.js b/src/Button/Button.js
index 24e050595..b6d60a36a 100644
--- a/src/Button/Button.js
+++ b/src/Button/Button.js
@@ -57,6 +57,10 @@ Button.propTypes = {
     onClick: PropTypes.func
 };
 
+Button.defaultProps = {
+    typeAttr: 'button'
+};
+
 Button.propDescriptions = {
     option: 'Indicates the importance of the button.',
     selected: 'Set to **true** to set state of the button to "selected".',
diff --git a/src/Calendar/Calendar.js b/src/Calendar/Calendar.js
index 78eaa5056..90ba263b9 100644
--- a/src/Calendar/Calendar.js
+++ b/src/Calendar/Calendar.js
@@ -305,16 +305,14 @@ class Calendar extends Component {
                             disableStyles={this.props.disableStyles}
                             glyph='slim-arrow-left'
                             onClick={this.handlePrevious}
-                            option='light'
-                            typeAttr='button' />
+                            option='light' />
                     </div>
                     <div className='fd-calendar__action'>
                         <Button
                             compact
                             disableStyles={this.props.disableStyles}
                             onClick={this.showMonths}
-                            option='light'
-                            typeAttr='button'>
+                            option='light'>
                             <span>
                                 {months[this.state.currentDateDisplayed.month()]}
                             </span>
@@ -325,8 +323,7 @@ class Calendar extends Component {
                             compact
                             disableStyles={this.props.disableStyles}
                             onClick={this.showYears}
-                            option='light'
-                            typeAttr='button'>
+                            option='light'>
                             <span>
                                 {this.state.currentDateDisplayed.year()}
                             </span>
@@ -339,8 +336,7 @@ class Calendar extends Component {
                             disableStyles={this.props.disableStyles}
                             glyph='slim-arrow-right'
                             onClick={this.handleNext}
-                            option='light'
-                            typeAttr='button' />
+                            option='light' />
                     </div>
                 </div>
             </header>
diff --git a/src/DatePicker/DatePicker.js b/src/DatePicker/DatePicker.js
index 1fc505983..b3318613f 100644
--- a/src/DatePicker/DatePicker.js
+++ b/src/DatePicker/DatePicker.js
@@ -186,8 +186,7 @@ class DatePicker extends Component {
                                     disableStyles={disableStyles}
                                     glyph='calendar'
                                     onClick={() => this.openCalendar()}
-                                    option='light'
-                                    typeAttr='button' />
+                                    option='light' />
                             </InputGroup.Addon>
                         </InputGroup>
                     </div>

From 6fd1c883fc42507adbf451092d09aad0f8c4525b Mon Sep 17 00:00:00 2001
From: Ravindra Mitke <codingmypassion@yahoo.com>
Date: Thu, 23 Jan 2020 12:38:01 +0530
Subject: [PATCH 3/3] Issue 850: Updated snapshots

---
 .../__snapshots__/ActionBar.test.js.snap      |  2 +
 src/Button/Button.js                          |  4 ++
 src/Button/__snapshots__/Button.test.js.snap  |  7 ++++
 .../__snapshots__/ButtonGroup.test.js.snap    |  3 ++
 src/Calendar/Calendar.js                      | 12 ++----
 .../__snapshots__/ComboboxInput.test.js.snap  |  2 +
 src/DatePicker/DatePicker.js                  |  3 +-
 .../__snapshots__/Dropdown.test.js.snap       |  5 +++
 .../__snapshots__/InputGroup.test.js.snap     |  2 +
 .../InputGroupAddon.test.js.snap              |  2 +
 .../__snapshots__/ListGroup.test.js.snap      |  2 +
 .../__snapshots__/ListGroupItem.test.js.snap  |  1 +
 .../ListGroupItemActions.test.js.snap         |  1 +
 .../LocalizationEditor.test.js.snap           |  3 ++
 src/Panel/__snapshots__/Panel.test.js.snap    |  2 +
 .../__snapshots__/PanelActions.test.js.snap   |  1 +
 .../__snapshots__/PanelHeader.test.js.snap    |  1 +
 .../__snapshots__/SearchInput.test.js.snap    |  3 ++
 .../__snapshots__/Shellbar.test.js.snap       | 20 +++++++++
 src/Tile/__snapshots__/Tile.test.js.snap      |  2 +
 .../__snapshots__/TileActions.test.js.snap    |  1 +
 src/Time/__snapshots__/Time.test.js.snap      | 42 +++++++++++++++++++
 .../__snapshots__/TimePicker.test.js.snap     | 10 +++++
 23 files changed, 121 insertions(+), 10 deletions(-)

diff --git a/src/ActionBar/__snapshots__/ActionBar.test.js.snap b/src/ActionBar/__snapshots__/ActionBar.test.js.snap
index d7d9ffc21..7eb6f3f6e 100644
--- a/src/ActionBar/__snapshots__/ActionBar.test.js.snap
+++ b/src/ActionBar/__snapshots__/ActionBar.test.js.snap
@@ -9,6 +9,7 @@ exports[`<ActionBar /> create basic Action Bar 1`] = `
   >
     <button
       className="fd-button--light fd-button--compact sap-icon--nav-back"
+      type="button"
     />
   </div>
   <div
@@ -44,6 +45,7 @@ exports[`<ActionBar /> create basic Action Bar 2`] = `
   >
     <button
       className="fd-button--light fd-button--compact sap-icon--nav-back"
+      type="button"
     />
   </div>
   <div
diff --git a/src/Button/Button.js b/src/Button/Button.js
index 24e050595..b6d60a36a 100644
--- a/src/Button/Button.js
+++ b/src/Button/Button.js
@@ -57,6 +57,10 @@ Button.propTypes = {
     onClick: PropTypes.func
 };
 
+Button.defaultProps = {
+    typeAttr: 'button'
+};
+
 Button.propDescriptions = {
     option: 'Indicates the importance of the button.',
     selected: 'Set to **true** to set state of the button to "selected".',
diff --git a/src/Button/__snapshots__/Button.test.js.snap b/src/Button/__snapshots__/Button.test.js.snap
index fb7040a96..7efa6fece 100644
--- a/src/Button/__snapshots__/Button.test.js.snap
+++ b/src/Button/__snapshots__/Button.test.js.snap
@@ -3,6 +3,7 @@
 exports[`<Button /> create buttons 1`] = `
 <button
   className="fd-button"
+  type="button"
 >
   Regular Button
 </button>
@@ -11,6 +12,7 @@ exports[`<Button /> create buttons 1`] = `
 exports[`<Button /> create buttons 2`] = `
 <button
   className="fd-button--emphasized"
+  type="button"
 >
   Emphasized Button
 </button>
@@ -19,6 +21,7 @@ exports[`<Button /> create buttons 2`] = `
 exports[`<Button /> create buttons 3`] = `
 <button
   className="fd-button fd-button--positive"
+  type="button"
 >
   Positive Button
 </button>
@@ -27,6 +30,7 @@ exports[`<Button /> create buttons 3`] = `
 exports[`<Button /> create buttons 4`] = `
 <button
   className="fd-button sap-icon--cart"
+  type="button"
 >
   Icon Button
 </button>
@@ -35,6 +39,7 @@ exports[`<Button /> create buttons 4`] = `
 exports[`<Button /> create buttons 5`] = `
 <button
   className="fd-button fd-button--compact"
+  type="button"
 >
   Compact
 </button>
@@ -44,6 +49,7 @@ exports[`<Button /> create buttons 6`] = `
 <button
   className="fd-button--emphasized is-selected"
   selected={true}
+  type="button"
 >
   Selected State
 </button>
@@ -53,6 +59,7 @@ exports[`<Button /> create buttons 7`] = `
 <button
   className="fd-button--emphasized is-disabled"
   disabled={true}
+  type="button"
 >
   Disabled State
 </button>
diff --git a/src/Button/__snapshots__/ButtonGroup.test.js.snap b/src/Button/__snapshots__/ButtonGroup.test.js.snap
index e9202cf49..2bb196f57 100644
--- a/src/Button/__snapshots__/ButtonGroup.test.js.snap
+++ b/src/Button/__snapshots__/ButtonGroup.test.js.snap
@@ -8,13 +8,16 @@ exports[`<ButtonGroup /> create button group 1`] = `
 >
   <button
     className="fd-button sap-icon--survey blue"
+    type="button"
   />
   <button
     className="fd-button sap-icon--pie-chart is-selected"
     selected={true}
+    type="button"
   />
   <button
     className="fd-button sap-icon--pool"
+    type="button"
   />
 </div>
 `;
diff --git a/src/Calendar/Calendar.js b/src/Calendar/Calendar.js
index 78eaa5056..90ba263b9 100644
--- a/src/Calendar/Calendar.js
+++ b/src/Calendar/Calendar.js
@@ -305,16 +305,14 @@ class Calendar extends Component {
                             disableStyles={this.props.disableStyles}
                             glyph='slim-arrow-left'
                             onClick={this.handlePrevious}
-                            option='light'
-                            typeAttr='button' />
+                            option='light' />
                     </div>
                     <div className='fd-calendar__action'>
                         <Button
                             compact
                             disableStyles={this.props.disableStyles}
                             onClick={this.showMonths}
-                            option='light'
-                            typeAttr='button'>
+                            option='light'>
                             <span>
                                 {months[this.state.currentDateDisplayed.month()]}
                             </span>
@@ -325,8 +323,7 @@ class Calendar extends Component {
                             compact
                             disableStyles={this.props.disableStyles}
                             onClick={this.showYears}
-                            option='light'
-                            typeAttr='button'>
+                            option='light'>
                             <span>
                                 {this.state.currentDateDisplayed.year()}
                             </span>
@@ -339,8 +336,7 @@ class Calendar extends Component {
                             disableStyles={this.props.disableStyles}
                             glyph='slim-arrow-right'
                             onClick={this.handleNext}
-                            option='light'
-                            typeAttr='button' />
+                            option='light' />
                     </div>
                 </div>
             </header>
diff --git a/src/ComboboxInput/__snapshots__/ComboboxInput.test.js.snap b/src/ComboboxInput/__snapshots__/ComboboxInput.test.js.snap
index 324541110..6f04cacad 100644
--- a/src/ComboboxInput/__snapshots__/ComboboxInput.test.js.snap
+++ b/src/ComboboxInput/__snapshots__/ComboboxInput.test.js.snap
@@ -27,6 +27,7 @@ exports[`<ComboboxInput /> create combobox input 1`] = `
           >
             <button
               className="fd-button--light sap-icon--navigation-down-arrow fd-input-group__button"
+              type="button"
             />
           </span>
         </div>
@@ -65,6 +66,7 @@ exports[`<ComboboxInput /> create combobox input 2`] = `
           >
             <button
               className="fd-button--light fd-button--compact sap-icon--navigation-down-arrow fd-input-group__button"
+              type="button"
             />
           </span>
         </div>
diff --git a/src/DatePicker/DatePicker.js b/src/DatePicker/DatePicker.js
index 1fc505983..b3318613f 100644
--- a/src/DatePicker/DatePicker.js
+++ b/src/DatePicker/DatePicker.js
@@ -186,8 +186,7 @@ class DatePicker extends Component {
                                     disableStyles={disableStyles}
                                     glyph='calendar'
                                     onClick={() => this.openCalendar()}
-                                    option='light'
-                                    typeAttr='button' />
+                                    option='light' />
                             </InputGroup.Addon>
                         </InputGroup>
                     </div>
diff --git a/src/Dropdown/__snapshots__/Dropdown.test.js.snap b/src/Dropdown/__snapshots__/Dropdown.test.js.snap
index 36d2f939d..598b412e6 100644
--- a/src/Dropdown/__snapshots__/Dropdown.test.js.snap
+++ b/src/Dropdown/__snapshots__/Dropdown.test.js.snap
@@ -24,6 +24,7 @@ exports[`<Dropdown /> create dropdown component 1`] = `
           onKeyPress={[Function]}
           role="button"
           tabIndex={0}
+          type="button"
         >
           Select
         </button>
@@ -57,6 +58,7 @@ exports[`<Dropdown /> create dropdown component 2`] = `
           onKeyPress={[Function]}
           role="button"
           tabIndex={0}
+          type="button"
         >
           Select
         </button>
@@ -90,6 +92,7 @@ exports[`<Dropdown /> create dropdown component 3`] = `
           onKeyPress={[Function]}
           role="button"
           tabIndex={0}
+          type="button"
         >
           Select
         </button>
@@ -124,6 +127,7 @@ exports[`<Dropdown /> create dropdown component 4`] = `
           onKeyPress={[Function]}
           role="button"
           tabIndex={0}
+          type="button"
         >
           Select
         </button>
@@ -159,6 +163,7 @@ exports[`<Dropdown /> create dropdown component 5`] = `
           onKeyPress={[Function]}
           role="button"
           tabIndex={0}
+          type="button"
         >
           Select
         </button>
diff --git a/src/InputGroup/__snapshots__/InputGroup.test.js.snap b/src/InputGroup/__snapshots__/InputGroup.test.js.snap
index 733f4b3cd..e1bf56a92 100644
--- a/src/InputGroup/__snapshots__/InputGroup.test.js.snap
+++ b/src/InputGroup/__snapshots__/InputGroup.test.js.snap
@@ -158,6 +158,7 @@ exports[`<InputGroup /> create input group items 9`] = `
   >
     <button
       className="fd-button--light fd-input-group__button"
+      type="button"
     >
       Button
     </button>
@@ -179,6 +180,7 @@ exports[`<InputGroup /> create input group items 10`] = `
   >
     <button
       className="fd-button--light fd-button--compact fd-input-group__button"
+      type="button"
     >
       Button
     </button>
diff --git a/src/InputGroup/__snapshots__/InputGroupAddon.test.js.snap b/src/InputGroup/__snapshots__/InputGroupAddon.test.js.snap
index 4cf2b96bb..24c43d3ae 100644
--- a/src/InputGroup/__snapshots__/InputGroupAddon.test.js.snap
+++ b/src/InputGroup/__snapshots__/InputGroupAddon.test.js.snap
@@ -14,6 +14,7 @@ exports[`<InputGroupAddon /> create input group add-on items 2`] = `
 >
   <button
     className="fd-button fd-input-group__button"
+    type="button"
   >
     Text Here
   </button>
@@ -26,6 +27,7 @@ exports[`<InputGroupAddon /> create input group add-on items 3`] = `
 >
   <button
     className="fd-button fd-button--compact fd-input-group__button"
+    type="button"
   >
     Text Here
   </button>
diff --git a/src/ListGroup/__snapshots__/ListGroup.test.js.snap b/src/ListGroup/__snapshots__/ListGroup.test.js.snap
index 7b5fdf608..3179f1e79 100644
--- a/src/ListGroup/__snapshots__/ListGroup.test.js.snap
+++ b/src/ListGroup/__snapshots__/ListGroup.test.js.snap
@@ -49,6 +49,7 @@ exports[`<ListGroup /> create list group 1`] = `
     >
       <button
         className="fd-button fd-button--standard sap-icon--edit"
+        type="button"
       />
     </span>
   </li>
@@ -68,6 +69,7 @@ exports[`<ListGroup /> create list group 2`] = `
     >
       <button
         className="fd-button fd-button--standard sap-icon--edit"
+        type="button"
       />
     </span>
   </li>
diff --git a/src/ListGroup/__snapshots__/ListGroupItem.test.js.snap b/src/ListGroup/__snapshots__/ListGroupItem.test.js.snap
index 5630dfa9c..3cd505b19 100644
--- a/src/ListGroup/__snapshots__/ListGroupItem.test.js.snap
+++ b/src/ListGroup/__snapshots__/ListGroupItem.test.js.snap
@@ -10,6 +10,7 @@ exports[`<ListGroupItem /> create list group item 1`] = `
   >
     <button
       className="fd-button fd-button--standard sap-icon--edit"
+      type="button"
     />
   </span>
 </li>
diff --git a/src/ListGroup/__snapshots__/ListGroupItemActions.test.js.snap b/src/ListGroup/__snapshots__/ListGroupItemActions.test.js.snap
index 174dcd16b..4ee5c0d0e 100644
--- a/src/ListGroup/__snapshots__/ListGroupItemActions.test.js.snap
+++ b/src/ListGroup/__snapshots__/ListGroupItemActions.test.js.snap
@@ -6,6 +6,7 @@ exports[`<ListGroupItemActions /> create list group item actions 1`] = `
 >
   <button
     className="fd-button fd-button--standard sap-icon--edit"
+    type="button"
   />
 </span>
 `;
diff --git a/src/LocalizationEditor/__snapshots__/LocalizationEditor.test.js.snap b/src/LocalizationEditor/__snapshots__/LocalizationEditor.test.js.snap
index 4cb240df6..2328b4ce3 100644
--- a/src/LocalizationEditor/__snapshots__/LocalizationEditor.test.js.snap
+++ b/src/LocalizationEditor/__snapshots__/LocalizationEditor.test.js.snap
@@ -35,6 +35,7 @@ exports[`<LocalizationEditor /> create localization editor 1`] = `
           >
             <button
               className="fd-button--light fd-input-group__button"
+              type="button"
             >
               EN*
             </button>
@@ -81,6 +82,7 @@ exports[`<LocalizationEditor /> create localization editor 2`] = `
           >
             <button
               className="fd-button--light fd-button--compact fd-input-group__button"
+              type="button"
             >
               EN*
             </button>
@@ -125,6 +127,7 @@ exports[`<LocalizationEditor /> create localization editor 3`] = `
           >
             <button
               className="fd-button--light fd-input-group__button"
+              type="button"
             >
               EN*
             </button>
diff --git a/src/Panel/__snapshots__/Panel.test.js.snap b/src/Panel/__snapshots__/Panel.test.js.snap
index 3c90d63b6..0993d57e9 100644
--- a/src/Panel/__snapshots__/Panel.test.js.snap
+++ b/src/Panel/__snapshots__/Panel.test.js.snap
@@ -26,6 +26,7 @@ exports[`<Panel /> create panels 1`] = `
     >
       <button
         className="fd-button fd-button--compact sap-icon--add"
+        type="button"
       >
         Add New Button
       </button>
@@ -80,6 +81,7 @@ exports[`<Panel /> create panels 2`] = `
     >
       <button
         className="fd-button fd-button--compact sap-icon--add"
+        type="button"
       >
         Add New Button
       </button>
diff --git a/src/Panel/__snapshots__/PanelActions.test.js.snap b/src/Panel/__snapshots__/PanelActions.test.js.snap
index 2053c3af3..e95e570e1 100644
--- a/src/Panel/__snapshots__/PanelActions.test.js.snap
+++ b/src/Panel/__snapshots__/PanelActions.test.js.snap
@@ -6,6 +6,7 @@ exports[`<PanelActions /> create panel actions 1`] = `
 >
   <button
     className="fd-button fd-button--compact sap-icon--add"
+    type="button"
   >
     Add New Button
   </button>
diff --git a/src/Panel/__snapshots__/PanelHeader.test.js.snap b/src/Panel/__snapshots__/PanelHeader.test.js.snap
index d83994b49..af0a34d76 100644
--- a/src/Panel/__snapshots__/PanelHeader.test.js.snap
+++ b/src/Panel/__snapshots__/PanelHeader.test.js.snap
@@ -23,6 +23,7 @@ exports[`<PanelHeader /> create panels 1`] = `
   >
     <button
       className="fd-button fd-button--compact sap-icon--add"
+      type="button"
     >
       Add New Button
     </button>
diff --git a/src/SearchInput/__snapshots__/SearchInput.test.js.snap b/src/SearchInput/__snapshots__/SearchInput.test.js.snap
index ab4037c38..a71dcb502 100644
--- a/src/SearchInput/__snapshots__/SearchInput.test.js.snap
+++ b/src/SearchInput/__snapshots__/SearchInput.test.js.snap
@@ -34,6 +34,7 @@ exports[`<SearchInput /> create SearchInput 1`] = `
             <button
               className="fd-button--light sap-icon--search fd-input-group__button"
               onClick={[Function]}
+              type="button"
             />
           </span>
         </div>
@@ -75,6 +76,7 @@ exports[`<SearchInput /> create SearchInput 2`] = `
             <button
               className="fd-button--light sap-icon--search fd-input-group__button"
               onClick={[Function]}
+              type="button"
             />
           </span>
         </div>
@@ -116,6 +118,7 @@ exports[`<SearchInput /> create SearchInput 3`] = `
             <button
               className="fd-button--light sap-icon--search fd-input-group__button"
               onClick={[Function]}
+              type="button"
             />
           </span>
         </div>
diff --git a/src/Shellbar/__snapshots__/Shellbar.test.js.snap b/src/Shellbar/__snapshots__/Shellbar.test.js.snap
index 551da325f..ee6a4c745 100644
--- a/src/Shellbar/__snapshots__/Shellbar.test.js.snap
+++ b/src/Shellbar/__snapshots__/Shellbar.test.js.snap
@@ -228,6 +228,7 @@ exports[`<Shellbar /> create shellbar 3`] = `
                   <button
                     className="fd-button--light sap-icon--search fd-input-group__button"
                     onClick={[Function]}
+                    type="button"
                   />
                 </span>
               </div>
@@ -260,6 +261,7 @@ exports[`<Shellbar /> create shellbar 3`] = `
               onKeyPress={[Function]}
               role="button"
               tabIndex={0}
+              type="button"
             >
               <span
                 aria-label="Unread count"
@@ -296,6 +298,7 @@ exports[`<Shellbar /> create shellbar 3`] = `
             <button
               aria-label="Notifications"
               className="fd-button sap-icon--bell fd-shellbar__button"
+              type="button"
             >
               <span
                 aria-label="Unread count"
@@ -334,6 +337,7 @@ exports[`<Shellbar /> create shellbar 3`] = `
             >
               <button
                 className="fd-button sap-icon--overflow fd-shellbar__button"
+                type="button"
               >
                 <span
                   aria-label="Unread count"
@@ -409,6 +413,7 @@ exports[`<Shellbar /> create shellbar 3`] = `
                 onKeyPress={[Function]}
                 role="button"
                 tabIndex={0}
+                type="button"
               />
             </div>
           </div>
@@ -523,6 +528,7 @@ exports[`<Shellbar /> create shellbar 4`] = `
                   <button
                     className="fd-button--light sap-icon--search fd-input-group__button"
                     onClick={[Function]}
+                    type="button"
                   />
                 </span>
               </div>
@@ -555,6 +561,7 @@ exports[`<Shellbar /> create shellbar 4`] = `
               onKeyPress={[Function]}
               role="button"
               tabIndex={0}
+              type="button"
             >
               <span
                 aria-label="Unread count"
@@ -591,6 +598,7 @@ exports[`<Shellbar /> create shellbar 4`] = `
             <button
               aria-label="Notifications"
               className="fd-button sap-icon--bell fd-shellbar__button"
+              type="button"
             />
           </div>
         </div>
@@ -622,6 +630,7 @@ exports[`<Shellbar /> create shellbar 4`] = `
             >
               <button
                 className="fd-button sap-icon--overflow fd-shellbar__button"
+                type="button"
               >
                 <span
                   aria-label="Unread count"
@@ -697,6 +706,7 @@ exports[`<Shellbar /> create shellbar 4`] = `
                 onKeyPress={[Function]}
                 role="button"
                 tabIndex={0}
+                type="button"
               />
             </div>
           </div>
@@ -811,6 +821,7 @@ exports[`<Shellbar /> create shellbar 5`] = `
                   <button
                     className="fd-button--light sap-icon--search fd-input-group__button"
                     onClick={[Function]}
+                    type="button"
                   />
                 </span>
               </div>
@@ -826,6 +837,7 @@ exports[`<Shellbar /> create shellbar 5`] = `
         aria-label="Settings"
         className="fd-button sap-icon--settings fd-shellbar__button"
         onClick={[Function]}
+        type="button"
       >
         <span
           aria-label="Unread count"
@@ -859,6 +871,7 @@ exports[`<Shellbar /> create shellbar 5`] = `
             <button
               aria-label="Notifications"
               className="fd-button sap-icon--bell fd-shellbar__button"
+              type="button"
             />
           </div>
         </div>
@@ -890,6 +903,7 @@ exports[`<Shellbar /> create shellbar 5`] = `
             >
               <button
                 className="fd-button sap-icon--overflow fd-shellbar__button"
+                type="button"
               >
                 <span
                   aria-label="Unread count"
@@ -965,6 +979,7 @@ exports[`<Shellbar /> create shellbar 5`] = `
                 onKeyPress={[Function]}
                 role="button"
                 tabIndex={0}
+                type="button"
               />
             </div>
           </div>
@@ -1079,6 +1094,7 @@ exports[`<Shellbar /> create shellbar 6`] = `
                   <button
                     className="fd-button--light sap-icon--search fd-input-group__button"
                     onClick={[Function]}
+                    type="button"
                   />
                 </span>
               </div>
@@ -1111,6 +1127,7 @@ exports[`<Shellbar /> create shellbar 6`] = `
               onKeyPress={[Function]}
               role="button"
               tabIndex={0}
+              type="button"
             >
               <span
                 aria-label="Unread count"
@@ -1130,6 +1147,7 @@ exports[`<Shellbar /> create shellbar 6`] = `
         aria-label="Notifications"
         className="fd-button sap-icon--bell fd-shellbar__button"
         onClick={[Function]}
+        type="button"
       >
         <span
           aria-label="Unread count"
@@ -1165,6 +1183,7 @@ exports[`<Shellbar /> create shellbar 6`] = `
             >
               <button
                 className="fd-button sap-icon--overflow fd-shellbar__button"
+                type="button"
               >
                 <span
                   aria-label="Unread count"
@@ -1243,6 +1262,7 @@ exports[`<Shellbar /> create shellbar 6`] = `
                 onKeyPress={[Function]}
                 role="button"
                 tabIndex={0}
+                type="button"
               />
             </div>
           </div>
diff --git a/src/Tile/__snapshots__/Tile.test.js.snap b/src/Tile/__snapshots__/Tile.test.js.snap
index cc652baa9..85892442f 100644
--- a/src/Tile/__snapshots__/Tile.test.js.snap
+++ b/src/Tile/__snapshots__/Tile.test.js.snap
@@ -103,6 +103,7 @@ exports[`<Tile /> create tile component 4`] = `
             onKeyPress={[Function]}
             role="button"
             tabIndex={0}
+            type="button"
           />
         </div>
       </div>
@@ -174,6 +175,7 @@ exports[`<Tile /> create tile component 6`] = `
             onKeyPress={[Function]}
             role="button"
             tabIndex={0}
+            type="button"
           />
         </div>
       </div>
diff --git a/src/Tile/__snapshots__/TileActions.test.js.snap b/src/Tile/__snapshots__/TileActions.test.js.snap
index 1b4b0a2ad..541b77a07 100644
--- a/src/Tile/__snapshots__/TileActions.test.js.snap
+++ b/src/Tile/__snapshots__/TileActions.test.js.snap
@@ -24,6 +24,7 @@ exports[`<Tile.Actions /> create Tile.Actions component 1`] = `
           onKeyPress={[Function]}
           role="button"
           tabIndex={0}
+          type="button"
         />
       </div>
     </div>
diff --git a/src/Time/__snapshots__/Time.test.js.snap b/src/Time/__snapshots__/Time.test.js.snap
index c2eb8afed..788f3aaa8 100644
--- a/src/Time/__snapshots__/Time.test.js.snap
+++ b/src/Time/__snapshots__/Time.test.js.snap
@@ -14,6 +14,7 @@ exports[`<Time /> create time component 1`] = `
         aria-label="Increase hours"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -33,6 +34,7 @@ exports[`<Time /> create time component 1`] = `
         aria-label="Decrease hours"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -46,6 +48,7 @@ exports[`<Time /> create time component 1`] = `
         aria-label="Increase minutes"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -65,6 +68,7 @@ exports[`<Time /> create time component 1`] = `
         aria-label="Decrease minutes"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -78,6 +82,7 @@ exports[`<Time /> create time component 1`] = `
         aria-label="Increase seconds"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -97,6 +102,7 @@ exports[`<Time /> create time component 1`] = `
         aria-label="Decrease seconds"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -118,6 +124,7 @@ exports[`<Time /> create time component 2`] = `
         aria-label="Increase hours"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -137,6 +144,7 @@ exports[`<Time /> create time component 2`] = `
         aria-label="Decrease hours"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -150,6 +158,7 @@ exports[`<Time /> create time component 2`] = `
         aria-label="Increase minutes"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -169,6 +178,7 @@ exports[`<Time /> create time component 2`] = `
         aria-label="Decrease minutes"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -182,6 +192,7 @@ exports[`<Time /> create time component 2`] = `
         aria-label="Increase seconds"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -201,6 +212,7 @@ exports[`<Time /> create time component 2`] = `
         aria-label="Decrease seconds"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -222,6 +234,7 @@ exports[`<Time /> create time component 3`] = `
         aria-label="Increase hours"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -241,6 +254,7 @@ exports[`<Time /> create time component 3`] = `
         aria-label="Decrease hours"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -254,6 +268,7 @@ exports[`<Time /> create time component 3`] = `
         aria-label="Increase minutes"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -273,6 +288,7 @@ exports[`<Time /> create time component 3`] = `
         aria-label="Decrease minutes"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -286,6 +302,7 @@ exports[`<Time /> create time component 3`] = `
         aria-label="Increase seconds"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -305,6 +322,7 @@ exports[`<Time /> create time component 3`] = `
         aria-label="Decrease seconds"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -326,6 +344,7 @@ exports[`<Time /> create time component 4`] = `
         aria-label="Increase hours"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -345,6 +364,7 @@ exports[`<Time /> create time component 4`] = `
         aria-label="Decrease hours"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -358,6 +378,7 @@ exports[`<Time /> create time component 4`] = `
         aria-label="Increase minutes"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -377,6 +398,7 @@ exports[`<Time /> create time component 4`] = `
         aria-label="Decrease minutes"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -390,6 +412,7 @@ exports[`<Time /> create time component 4`] = `
         aria-label="Increase seconds"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -409,6 +432,7 @@ exports[`<Time /> create time component 4`] = `
         aria-label="Decrease seconds"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -430,6 +454,7 @@ exports[`<Time /> create time component 5`] = `
         aria-label="Increase hours"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -449,6 +474,7 @@ exports[`<Time /> create time component 5`] = `
         aria-label="Decrease hours"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -462,6 +488,7 @@ exports[`<Time /> create time component 5`] = `
         aria-label="Increase minutes"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -481,6 +508,7 @@ exports[`<Time /> create time component 5`] = `
         aria-label="Decrease minutes"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -494,6 +522,7 @@ exports[`<Time /> create time component 5`] = `
         aria-label="Increase seconds"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -513,6 +542,7 @@ exports[`<Time /> create time component 5`] = `
         aria-label="Decrease seconds"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -526,6 +556,7 @@ exports[`<Time /> create time component 5`] = `
         aria-label="Increase period"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -544,6 +575,7 @@ exports[`<Time /> create time component 5`] = `
         aria-label="Decrease period"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -620,6 +652,7 @@ exports[`<Time /> create time component 7`] = `
         aria-label="Increase hours"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -639,6 +672,7 @@ exports[`<Time /> create time component 7`] = `
         aria-label="Decrease hours"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -652,6 +686,7 @@ exports[`<Time /> create time component 7`] = `
         aria-label="Increase minutes"
         className="fd-button--light sap-icon--navigation-up-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -671,6 +706,7 @@ exports[`<Time /> create time component 7`] = `
         aria-label="Decrease minutes"
         className="fd-button--light sap-icon--navigation-down-arrow"
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -694,6 +730,7 @@ exports[`<Time /> create time component 8`] = `
         className="fd-button--light sap-icon--navigation-up-arrow is-disabled"
         disabled={true}
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -715,6 +752,7 @@ exports[`<Time /> create time component 8`] = `
         className="fd-button--light sap-icon--navigation-down-arrow is-disabled"
         disabled={true}
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -729,6 +767,7 @@ exports[`<Time /> create time component 8`] = `
         className="fd-button--light sap-icon--navigation-up-arrow is-disabled"
         disabled={true}
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -750,6 +789,7 @@ exports[`<Time /> create time component 8`] = `
         className="fd-button--light sap-icon--navigation-down-arrow is-disabled"
         disabled={true}
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
@@ -764,6 +804,7 @@ exports[`<Time /> create time component 8`] = `
         className="fd-button--light sap-icon--navigation-up-arrow is-disabled"
         disabled={true}
         onClick={[Function]}
+        type="button"
       />
     </div>
     <input
@@ -785,6 +826,7 @@ exports[`<Time /> create time component 8`] = `
         className="fd-button--light sap-icon--navigation-down-arrow is-disabled"
         disabled={true}
         onClick={[Function]}
+        type="button"
       />
     </div>
   </div>
diff --git a/src/TimePicker/__snapshots__/TimePicker.test.js.snap b/src/TimePicker/__snapshots__/TimePicker.test.js.snap
index 1f0528bea..a47b853d8 100644
--- a/src/TimePicker/__snapshots__/TimePicker.test.js.snap
+++ b/src/TimePicker/__snapshots__/TimePicker.test.js.snap
@@ -38,6 +38,7 @@ exports[`<TimePicker /> create time picker 1`] = `
               aria-haspopup="true"
               className="fd-button--light fd-button--compact sap-icon--fob-watch fd-input-group__button"
               id="myTime-button"
+              type="button"
             />
           </span>
         </div>
@@ -81,6 +82,7 @@ exports[`<TimePicker /> create time picker 2`] = `
               aria-expanded="false"
               aria-haspopup="true"
               className="fd-button--light fd-button--compact sap-icon--fob-watch fd-input-group__button"
+              type="button"
             />
           </span>
         </div>
@@ -124,6 +126,7 @@ exports[`<TimePicker /> create time picker 3`] = `
               aria-expanded="false"
               aria-haspopup="true"
               className="fd-button--light fd-button--compact sap-icon--fob-watch fd-input-group__button"
+              type="button"
             />
           </span>
         </div>
@@ -169,6 +172,7 @@ exports[`<TimePicker /> create time picker 4`] = `
               aria-haspopup="true"
               className="fd-button--light fd-button--compact sap-icon--fob-watch is-disabled fd-input-group__button"
               disabled={true}
+              type="button"
             />
           </span>
         </div>
@@ -212,6 +216,7 @@ exports[`<TimePicker /> create time picker 5`] = `
               aria-expanded="false"
               aria-haspopup="true"
               className="fd-button--light fd-button--compact sap-icon--fob-watch fd-input-group__button"
+              type="button"
             />
           </span>
         </div>
@@ -255,6 +260,7 @@ exports[`<TimePicker /> create time picker 6`] = `
               aria-expanded="false"
               aria-haspopup="true"
               className="fd-button--light fd-button--compact sap-icon--fob-watch fd-input-group__button"
+              type="button"
             />
           </span>
         </div>
@@ -298,6 +304,7 @@ exports[`<TimePicker /> create time picker 7`] = `
               aria-expanded="false"
               aria-haspopup="true"
               className="fd-button--light fd-button--compact sap-icon--fob-watch fd-input-group__button"
+              type="button"
             />
           </span>
         </div>
@@ -341,6 +348,7 @@ exports[`<TimePicker /> create time picker 8`] = `
               aria-expanded="false"
               aria-haspopup="true"
               className="fd-button--light fd-button--compact sap-icon--fob-watch fd-input-group__button"
+              type="button"
             />
           </span>
         </div>
@@ -384,6 +392,7 @@ exports[`<TimePicker /> create time picker 9`] = `
               aria-expanded="false"
               aria-haspopup="true"
               className="fd-button--light fd-button--compact sap-icon--fob-watch fd-input-group__button"
+              type="button"
             />
           </span>
         </div>
@@ -427,6 +436,7 @@ exports[`<TimePicker /> create time picker 10`] = `
               aria-expanded="false"
               aria-haspopup="true"
               className="fd-button--light fd-button--compact sap-icon--fob-watch fd-input-group__button"
+              type="button"
             />
           </span>
         </div>