From 343a1498acb05ccc2064d4fb8ca0f0275b354cbb Mon Sep 17 00:00:00 2001
From: Yana De Pauw <yana@atmire.com>
Date: Fri, 30 Aug 2019 15:41:50 +0200
Subject: [PATCH] Prevent navigation by link from collection-list component
---
.../dso-input-suggestions.component.html | 6 ++++--
.../dso-input-suggestions.component.spec.ts | 2 +-
.../input-suggestions.component.scss | 11 +++++++++++
3 files changed, 16 insertions(+), 3 deletions(-)
diff --git a/src/app/shared/input-suggestions/dso-input-suggestions/dso-input-suggestions.component.html b/src/app/shared/input-suggestions/dso-input-suggestions/dso-input-suggestions.component.html
index 12b5132202..2b605ccdc6 100644
--- a/src/app/shared/input-suggestions/dso-input-suggestions/dso-input-suggestions.component.html
+++ b/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>
diff --git a/src/app/shared/input-suggestions/dso-input-suggestions/dso-input-suggestions.component.spec.ts b/src/app/shared/input-suggestions/dso-input-suggestions/dso-input-suggestions.component.spec.ts
index 2e343a6834..4229060e86 100644
--- a/src/app/shared/input-suggestions/dso-input-suggestions/dso-input-suggestions.component.spec.ts
+++ b/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();
});
diff --git a/src/app/shared/input-suggestions/input-suggestions.component.scss b/src/app/shared/input-suggestions/input-suggestions.component.scss
index b04cef2adf..eb0db5ed42 100644
--- a/src/app/shared/input-suggestions/input-suggestions.component.scss
+++ b/src/app/shared/input-suggestions/input-suggestions.component.scss
@@ -1,12 +1,23 @@
.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;
+ }
}
}
--
GitLab