Prevent navigation by link from collection-list component

src/app/shared/input-suggestions/dso-input-suggestions/dso-input-suggestions.component.html

@@ -13,9 +13,11 @@
     <div class="autocomplete dropdown-menu" [ngClass]="{'show': (show | async) && isNotEmpty(suggestions)}">
         <div class="dropdown-list">
             <div *ngFor="let suggestionOption of suggestions">
-                <a href="#" class="d-block dropdown-item"  (click)="onClickSuggestion(suggestionOption)" #suggestion>
+                <button class="d-block dropdown-item"  (click)="onClickSuggestion(suggestionOption)" #suggestion>
+                    <div class="click-blocker">
+                    </div>
                     <ds-wrapper-list-element [object]="suggestionOption"></ds-wrapper-list-element>
-                </a>
+                </button>
             </div>
         </div>
     </div>

src/app/shared/input-suggestions/dso-input-suggestions/dso-input-suggestions.component.spec.ts

@@ -60,7 +60,7 @@ describe('DsoInputSuggestionsComponent', () => {
     const clickedIndex = 0;
     beforeEach(() => {
       spyOn(comp, 'onClickSuggestion');
-      const clickedLink = de.query(By.css('.dropdown-list > div:nth-child(' + (clickedIndex + 1) + ') a'));
+      const clickedLink = de.query(By.css('.dropdown-list > div:nth-child(' + (clickedIndex + 1) + ') button'));
       clickedLink.triggerEventHandler('click', {});
       fixture.detectChanges();
     });

src/app/shared/input-suggestions/input-suggestions.component.scss

 .autocomplete {
     width: 100%;
+
     .dropdown-item {
         white-space: normal;
         word-break: break-word;
         padding: $input-padding-y $input-padding-x;
+        position: relative;
+
         &:focus {
             outline: none;
         }
+
+        .click-blocker {
+            position: absolute;
+            top: 0;
+            left: 0;
+            right: 0;
+            bottom: 0;
+        }
     }
 }