fix: assign button type in React Vanilla renderers

Assign button type to all buttons rendered in React Vanilla to avoid accidental submitting of forms.
eclipsesource · Mar 8, 2024 · 24f4e5f · 24f4e5f
1 parent 30c1b79
commit 24f4e5f
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 0 deletions.
diff --git a/packages/vanilla-renderers/src/complex/TableArrayControl.tsx b/packages/vanilla-renderers/src/complex/TableArrayControl.tsx
@@ -111,6 +111,7 @@ class TableArrayControl extends React.Component<
         <header>
           <label className={labelClass}>{label}</label>
           <button
+            type='button'
             className={buttonClass}
             onClick={addItem(path, createDefaultValue(schema, rootSchema))}
           >
@@ -214,6 +215,7 @@ class TableArrayControl extends React.Component<
                     </td>
                     <td>
                       <button
+                        type='button'
                         aria-label={translations.removeAriaLabel}
                         onClick={() => {
                           if (

diff --git a/packages/vanilla-renderers/src/complex/array/ArrayControlRenderer.tsx b/packages/vanilla-renderers/src/complex/array/ArrayControlRenderer.tsx
@@ -96,6 +96,7 @@ export const ArrayControl = ({
       <header>
         <label className={labelClass}>{label}</label>
         <button
+          type='button'
           className={buttonClassAdd}
           onClick={addItem(path, createDefaultValue(schema, rootSchema))}
         >
@@ -118,6 +119,7 @@ export const ArrayControl = ({
                 />
                 <div className={childControlsClass}>
                   <button
+                    type='button'
                     className={buttonClassUp}
                     aria-label={translations.upAriaLabel}
                     onClick={() => {
@@ -127,6 +129,7 @@ export const ArrayControl = ({
                     {translations.up}
                   </button>
                   <button
+                    type='button'
                     className={buttonClassDown}
                     aria-label={translations.downAriaLabel}
                     onClick={() => {
@@ -136,6 +139,7 @@ export const ArrayControl = ({
                     {translations.down}
                   </button>
                   <button
+                    type='button'
                     className={buttonClassDelete}
                     aria-label={translations.removeAriaLabel}
                     onClick={() => {