Commit 61e33265 authored by Clement Ho's avatar Clement Ho

Merge branch 'winh-search-dropdowns-ee' into 'master'

Make search dropdowns consistent

See merge request !2804
parents e5e3f88e bafcae5c
......@@ -654,10 +654,15 @@ GitLabDropdown = (function() {
if (!selected) {
fieldName = this.options.fieldName;
field = this.dropdown.parent().find("input[name='" + fieldName + "'][value='" + value + "']");
if (value) {
field = this.dropdown.parent().find(`input[name='${fieldName}'][value='${value}']`);
if (field.length) {
selected = true;
}
} else {
field = this.dropdown.parent().find(`input[name='${fieldName}']`);
selected = !field.length;
}
}
// Set URL
if (this.options.url != null) {
......
......@@ -757,6 +757,7 @@
button {
border-radius: 0;
padding: 8px 16px;
white-space: normal;
// make sure the text color is not overriden
&.text-danger {
......
......@@ -190,6 +190,8 @@ input[type="checkbox"]:hover {
}
.search-holder {
@include new-style-dropdown;
@media (min-width: $screen-sm-min) {
display: -webkit-flex;
display: flex;
......
......@@ -4,7 +4,10 @@ import '~/gl_dropdown';
import '~/lib/utils/common_utils';
import '~/lib/utils/url_utility';
(() => {
describe('glDropdown', function describeDropdown() {
preloadFixtures('static/gl_dropdown.html.raw');
loadJSONFixtures('projects.json');
const NON_SELECTABLE_CLASSES = '.divider, .separator, .dropdown-header, .dropdown-menu-empty-link';
const SEARCH_INPUT_SELECTOR = '.dropdown-input-field';
const ITEM_SELECTOR = `.dropdown-content li:not(${NON_SELECTABLE_CLASSES})`;
......@@ -39,10 +42,6 @@ import '~/lib/utils/url_utility';
remoteCallback = callback.bind({}, data);
};
describe('Dropdown', function describeDropdown() {
preloadFixtures('static/gl_dropdown.html.raw');
loadJSONFixtures('projects.json');
function initDropDown(hasRemote, isFilterable, extraOpts = {}) {
const options = Object.assign({
selectable: true,
......@@ -52,9 +51,8 @@ import '~/lib/utils/url_utility';
fields: ['name']
},
text: project => (project.name_with_namespace || project.name),
id: project => project.id
id: project => project.id,
}, extraOpts);
this.dropdownButtonElement = $('#js-project-dropdown', this.dropdownContainerElement).glDropdown(options);
}
......@@ -222,5 +220,39 @@ import '~/lib/utils/url_utility';
.trigger('focus');
expect($searchInput.val()).toEqual('g');
});
describe('renderItem', () => {
describe('without selected value', () => {
let dropdown;
beforeEach(() => {
const dropdownOptions = {
};
const $dropdownDiv = $('<div />');
$dropdownDiv.glDropdown(dropdownOptions);
dropdown = $dropdownDiv.data('glDropdown');
});
it('marks items without ID as active', () => {
const dummyData = { };
const html = dropdown.renderItem(dummyData, null, null);
const link = html.querySelector('a');
expect(link).toHaveClass('is-active');
});
it('does not mark items with ID as active', () => {
const dummyData = {
id: 'ea'
};
const html = dropdown.renderItem(dummyData, null, null);
const link = html.querySelector('a');
expect(link).not.toHaveClass('is-active');
});
});
});
})();
});
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