Commit 500d3a99 authored by Clement Ho's avatar Clement Ho

Merge branch 'winh-no-current-user-search-bar' into 'master'

Add condition if there is a current user to DropdownUser

See merge request !12415
parents 65c40449 6ab12777
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
import AjaxFilter from '~/droplab/plugins/ajax_filter'; import AjaxFilter from '~/droplab/plugins/ajax_filter';
import './filtered_search_dropdown'; import './filtered_search_dropdown';
import { addClassIfElementExists } from '../lib/utils/dom_utils';
class DropdownUser extends gl.FilteredSearchDropdown { class DropdownUser extends gl.FilteredSearchDropdown {
constructor(droplab, dropdown, input, tokenKeys, filter) { constructor(droplab, dropdown, input, tokenKeys, filter) {
...@@ -32,8 +33,7 @@ class DropdownUser extends gl.FilteredSearchDropdown { ...@@ -32,8 +33,7 @@ class DropdownUser extends gl.FilteredSearchDropdown {
} }
hideCurrentUser() { hideCurrentUser() {
const currenUserItem = this.dropdown.querySelector('.js-current-user'); addClassIfElementExists(this.dropdown.querySelector('.js-current-user'), 'hidden');
currenUserItem.classList.add('hidden');
} }
itemClicked(e) { itemClicked(e) {
......
...@@ -3,6 +3,7 @@ import RecentSearchesRoot from './recent_searches_root'; ...@@ -3,6 +3,7 @@ import RecentSearchesRoot from './recent_searches_root';
import RecentSearchesStore from './stores/recent_searches_store'; import RecentSearchesStore from './stores/recent_searches_store';
import RecentSearchesService from './services/recent_searches_service'; import RecentSearchesService from './services/recent_searches_service';
import eventHub from './event_hub'; import eventHub from './event_hub';
import { addClassIfElementExists } from '../lib/utils/dom_utils';
class FilteredSearchManager { class FilteredSearchManager {
constructor(page) { constructor(page) {
...@@ -227,11 +228,7 @@ class FilteredSearchManager { ...@@ -227,11 +228,7 @@ class FilteredSearchManager {
} }
addInputContainerFocus() { addInputContainerFocus() {
const inputContainer = this.filteredSearchInput.closest('.filtered-search-box'); addClassIfElementExists(this.filteredSearchInput.closest('.filtered-search-box'), 'focus');
if (inputContainer) {
inputContainer.classList.add('focus');
}
} }
removeInputContainerFocus(e) { removeInputContainerFocus(e) {
......
/* eslint-disable import/prefer-default-export */
export const addClassIfElementExists = (element, className) => {
if (element) {
element.classList.add(className);
}
};
...@@ -66,4 +66,38 @@ describe('Dropdown User', () => { ...@@ -66,4 +66,38 @@ describe('Dropdown User', () => {
window.gon = {}; window.gon = {};
}); });
}); });
describe('hideCurrentUser', () => {
const fixtureTemplate = 'issues/issue_list.html.raw';
preloadFixtures(fixtureTemplate);
let dropdown;
let authorFilterDropdownElement;
beforeEach(() => {
loadFixtures(fixtureTemplate);
authorFilterDropdownElement = document.querySelector('#js-dropdown-author');
const dummyInput = document.createElement('div');
dropdown = new gl.DropdownUser(null, authorFilterDropdownElement, dummyInput);
});
const findCurrentUserElement = () => authorFilterDropdownElement.querySelector('.js-current-user');
it('hides the current user from dropdown', () => {
const currentUserElement = findCurrentUserElement();
expect(currentUserElement).not.toBe(null);
dropdown.hideCurrentUser();
expect(currentUserElement.classList).toContain('hidden');
});
it('does nothing if no user is logged in', () => {
const currentUserElement = findCurrentUserElement();
currentUserElement.parentNode.removeChild(currentUserElement);
expect(findCurrentUserElement()).toBe(null);
dropdown.hideCurrentUser();
});
});
}); });
import { addClassIfElementExists } from '~/lib/utils/dom_utils';
describe('DOM Utils', () => {
describe('addClassIfElementExists', () => {
const className = 'biology';
const fixture = `
<div class="parent">
<div class="child"></div>
</div>
`;
let parentElement;
beforeEach(() => {
setFixtures(fixture);
parentElement = document.querySelector('.parent');
});
it('adds class if element exists', () => {
const childElement = parentElement.querySelector('.child');
expect(childElement).not.toBe(null);
addClassIfElementExists(childElement, className);
expect(childElement.classList).toContain(className);
});
it('does not throw if element does not exist', () => {
const childElement = parentElement.querySelector('.other-child');
expect(childElement).toBe(null);
addClassIfElementExists(childElement, className);
});
});
});
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment