69 lines
2.1 KiB
JavaScript
69 lines
2.1 KiB
JavaScript
import { GlCollapse } from '@gitlab/ui';
|
|
import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
|
|
import { s__ } from '~/locale';
|
|
import SearchResults from '~/super_sidebar/components/search_results.vue';
|
|
import ItemsList from '~/super_sidebar/components/items_list.vue';
|
|
import { stubComponent } from 'helpers/stub_component';
|
|
|
|
const title = s__('Navigation|PROJECTS');
|
|
const noResultsText = s__('Navigation|No project matches found');
|
|
|
|
describe('SearchResults component', () => {
|
|
let wrapper;
|
|
|
|
const findSearchResultsToggle = () => wrapper.findByTestId('search-results-toggle');
|
|
const findCollapsibleSection = () => wrapper.findComponent(GlCollapse);
|
|
const findItemsList = () => wrapper.findComponent(ItemsList);
|
|
const findEmptyText = () => wrapper.findByTestId('empty-text');
|
|
|
|
const createWrapper = ({ props = {} } = {}) => {
|
|
wrapper = shallowMountExtended(SearchResults, {
|
|
propsData: {
|
|
title,
|
|
noResultsText,
|
|
...props,
|
|
},
|
|
stubs: {
|
|
GlCollapse: stubComponent(GlCollapse, {
|
|
props: ['visible'],
|
|
}),
|
|
},
|
|
});
|
|
};
|
|
|
|
describe('default state', () => {
|
|
beforeEach(() => {
|
|
createWrapper();
|
|
});
|
|
|
|
it("renders the list's title", () => {
|
|
expect(findSearchResultsToggle().text()).toBe(title);
|
|
});
|
|
|
|
it('is expanded', () => {
|
|
expect(findCollapsibleSection().props('visible')).toBe(true);
|
|
});
|
|
|
|
it('renders the empty text', () => {
|
|
expect(findEmptyText().exists()).toBe(true);
|
|
expect(findEmptyText().text()).toBe(noResultsText);
|
|
});
|
|
});
|
|
|
|
describe('when displaying search results', () => {
|
|
it('shows search results', () => {
|
|
const searchResults = [{ id: 1 }];
|
|
createWrapper({ props: { isSearch: true, searchResults } });
|
|
|
|
expect(findItemsList().props('items')[0]).toEqual(searchResults[0]);
|
|
});
|
|
|
|
it('shows the no results text if search results are empty', () => {
|
|
const searchResults = [];
|
|
createWrapper({ props: { isSearch: true, searchResults } });
|
|
|
|
expect(findItemsList().props('items').length).toEqual(0);
|
|
expect(findEmptyText().text()).toBe(noResultsText);
|
|
});
|
|
});
|
|
});
|