Add type=button attribute to buttons

Signed-off-by: Christopher Ng <chrng8@gmail.com>
nextcloud-libraries · Jun 26, 2021 · da3d47a · da3d47a
1 parent 47fe34f
commit da3d47a
Show file tree

Hide file tree

Showing 8 changed files with 16 additions and 5 deletions.
diff --git a/src/components/ActionButton/ActionButton.vue b/src/components/ActionButton/ActionButton.vue
@@ -82,8 +82,9 @@ export default {
  <li class="action" :class="{ 'action--disabled': disabled }">
  <button
  class="action-button"
- :aria-label="ariaLabel"
  :class="{ focusable: isFocusable }"
+ :aria-label="ariaLabel"
+ type="button"
  @click="onClick">
  <!-- @slot Manually provide icon -->
  <slot name="icon">

diff --git a/src/components/Actions/Actions.vue b/src/components/Actions/Actions.vue
@@ -185,11 +185,12 @@ export default {
  'action-item__menutoggle--default-icon': !iconSlotIsPopulated && defaultIcon === '',
  'action-item__menutoggle--primary': primary
  }"
- :aria-label="ariaLabel"
  aria-haspopup="true"
+ :aria-label="ariaLabel"
  :aria-controls="randomId"
- test-attr="1"
  :aria-expanded="opened ? 'true' : 'false'"
+ test-attr="1"
+ type="button"
  @focus="onFocus"
  @blur="onBlur">
  <slot v-if="iconSlotIsPopulated" name="icon" />

diff --git a/src/components/AppNavigationItem/AppNavigationIconCollapsible.vue b/src/components/AppNavigationItem/AppNavigationIconCollapsible.vue
@@ -25,6 +25,7 @@
  <button
  class="icon-collapse"
  :class="{'icon-collapse--rotated':open}"
+ type="button"
  @click="onClick">
  <MenuDown :size="24" title="" decorative />
  </button>

diff --git a/src/components/AppNavigationNew/AppNavigationNew.vue b/src/components/AppNavigationNew/AppNavigationNew.vue
@@ -24,8 +24,8 @@
  <div class="app-navigation-new">
  <button :id="buttonId"
  :class="buttonClass"
- type="button"
  :disabled="disabled"
+ type="button"
  @click="$emit('click')">
  {{ text }}
  </button>

diff --git a/src/components/AppNavigationSettings/AppNavigationSettings.vue b/src/components/AppNavigationSettings/AppNavigationSettings.vue
@@ -25,7 +25,9 @@
  v-click-outside="clickOutsideConfig"
  :class="{ open }">
  <div id="app-settings-header">
- <button class="settings-button"
+ <button
+ class="settings-button"
+ type="button"
  @click="toggleMenu">
  {{ title }}
  </button>

diff --git a/src/components/ColorPicker/ColorPicker.vue b/src/components/ColorPicker/ColorPicker.vue
@@ -122,6 +122,7 @@ export default {
  :style="{'background-color': color }"
  class="color-picker__simple-color-circle"
  :class="{ 'color-picker__simple-color-circle--active' : color === currentColor }"
+ type="button"
  @click="pickColor(color)">
  <Check v-if="color === currentColor"
  :size="24"
@@ -141,18 +142,21 @@ export default {
  <button
  v-if="advanced"
  class="color-picker__navigation-button back"
+ type="button"
  @click="handleBack">
  <ArrowLeft :size="24" title="" decorative />
  </button>
  <button
  v-if="!advanced"
  class="color-picker__navigation-button more-settings"
+ type="button"
  @click="handleMoreSettings">
  <DotsHorizontal :size="24" title="" decorative />
  </button>
  <button
  v-if="advanced"
  class="color-picker__navigation-button confirm"
+ type="button"
  @click="handleConfirm">
  {{ t('Choose') }}
  </button>

diff --git a/src/components/Modal/Modal.vue b/src/components/Modal/Modal.vue
@@ -84,6 +84,7 @@ export default {
  v-tooltip.auto="playPauseTitle"
  :class="{ 'play-pause-icons--paused': slideshowPaused }"
  class="play-pause-icons"
+ type="button"
  @click="togglePlayPause">
  <!-- Play/pause icons -->
  <Play v-if="!playing"

diff --git a/src/components/PopoverMenu/PopoverMenuItem.vue b/src/components/PopoverMenu/PopoverMenuItem.vue
@@ -82,6 +82,7 @@
  class="menuitem focusable"
  :class="{active: item.active}"
  :disabled="item.disabled"
+ type="button"
  @click.stop.prevent="item.action">
  <span :class="item.icon" />
  <p v-if="item.text && item.longtext">