debian-mirror-gitlab/spec/frontend/super_sidebar/components/search_results_spec.js

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

70 lines
2.1 KiB
JavaScript
Raw Normal View History

2023-06-20 00:43:36 +05:30
import { GlCollapse } from '@gitlab/ui';
2023-05-27 22:25:52 +05:30
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';
2023-06-20 00:43:36 +05:30
import { stubComponent } from 'helpers/stub_component';
2023-05-27 22:25:52 +05:30
const title = s__('Navigation|PROJECTS');
const noResultsText = s__('Navigation|No project matches found');
describe('SearchResults component', () => {
let wrapper;
2023-06-20 00:43:36 +05:30
const findSearchResultsToggle = () => wrapper.findByTestId('search-results-toggle');
const findCollapsibleSection = () => wrapper.findComponent(GlCollapse);
2023-05-27 22:25:52 +05:30
const findItemsList = () => wrapper.findComponent(ItemsList);
const findEmptyText = () => wrapper.findByTestId('empty-text');
const createWrapper = ({ props = {} } = {}) => {
wrapper = shallowMountExtended(SearchResults, {
propsData: {
title,
noResultsText,
...props,
},
2023-06-20 00:43:36 +05:30
stubs: {
GlCollapse: stubComponent(GlCollapse, {
props: ['visible'],
}),
},
2023-05-27 22:25:52 +05:30
});
};
describe('default state', () => {
beforeEach(() => {
createWrapper();
});
it("renders the list's title", () => {
2023-06-20 00:43:36 +05:30
expect(findSearchResultsToggle().text()).toBe(title);
});
it('is expanded', () => {
expect(findCollapsibleSection().props('visible')).toBe(true);
2023-05-27 22:25:52 +05:30
});
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);
});
});
});