Commit dd633dc4 authored by Phil Hughes's avatar Phil Hughes

Merge branch '42157-41989-fix-duplicate-in-create-item-dropdown' into 'master'

Fix duplicate item in protected branch/tag dropdowns

Closes #42157 and #41989

See merge request gitlab-org/gitlab-ce!16540
parents 774e7512 ea04d1ab
...@@ -65,7 +65,17 @@ export default class CreateItemDropdown { ...@@ -65,7 +65,17 @@ export default class CreateItemDropdown {
getData(term, callback) { getData(term, callback) {
this.getDataOption(term, (data = []) => { this.getDataOption(term, (data = []) => {
callback(data.concat(this.selectedItem || [])); // Ensure the selected item isn't already in the data to avoid duplicates
const alreadyHasSelectedItem = this.selectedItem && data.some(item =>
item.id === this.selectedItem.id,
);
let uniqueData = data;
if (!alreadyHasSelectedItem) {
uniqueData = data.concat(this.selectedItem || []);
}
callback(uniqueData);
}); });
} }
......
---
title: Fix duplicate item in protected branch/tag dropdown
merge_request:
author:
type: fixed
import CreateItemDropdown from '~/create_item_dropdown';
const DROPDOWN_ITEM_DATA = [{
title: 'one',
id: 'one',
text: 'one',
}, {
title: 'two',
id: 'two',
text: 'two',
}, {
title: 'three',
id: 'three',
text: 'three',
}];
describe('CreateItemDropdown', () => {
preloadFixtures('static/create_item_dropdown.html.raw');
let $wrapperEl;
beforeEach(() => {
loadFixtures('static/create_item_dropdown.html.raw');
$wrapperEl = $('.js-create-item-dropdown-fixture-root');
// eslint-disable-next-line no-new
new CreateItemDropdown({
$dropdown: $wrapperEl.find('.js-dropdown-menu-toggle'),
defaultToggleLabel: 'All variables',
fieldName: 'variable[environment]',
getData: (term, callback) => {
callback(DROPDOWN_ITEM_DATA);
},
});
});
afterEach(() => {
$wrapperEl.remove();
});
it('should have a dropdown item for each piece of data', () => {
// Get the data in the dropdown
$('.js-dropdown-menu-toggle').click();
const $itemEls = $wrapperEl.find('.js-dropdown-content a');
expect($itemEls.length).toEqual(DROPDOWN_ITEM_DATA.length);
});
describe('created items', () => {
const NEW_ITEM_TEXT = 'foobarbaz';
function createItemAndClearInput(text) {
// Filter for the new item
$wrapperEl.find('.dropdown-input-field')
.val(text)
.trigger('input');
// Create the new item
const $createButton = $wrapperEl.find('.js-dropdown-create-new-item');
$createButton.click();
// Clear out the filter
$wrapperEl.find('.dropdown-input-field')
.val('')
.trigger('input');
}
beforeEach(() => {
// Open the dropdown
$('.js-dropdown-menu-toggle').click();
// Filter for the new item
$wrapperEl.find('.dropdown-input-field')
.val(NEW_ITEM_TEXT)
.trigger('input');
});
it('create new item button should include the filter text', () => {
expect($wrapperEl.find('.js-dropdown-create-new-item code').text()).toEqual(NEW_ITEM_TEXT);
});
it('should update the dropdown with the newly created item', () => {
// Create the new item
const $createButton = $wrapperEl.find('.js-dropdown-create-new-item');
$createButton.click();
expect($wrapperEl.find('.dropdown-toggle-text').text()).toEqual(NEW_ITEM_TEXT);
expect($wrapperEl.find('input[name="variable[environment]"]').val()).toEqual(NEW_ITEM_TEXT);
});
it('should include newly created item in dropdown list', () => {
createItemAndClearInput(NEW_ITEM_TEXT);
const $itemEls = $wrapperEl.find('.js-dropdown-content a');
expect($itemEls.length).toEqual(1 + DROPDOWN_ITEM_DATA.length);
expect($($itemEls.get(DROPDOWN_ITEM_DATA.length)).text()).toEqual(NEW_ITEM_TEXT);
});
it('should not duplicate an item when trying to create an existing item', () => {
createItemAndClearInput(DROPDOWN_ITEM_DATA[0].text);
const $itemEls = $wrapperEl.find('.js-dropdown-content a');
expect($itemEls.length).toEqual(DROPDOWN_ITEM_DATA.length);
});
});
});
.js-create-item-dropdown-fixture-root
%input{ name: 'variable[environment]', type: 'hidden' }
= dropdown_tag('some label',
options: { toggle_class: 'js-dropdown-menu-toggle',
content_class: 'js-dropdown-content',
filter: true,
dropdown_class: "dropdown-menu-selectable",
footer_content: true }) do
%ul.dropdown-footer-list
%li
%button{ class: "dropdown-create-new-item-button js-dropdown-create-new-item" }
Create wildcard
%code
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