Welcome to mirror list, hosted at ThFree Co, Russian Federation.

gitlab.com/gitlab-org/gitlab-foss.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
path: root/spec/frontend/jira_connect/subscriptions/components/groups_list_spec.js
diff options
context:
space:
mode:
Diffstat (limited to 'spec/frontend/jira_connect/subscriptions/components/groups_list_spec.js')
-rw-r--r--spec/frontend/jira_connect/subscriptions/components/groups_list_spec.js303
1 files changed, 0 insertions, 303 deletions
diff --git a/spec/frontend/jira_connect/subscriptions/components/groups_list_spec.js b/spec/frontend/jira_connect/subscriptions/components/groups_list_spec.js
deleted file mode 100644
index d3a9a3bfd41..00000000000
--- a/spec/frontend/jira_connect/subscriptions/components/groups_list_spec.js
+++ /dev/null
@@ -1,303 +0,0 @@
-import { GlAlert, GlLoadingIcon, GlSearchBoxByType, GlPagination } from '@gitlab/ui';
-import { shallowMount } from '@vue/test-utils';
-import { extendedWrapper } from 'helpers/vue_test_utils_helper';
-import waitForPromises from 'helpers/wait_for_promises';
-import { fetchGroups } from '~/jira_connect/subscriptions/api';
-import GroupsList from '~/jira_connect/subscriptions/components/groups_list.vue';
-import GroupsListItem from '~/jira_connect/subscriptions/components/groups_list_item.vue';
-import { DEFAULT_GROUPS_PER_PAGE } from '~/jira_connect/subscriptions/constants';
-import { mockGroup1, mockGroup2 } from '../mock_data';
-
-const createMockGroup = (groupId) => {
- return {
- ...mockGroup1,
- id: groupId,
- };
-};
-
-const createMockGroups = (count) => {
- return [...new Array(count)].map((_, idx) => createMockGroup(idx));
-};
-
-jest.mock('~/jira_connect/subscriptions/api', () => {
- return {
- fetchGroups: jest.fn(),
- };
-});
-
-const mockGroupsPath = '/groups';
-
-describe('GroupsList', () => {
- let wrapper;
-
- const mockEmptyResponse = { data: [] };
-
- const createComponent = (options = {}) => {
- wrapper = extendedWrapper(
- shallowMount(GroupsList, {
- provide: {
- groupsPath: mockGroupsPath,
- },
- ...options,
- }),
- );
- };
-
- afterEach(() => {
- wrapper.destroy();
- });
-
- const findGlAlert = () => wrapper.findComponent(GlAlert);
- const findGlLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
- const findAllItems = () => wrapper.findAll(GroupsListItem);
- const findFirstItem = () => findAllItems().at(0);
- const findSecondItem = () => findAllItems().at(1);
- const findSearchBox = () => wrapper.findComponent(GlSearchBoxByType);
- const findGroupsList = () => wrapper.findByTestId('groups-list');
- const findPagination = () => wrapper.findComponent(GlPagination);
-
- describe('when groups are loading', () => {
- it('renders loading icon', async () => {
- fetchGroups.mockReturnValue(new Promise(() => {}));
- createComponent();
-
- await wrapper.vm.$nextTick();
-
- expect(findGlLoadingIcon().exists()).toBe(true);
- });
- });
-
- describe('when groups fetch fails', () => {
- it('renders error message', async () => {
- fetchGroups.mockRejectedValue();
- createComponent();
-
- await waitForPromises();
-
- expect(findGlLoadingIcon().exists()).toBe(false);
- expect(findGlAlert().exists()).toBe(true);
- expect(findGlAlert().text()).toBe('Failed to load namespaces. Please try again.');
- });
- });
-
- describe('with no groups returned', () => {
- it('renders empty state', async () => {
- fetchGroups.mockResolvedValue(mockEmptyResponse);
- createComponent();
-
- await waitForPromises();
-
- expect(findGlLoadingIcon().exists()).toBe(false);
- expect(wrapper.text()).toContain('No available namespaces');
- });
- });
-
- describe('with groups returned', () => {
- beforeEach(async () => {
- fetchGroups.mockResolvedValue({
- headers: { 'X-PAGE': 1, 'X-TOTAL': 2 },
- data: [mockGroup1, mockGroup2],
- });
- createComponent();
-
- await waitForPromises();
- });
-
- it('renders groups list', () => {
- expect(findAllItems()).toHaveLength(2);
- expect(findFirstItem().props('group')).toBe(mockGroup1);
- expect(findSecondItem().props('group')).toBe(mockGroup2);
- });
-
- it('sets GroupListItem `disabled` prop to `false`', () => {
- findAllItems().wrappers.forEach((groupListItem) => {
- expect(groupListItem.props('disabled')).toBe(false);
- });
- });
-
- it('does not set opacity of the groups list', () => {
- expect(findGroupsList().classes()).not.toContain('gl-opacity-5');
- });
-
- it('shows error message on $emit from item', async () => {
- const errorMessage = 'error message';
-
- findFirstItem().vm.$emit('error', errorMessage);
-
- await wrapper.vm.$nextTick();
-
- expect(findGlAlert().exists()).toBe(true);
- expect(findGlAlert().text()).toContain(errorMessage);
- });
-
- describe('when searching groups', () => {
- const mockSearchTeam = 'mock search term';
-
- describe('while groups are loading', () => {
- beforeEach(async () => {
- fetchGroups.mockClear();
- fetchGroups.mockReturnValue(new Promise(() => {}));
-
- findSearchBox().vm.$emit('input', mockSearchTeam);
- await wrapper.vm.$nextTick();
- });
-
- it('calls `fetchGroups` with search term', () => {
- expect(fetchGroups).toHaveBeenLastCalledWith(mockGroupsPath, {
- page: 1,
- perPage: DEFAULT_GROUPS_PER_PAGE,
- search: mockSearchTeam,
- });
- });
-
- it('disables GroupListItems', () => {
- findAllItems().wrappers.forEach((groupListItem) => {
- expect(groupListItem.props('disabled')).toBe(true);
- });
- });
-
- it('sets opacity of the groups list', () => {
- expect(findGroupsList().classes()).toContain('gl-opacity-5');
- });
-
- it('sets loading prop of the search box', () => {
- expect(findSearchBox().props('isLoading')).toBe(true);
- });
-
- it('sets value prop of the search box to the search term', () => {
- expect(findSearchBox().props('value')).toBe(mockSearchTeam);
- });
- });
-
- describe('when group search finishes loading', () => {
- beforeEach(async () => {
- fetchGroups.mockResolvedValue({ data: [mockGroup1] });
- findSearchBox().vm.$emit('input');
-
- await waitForPromises();
- });
-
- it('renders new groups list', () => {
- expect(findAllItems()).toHaveLength(1);
- expect(findFirstItem().props('group')).toBe(mockGroup1);
- });
- });
-
- it.each`
- userSearchTerm | finalSearchTerm
- ${'gitl'} | ${'gitl'}
- ${'git'} | ${'git'}
- ${'gi'} | ${''}
- ${'g'} | ${''}
- ${''} | ${''}
- ${undefined} | ${undefined}
- `(
- 'searches for "$finalSearchTerm" when user enters "$userSearchTerm"',
- async ({ userSearchTerm, finalSearchTerm }) => {
- fetchGroups.mockResolvedValue({
- data: [mockGroup1],
- headers: { 'X-PAGE': 1, 'X-TOTAL': 1 },
- });
-
- createComponent();
- await waitForPromises();
-
- const searchBox = findSearchBox();
- searchBox.vm.$emit('input', userSearchTerm);
-
- expect(fetchGroups).toHaveBeenLastCalledWith(mockGroupsPath, {
- page: 1,
- perPage: DEFAULT_GROUPS_PER_PAGE,
- search: finalSearchTerm,
- });
- },
- );
- });
-
- describe('when page=2', () => {
- beforeEach(async () => {
- const totalItems = DEFAULT_GROUPS_PER_PAGE + 1;
- const mockGroups = createMockGroups(totalItems);
- fetchGroups.mockResolvedValue({
- headers: { 'X-TOTAL': totalItems, 'X-PAGE': 1 },
- data: mockGroups,
- });
- createComponent();
- await waitForPromises();
-
- const paginationEl = findPagination();
- paginationEl.vm.$emit('input', 2);
- });
-
- it('should load results for page 2', () => {
- expect(fetchGroups).toHaveBeenLastCalledWith(mockGroupsPath, {
- page: 2,
- perPage: DEFAULT_GROUPS_PER_PAGE,
- search: '',
- });
- });
-
- it('resets page to 1 on search `input` event', () => {
- const mockSearchTerm = 'gitlab';
- const searchBox = findSearchBox();
-
- searchBox.vm.$emit('input', mockSearchTerm);
-
- expect(fetchGroups).toHaveBeenLastCalledWith(mockGroupsPath, {
- page: 1,
- perPage: DEFAULT_GROUPS_PER_PAGE,
- search: mockSearchTerm,
- });
- });
- });
- });
-
- describe('pagination', () => {
- it.each`
- scenario | totalItems | shouldShowPagination
- ${'renders pagination'} | ${DEFAULT_GROUPS_PER_PAGE + 1} | ${true}
- ${'does not render pagination'} | ${DEFAULT_GROUPS_PER_PAGE} | ${false}
- ${'does not render pagination'} | ${2} | ${false}
- ${'does not render pagination'} | ${0} | ${false}
- `('$scenario with $totalItems groups', async ({ totalItems, shouldShowPagination }) => {
- const mockGroups = createMockGroups(totalItems);
- fetchGroups.mockResolvedValue({
- headers: { 'X-TOTAL': totalItems, 'X-PAGE': 1 },
- data: mockGroups,
- });
- createComponent();
- await waitForPromises();
-
- const paginationEl = findPagination();
-
- expect(paginationEl.exists()).toBe(shouldShowPagination);
- if (shouldShowPagination) {
- expect(paginationEl.props('totalItems')).toBe(totalItems);
- }
- });
-
- describe('when `input` event triggered', () => {
- beforeEach(async () => {
- const MOCK_TOTAL_ITEMS = DEFAULT_GROUPS_PER_PAGE + 1;
- fetchGroups.mockResolvedValue({
- headers: { 'X-TOTAL': MOCK_TOTAL_ITEMS, 'X-PAGE': 1 },
- data: createMockGroups(MOCK_TOTAL_ITEMS),
- });
-
- createComponent();
- await waitForPromises();
- });
-
- it('executes `fetchGroups` with correct arguments', () => {
- const paginationEl = findPagination();
- paginationEl.vm.$emit('input', 2);
-
- expect(fetchGroups).toHaveBeenLastCalledWith(mockGroupsPath, {
- page: 2,
- perPage: DEFAULT_GROUPS_PER_PAGE,
- search: '',
- });
- });
- });
- });
-});
generated by cgit v1.2.3 (git 2.25.1) at 2024-07-13 22:53:04 +0300