130 lines
3.9 KiB
JavaScript
130 lines
3.9 KiB
JavaScript
import { shallowMount } from '@vue/test-utils';
|
|
import eventHub from '~/filtered_search/event_hub';
|
|
import RecentSearchesDropdownContent from '~/filtered_search/components/recent_searches_dropdown_content.vue';
|
|
import IssuableFilteredSearchTokenKeys from '~/filtered_search/issuable_filtered_search_token_keys';
|
|
|
|
describe('Recent Searches Dropdown Content', () => {
|
|
let wrapper;
|
|
|
|
const findLocalStorageNote = () => wrapper.find({ ref: 'localStorageNote' });
|
|
const findDropdownItems = () => wrapper.findAll({ ref: 'dropdownItem' });
|
|
const findDropdownNote = () => wrapper.find({ ref: 'dropdownNote' });
|
|
|
|
const createComponent = props => {
|
|
wrapper = shallowMount(RecentSearchesDropdownContent, {
|
|
propsData: {
|
|
allowedKeys: IssuableFilteredSearchTokenKeys.getKeys(),
|
|
items: [],
|
|
isLocalStorageAvailable: false,
|
|
...props,
|
|
},
|
|
});
|
|
};
|
|
|
|
afterEach(() => {
|
|
wrapper.destroy();
|
|
wrapper = null;
|
|
});
|
|
|
|
describe('when local storage is not available', () => {
|
|
beforeEach(() => {
|
|
createComponent();
|
|
});
|
|
|
|
it('renders a note about enabling local storage', () => {
|
|
expect(findLocalStorageNote().exists()).toBe(true);
|
|
});
|
|
|
|
it('does not render dropdown items', () => {
|
|
expect(findDropdownItems().exists()).toBe(false);
|
|
});
|
|
|
|
it('does not render dropdownNote', () => {
|
|
expect(findDropdownNote().exists()).toBe(false);
|
|
});
|
|
});
|
|
|
|
describe('when localStorage is available and items array is not empty', () => {
|
|
let onRecentSearchesItemSelectedSpy;
|
|
let onRequestClearRecentSearchesSpy;
|
|
|
|
beforeAll(() => {
|
|
onRecentSearchesItemSelectedSpy = jest.fn();
|
|
onRequestClearRecentSearchesSpy = jest.fn();
|
|
eventHub.$on('recentSearchesItemSelected', onRecentSearchesItemSelectedSpy);
|
|
eventHub.$on('requestClearRecentSearches', onRequestClearRecentSearchesSpy);
|
|
});
|
|
|
|
beforeEach(() => {
|
|
createComponent({
|
|
items: [
|
|
'foo',
|
|
'author:@root label:~foo bar',
|
|
[{ type: 'author_username', value: { data: 'toby', operator: '=' } }],
|
|
],
|
|
isLocalStorageAvailable: true,
|
|
});
|
|
});
|
|
|
|
afterAll(() => {
|
|
eventHub.$off('recentSearchesItemSelected', onRecentSearchesItemSelectedSpy);
|
|
eventHub.$off('requestClearRecentSearchesSpy', onRequestClearRecentSearchesSpy);
|
|
});
|
|
|
|
it('does not render a note about enabling local storage', () => {
|
|
expect(findLocalStorageNote().exists()).toBe(false);
|
|
});
|
|
|
|
it('does not render dropdownNote', () => {
|
|
expect(findDropdownNote().exists()).toBe(false);
|
|
});
|
|
|
|
it('renders a correct amount of dropdown items', () => {
|
|
expect(findDropdownItems()).toHaveLength(2); // Ignore non-string recent item
|
|
});
|
|
|
|
it('expect second dropdown to have 2 tokens', () => {
|
|
expect(
|
|
findDropdownItems()
|
|
.at(1)
|
|
.findAll('.js-dropdown-token'),
|
|
).toHaveLength(2);
|
|
});
|
|
|
|
it('emits recentSearchesItemSelected on dropdown item click', () => {
|
|
findDropdownItems()
|
|
.at(0)
|
|
.find('.js-dropdown-button')
|
|
.trigger('click');
|
|
|
|
expect(onRecentSearchesItemSelectedSpy).toHaveBeenCalledWith('foo');
|
|
});
|
|
|
|
it('emits requestClearRecentSearches on Clear resent searches button', () => {
|
|
wrapper.find({ ref: 'clearButton' }).trigger('click');
|
|
|
|
expect(onRequestClearRecentSearchesSpy).toHaveBeenCalled();
|
|
});
|
|
});
|
|
|
|
describe('when locale storage is available and items array is empty', () => {
|
|
beforeEach(() => {
|
|
createComponent({
|
|
isLocalStorageAvailable: true,
|
|
});
|
|
});
|
|
|
|
it('does not render a note about enabling local storage', () => {
|
|
expect(findLocalStorageNote().exists()).toBe(false);
|
|
});
|
|
|
|
it('does not render dropdown items', () => {
|
|
expect(findDropdownItems().exists()).toBe(false);
|
|
});
|
|
|
|
it('renders dropdown note', () => {
|
|
expect(findDropdownNote().exists()).toBe(true);
|
|
});
|
|
});
|
|
});
|