Require explicit type attribute on button elements (#4781)

.eslintrc.json

@@ -342,7 +342,8 @@
         // Custom DSpace Angular rules
         "dspace-angular-html/themed-component-usages": "error",
         "dspace-angular-html/no-disabled-attribute-on-button": "error",
-        "@angular-eslint/template/prefer-control-flow": "error"
+        "@angular-eslint/template/prefer-control-flow": "error",
+        "@angular-eslint/template/button-has-type": "error"
       }
     },
     {

src/app/access-control/bulk-access/bulk-access.component.html

@@ -7,10 +7,10 @@ <h1>{{ 'admin.access-control.bulk-access.title' | translate }}</h1>
   <hr>
 
   <div class="d-flex justify-content-end">
-    <button class="btn btn-outline-primary me-3" (click)="reset()">
+    <button type="button" class="btn btn-outline-primary me-3" (click)="reset()">
       {{ 'access-control-cancel' | translate }}
     </button>
-    <button class="btn btn-primary" [dsBtnDisabled]="!canExport()" (click)="submit()">
+    <button type="button" class="btn btn-primary" [dsBtnDisabled]="!canExport()" (click)="submit()">
       {{ 'access-control-execute' | translate }}
     </button>
   </div>

src/app/access-control/epeople-registry/epeople-registry.component.html

@@ -5,7 +5,7 @@
         <h1 id="header" class="pb-2">{{labelPrefix + 'head' | translate}}</h1>
 
         <div>
-          <button class="me-auto btn btn-success addEPerson-button"
+          <button type="button" class="me-auto btn btn-success addEPerson-button"
             [routerLink]="'create'">
             <i class="fas fa-plus"></i>
             <span class="d-none d-sm-inline ms-1">{{labelPrefix + 'button.add' | translate}}</span>
@@ -36,7 +36,7 @@ <h2 id="search" class="border-bottom pb-2">
           </div>
         </div>
         <div>
-          <button (click)="clearFormAndResetResult();"
+          <button type="button" (click)="clearFormAndResetResult();"
           class="search-button btn btn-secondary">{{labelPrefix + 'button.see-all' | translate}}</button>
         </div>
       </form>
@@ -69,13 +69,13 @@ <h2 id="search" class="border-bottom pb-2">
                     <td>{{epersonDto.eperson.email}}</td>
                     <td>
                       <div class="btn-group edit-field">
-                        <button [routerLink]="getEditEPeoplePage(epersonDto.eperson.id)"
+                        <button type="button" [routerLink]="getEditEPeoplePage(epersonDto.eperson.id)"
                           class="btn btn-outline-primary btn-sm access-control-editEPersonButton"
                           title="{{labelPrefix + 'table.edit.buttons.edit' | translate: { name: dsoNameService.getName(epersonDto.eperson) } }}">
                           <i class="fas fa-edit fa-fw"></i>
                         </button>
                         @if (epersonDto.ableToDelete) {
-                          <button (click)="deleteEPerson(epersonDto.eperson)"
+                          <button type="button" (click)="deleteEPerson(epersonDto.eperson)"
                             class="delete-button btn btn-outline-danger btn-sm access-control-deleteEPersonButton"
                             title="{{labelPrefix + 'table.edit.buttons.remove' | translate: { name: dsoNameService.getName(epersonDto.eperson) } }}">
                             <i class="fas fa-trash-alt fa-fw"></i>

src/app/access-control/epeople-registry/eperson-form/eperson-form.component.html

@@ -100,7 +100,7 @@ <h2>{{messagePrefix + '.groupsEPersonIsMemberOf' | translate}}</h2>
             <div class="alert alert-info w-100 mb-2" role="alert">
               <div>{{messagePrefix + '.memberOfNoGroups' | translate}}</div>
               <div>
-                <button [routerLink]="[groupsDataService.getGroupRegistryRouterLink()]"
+                <button type="button" [routerLink]="[groupsDataService.getGroupRegistryRouterLink()]"
                 class="btn btn-primary">{{messagePrefix + '.goToGroups' | translate}}</button>
               </div>
             </div>

src/app/access-control/group-registry/group-form/members-list/members-list.component.html

@@ -35,7 +35,7 @@ <h3>{{messagePrefix + '.headMembers' | translate}}</h3>
                 <td class="align-middle">
                   <div class="btn-group edit-field">
                     @if (epersonDTO.ableToDelete) {
-                      <button (click)="deleteMemberFromGroup(epersonDTO.eperson)"
+                      <button type="button" (click)="deleteMemberFromGroup(epersonDTO.eperson)"
                         [dsBtnDisabled]="actionConfig.remove.disabled"
                         [ngClass]="['btn btn-sm', actionConfig.remove.css]"
                         title="{{messagePrefix + '.table.edit.buttons.remove' | translate: { name: dsoNameService.getName(epersonDTO.eperson) } }}">
@@ -44,6 +44,7 @@ <h3>{{messagePrefix + '.headMembers' | translate}}</h3>
                     }
                     @if (!epersonDTO.ableToDelete) {
                       <button
+                        type="button"
                         (click)="addMemberToGroup(epersonDTO.eperson)"
                         [dsBtnDisabled]="actionConfig.add.disabled"
                         [ngClass]="['btn btn-sm', actionConfig.add.css]"
@@ -93,7 +94,7 @@ <h3 id="search" class="border-bottom pb-2">
         </div>
       </div>
       <div>
-        <button (click)="clearFormAndResetResult();"
+        <button type="button" (click)="clearFormAndResetResult();"
         class="btn btn-secondary">{{messagePrefix + '.button.see-all' | translate}}</button>
       </div>
     </form>
@@ -129,7 +130,7 @@ <h3 id="search" class="border-bottom pb-2">
                   </td>
                   <td class="align-middle">
                     <div class="btn-group edit-field">
-                      <button (click)="addMemberToGroup(eperson)"
+                      <button type="button"(click)="addMemberToGroup(eperson)"
                         [dsBtnDisabled]="actionConfig.add.disabled"
                         [ngClass]="['btn btn-sm', actionConfig.add.css]"
                         title="{{messagePrefix + '.table.edit.buttons.add' | translate: { name: dsoNameService.getName(eperson) } }}">

src/app/access-control/group-registry/group-form/subgroup-list/subgroups-list.component.html

@@ -32,7 +32,7 @@ <h4>{{messagePrefix + '.headSubgroups' | translate}}</h4>
                 <td class="align-middle">{{ dsoNameService.getName((group.object | async)?.payload)}}</td>
                 <td class="align-middle">
                   <div class="btn-group edit-field">
-                    <button (click)="deleteSubgroupFromGroup(group)"
+                    <button type="button" (click)="deleteSubgroupFromGroup(group)"
                       class="btn btn-outline-danger btn-sm deleteButton"
                       title="{{messagePrefix + '.table.edit.buttons.remove' | translate: { name: dsoNameService.getName(group) } }}">
                       <i class="fas fa-trash-alt fa-fw"></i>
@@ -80,7 +80,7 @@ <h4 id="search" class="border-bottom pb-2">
       </div>
     </div>
     <div>
-      <button (click)="clearFormAndResetResult();" class="btn btn-secondary float-end">
+      <button type="button"(click)="clearFormAndResetResult();" class="btn btn-secondary float-end">
         {{messagePrefix + '.button.see-all' | translate}}
       </button>
     </div>
@@ -115,7 +115,7 @@ <h4 id="search" class="border-bottom pb-2">
                 <td class="align-middle">{{ dsoNameService.getName((group.object | async)?.payload) }}</td>
                 <td class="align-middle">
                   <div class="btn-group edit-field">
-                    <button (click)="addSubgroupToGroup(group)"
+                    <button type="button" (click)="addSubgroupToGroup(group)"
                       class="btn btn-outline-primary btn-sm addButton"
                       title="{{messagePrefix + '.table.edit.buttons.add' | translate: { name: dsoNameService.getName(group) } }}">
                       <i class="fas fa-plus fa-fw"></i>

src/app/access-control/group-registry/groups-registry.component.html

@@ -4,7 +4,7 @@
       <div class="d-flex justify-content-between border-bottom mb-3">
         <h1 id="header" class="pb-2">{{messagePrefix + 'head' | translate}}</h1>
         <div>
-          <button class="me-auto btn btn-success"
+          <button type="button" class="me-auto btn btn-success"
             [routerLink]="'create'">
             <i class="fas fa-plus"></i>
             <span class="d-none d-sm-inline ms-1">{{messagePrefix + 'button.add' | translate}}</span>
@@ -27,7 +27,7 @@ <h2 id="search" class="border-bottom pb-2">{{messagePrefix + 'search.head' | tra
           </div>
         </div>
         <div>
-          <button (click)="clearFormAndResetResult();" class="btn btn-secondary">
+          <button type="button" (click)="clearFormAndResetResult();" class="btn btn-secondary">
             {{messagePrefix + 'button.see-all' | translate}}
           </button>
         </div>
@@ -65,7 +65,8 @@ <h2 id="search" class="border-bottom pb-2">{{messagePrefix + 'search.head' | tra
                         @switch (groupDto.ableToEdit) {
                           @case (true) {
                             <button
-                              [routerLink]="getGroupEditPageRouterLink(groupDto.group)"
+                              type="button"
+                              [routerLink]="groupService.getGroupEditPageRouterLink(groupDto.group)"
                               class="btn btn-outline-primary btn-sm btn-edit"
                               title="{{messagePrefix + 'table.edit.buttons.edit' | translate: {name: dsoNameService.getName(groupDto.group) } }}"
                               >
@@ -74,6 +75,7 @@ <h2 id="search" class="border-bottom pb-2">{{messagePrefix + 'search.head' | tra
                           }
                           @case (false) {
                             <button
+                              type="button"
                               [dsBtnDisabled]="true"
                               class="btn btn-outline-primary btn-sm btn-edit"
                               placement="left"
@@ -85,7 +87,8 @@ <h2 id="search" class="border-bottom pb-2">{{messagePrefix + 'search.head' | tra
                         }
                         @if (!groupDto.group?.permanent && groupDto.ableToDelete) {
                           <button
-                            (click)="confirmDelete(groupDto)" class="btn btn-outline-danger btn-sm btn-delete"
+                            type="button"
+                            (click)="deleteGroup(groupDto)" class="btn btn-outline-danger btn-sm btn-delete"
                             title="{{messagePrefix + 'table.edit.buttons.remove' | translate: {name: dsoNameService.getName(groupDto.group) } }}">
                             <i class="fas fa-trash-alt fa-fw"></i>
                           </button>

src/app/admin/admin-import-batch-page/batch-import-page.component.html

@@ -8,7 +8,7 @@ <h1 id="header">{{'admin.batch-import.page.header' | translate}}</h1>
     </p>
   }
   <p>
-    <button class="btn btn-primary" (click)="this.selectCollection();">{{'admin.metadata-import.page.button.select-collection' | translate}}</button>
+    <button type="button" class="btn btn-primary" (click)="this.selectCollection();">{{'admin.metadata-import.page.button.select-collection' | translate}}</button>
   </p>
   <div class="mb-3">
     <div class="form-check">
@@ -49,9 +49,9 @@ <h1 id="header">{{'admin.batch-import.page.header' | translate}}</h1>
   }
 
   <div class="space-children-mr">
-    <button class="btn btn-secondary" id="backButton"
+    <button type="button"class="btn btn-secondary" id="backButton"
     (click)="this.onReturn();">{{'admin.metadata-import.page.button.return' | translate}}</button>
-    <button class="btn btn-primary" id="proceedButton"
+    <button type="button" class="btn btn-primary" id="proceedButton"
     (click)="this.importMetadata();">{{'admin.metadata-import.page.button.proceed' | translate}}</button>
   </div>
 </div>

src/app/admin/admin-import-metadata-page/metadata-import-page.component.html

@@ -20,9 +20,9 @@ <h1 id="header">{{'admin.metadata-import.page.header' | translate}}</h1>
   </ds-file-dropzone-no-uploader>
 
   <div class="space-children-mr">
-    <button class="btn btn-secondary" id="backButton"
+    <button type="button" class="btn btn-secondary" id="backButton"
             (click)="this.onReturn();">{{'admin.metadata-import.page.button.return' | translate}}</button>
-    <button class="btn btn-primary" id="proceedButton"
+    <button type="button" class="btn btn-primary" id="proceedButton"
             (click)="this.importMetadata();">{{'admin.metadata-import.page.button.proceed' | translate}}</button>
   </div>
 </div>

src/app/admin/admin-ldn-services/ldn-service-form/ldn-service-form.component.html

@@ -336,22 +336,22 @@ <h4>{{'service.overview.create.modal' | translate }}</h4>
     <div class="modal-footer">
       @if (!isNewService) {
         <div>
-          <button (click)="closeModal()" class="btn btn-outline-secondary me-2"
+          <button type="button" (click)="closeModal()" class="btn btn-outline-secondary me-2"
             id="delete-confirm-edit">{{ 'service.detail.return' | translate }}
           </button>
           @if (!isNewService) {
-            <button (click)="patchService()"
+            <button type="button"(click)="patchService()"
               class="btn btn-primary">{{ 'service.detail.update' | translate }}
             </button>
           }
         </div>
       }
       @if (isNewService) {
         <div>
-          <button (click)="closeModal()" class="btn btn-outline-secondary me-2 "
+          <button type="button"(click)="closeModal()" class="btn btn-outline-secondary me-2 "
             id="delete-confirm-new">{{ 'service.refuse.create' | translate }}
           </button>
-          <button (click)="createService()"
+          <button type="button" (click)="createService()"
             class="btn btn-primary">{{ 'service.confirm.create' | translate }}
           </button>
         </div>

src/app/admin/admin-ldn-services/ldn-services-directory/ldn-services-directory.component.html

@@ -3,7 +3,7 @@
     <h1 class="flex-grow-1">{{ 'ldn-registered-services.title' | translate }}</h1>
   </div>
   <div class="d-flex justify-content-end">
-    <button class="btn btn-success" routerLink="/admin/ldn/services/new"><i
+    <button type="button" class="btn btn-success" routerLink="/admin/ldn/services/new"><i
     class="fas fa-plus pe-2"></i>{{ 'process.overview.new' | translate }}</button>
   </div>
   @if ((ldnServicesRD$ | async)?.payload?.totalElements > 0) {
@@ -46,12 +46,13 @@ <h1 class="flex-grow-1">{{ 'ldn-registered-services.title' | translate }}</h1>
                 <td>
                   <div class="btn-group">
                     <button
+                      type="button"
                       (click)="selectServiceToDelete(ldnService.id)"
                       [attr.aria-label]="'ldn-service-overview-select-delete' | translate"
                       class="btn btn-outline-danger">
                       <i class="fas fa-trash"></i>
                     </button>
-                    <button [routerLink]="['/admin/ldn/services/edit/', ldnService.id]"
+                    <button type="button"[routerLink]="['/admin/ldn/services/edit/', ldnService.id]"
                       [attr.aria-label]="'ldn-service-overview-select-edit' | translate"
                       class="btn btn-outline-dark">
                       <i class="fas fa-edit"></i>
@@ -85,11 +86,11 @@ <h4>{{'service.overview.delete.header' | translate }}</h4>
       <div>
         {{ 'service.overview.delete.body' | translate }}
       </div>
-      <div class="mt-4 text-end">
-        <button (click)="closeModal()"
+      <div class="mt-4 text-right">
+        <button  type="button" (click)="closeModal()"
           [attr.aria-label]="'ldn-service-overview-close-modal' | translate"
         class="btn btn-outline-secondary me-2">{{ 'service.detail.delete.cancel' | translate }}</button>
-        <button (click)="deleteSelected(this.selectedServiceId.toString(), ldnServicesService)"
+        <button type="button" (click)="deleteSelected(this.selectedServiceId.toString(), ldnServicesService)"
           class="btn btn-danger"
           [attr.aria-label]="'ldn-service-overview-select-delete' | translate"
           id="delete-confirm">{{ 'service.overview.delete' | translate }}

src/app/admin/admin-notify-dashboard/admin-notify-detail-modal/admin-notify-detail-modal.component.html

@@ -14,7 +14,7 @@ <h4 class="modal-title">{{'notify-message-modal.title' | translate}}</h4>
   }
 
   <div class="d-flex justify-content-end">
-    <button class="btn-primary" (click)="toggleCoarMessage()">
+    <button type="button" class="btn-primary" (click)="toggleCoarMessage()">
       {{'notify-message-modal.show-message' | translate}}
     </button>
   </div>

src/app/admin/admin-notify-dashboard/admin-notify-logs/admin-notify-logs-result/admin-notify-logs-result.component.html

@@ -4,7 +4,7 @@
     <div class="col-md-9">
       <div class="h4">
         @if ((selectedSearchConfig$ | async) !== defaultConfiguration) {
-          <button (click)="resetDefaultConfiguration()" class="badge bg-primary me-1 mb-1">
+          <button type="button" (click)="resetDefaultConfiguration()" class="badge bg-primary me-1 mb-1">
             {{ 'admin-notify-logs.' + (selectedSearchConfig$ | async) | translate}}
             <span> ×</span>
           </button>

src/app/admin/admin-notify-dashboard/admin-notify-search-result/admin-notify-search-result.component.html

@@ -49,9 +49,10 @@
           </td>
           <td>
             <div class="d-flex flex-column">
-              <button class="btn mb-2 btn-dark" (click)="openDetailModal(message)">{{ 'notify-message-result.detail' | translate }}</button>
+              <button type="button" class="btn mb-2 btn-dark" (click)="openDetailModal(message)">{{ 'notify-message-result.detail' | translate }}</button>
               @if (message.queueStatusLabel !== reprocessStatus && validStatusesForReprocess.includes(message.queueStatusLabel)) {
-                <button
+                <button 
+                  type="button"
                   (click)="reprocessMessage(message)"
                   class="btn btn-warning"
                   >

src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.html

@@ -59,7 +59,7 @@ <h1 id="header" class="border-bottom pb-2">{{'admin.registries.bitstream-formats
 
       <div>
         @if ((bitstreamFormats$ | async)?.payload?.page?.length > 0) {
-          <button class="btn btn-primary deselect" (click)="deselectAll()">{{'admin.registries.bitstream-formats.table.deselect-all' | translate}}</button>
+          <button type="button" class="btn btn-primary deselect" (click)="deselectAll()">{{'admin.registries.bitstream-formats.table.deselect-all' | translate}}</button>
         }
         @if ((bitstreamFormats$ | async)?.payload?.page?.length > 0) {
           <button type="submit" class="btn btn-danger float-end" (click)="deleteFormats()">{{'admin.registries.bitstream-formats.table.delete' | translate}}</button>

src/app/admin/admin-registries/metadata-registry/metadata-registry.component.html

@@ -56,7 +56,7 @@ <h1 id="header" class="border-bottom pb-2">{{'admin.registries.metadata.head' |
 
       <div>
         @if ((metadataSchemas | async)?.payload?.page?.length > 0) {
-          <button type="submit" class="btn btn-danger float-end" (click)="deleteSchemas()">{{'admin.registries.metadata.schemas.table.delete' | translate}}</button>
+          <button type="button" class="btn btn-danger float-end" (click)="deleteSchemas()">{{'admin.registries.metadata.schemas.table.delete' | translate}}</button>
         }
       </div>
 

src/app/admin/admin-registries/metadata-schema/metadata-schema.component.html

@@ -57,7 +57,7 @@ <h2>{{'admin.registries.schema.fields.head' | translate}}</h2>
         }
 
         <div>
-          <button [routerLink]="['/admin/registries/metadata']" class="btn btn-primary">{{'admin.registries.schema.return' | translate}}</button>
+          <button type="button" [routerLink]="['/admin/registries/metadata']" class="btn btn-primary">{{'admin.registries.schema.return' | translate}}</button>
           @if (fields?.page?.length > 0) {
             <button type="submit" class="btn btn-danger float-end" (click)="deleteFields()">{{'admin.registries.schema.fields.table.delete' | translate}}</button>
           }

src/app/admin/admin-reports/filtered-collections/filtered-collections.component.html

@@ -14,12 +14,12 @@ <h1 id="header" class="border-bottom pb-2">{{ "admin.reports.collections.head" |
               <div class="container">
                 <div class="row">
                   <span class="col-3"></span>
-                  <button class="btn btn-primary mt-1 col-6" (click)="submit()">{{ "admin.reports.button.show-collections" | translate }}</button>
+                  <button type="button" class="btn btn-primary mt-1 col-6" (click)="submit()">{{ "admin.reports.button.show-collections" | translate }}</button>
                 </div>
                 <ds-filters [filtersForm]="filtersFormGroup()"></ds-filters>
                 <div class="row">
                   <span class="col-3"></span>
-                  <button class="btn btn-primary mt-1 col-6" (click)="submit()">{{ "admin.reports.button.show-collections" | translate }}</button>
+                  <button type="button" class="btn btn-primary mt-1 col-6" (click)="submit()">{{ "admin.reports.button.show-collections" | translate }}</button>
                 </div>
               </div>
             </ng-template>