debian-mirror-gitlab/spec/frontend/pipelines/pipeline_multi_actions_spec.js

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

172 lines
5.6 KiB
JavaScript
Raw Normal View History

2022-11-25 23:54:43 +05:30
import { GlAlert, GlDropdown, GlSprintf, GlLoadingIcon, GlSearchBoxByType } from '@gitlab/ui';
2021-06-08 01:23:25 +05:30
import { shallowMount } from '@vue/test-utils';
import MockAdapter from 'axios-mock-adapter';
2022-10-11 01:57:18 +05:30
import { mockTracking, unmockTracking } from 'helpers/tracking_helper';
2021-06-08 01:23:25 +05:30
import { extendedWrapper } from 'helpers/vue_test_utils_helper';
import waitForPromises from 'helpers/wait_for_promises';
import axios from '~/lib/utils/axios_utils';
2023-04-23 21:23:45 +05:30
import { HTTP_STATUS_INTERNAL_SERVER_ERROR, HTTP_STATUS_OK } from '~/lib/utils/http_status';
2021-06-08 01:23:25 +05:30
import PipelineMultiActions, {
i18n,
} from '~/pipelines/components/pipelines_list/pipeline_multi_actions.vue';
2022-10-11 01:57:18 +05:30
import { TRACKING_CATEGORIES } from '~/pipelines/constants';
2021-06-08 01:23:25 +05:30
describe('Pipeline Multi Actions Dropdown', () => {
let wrapper;
let mockAxios;
const artifacts = [
{
name: 'job my-artifact',
path: '/download/path',
},
{
name: 'job-2 my-artifact-2',
path: '/download/path-two',
},
];
const artifactItemTestId = 'artifact-item';
const artifactsEndpointPlaceholder = ':pipeline_artifacts_id';
const artifactsEndpoint = `endpoint/${artifactsEndpointPlaceholder}/artifacts.json`;
const pipelineId = 108;
const createComponent = ({ mockData = {} } = {}) => {
wrapper = extendedWrapper(
shallowMount(PipelineMultiActions, {
provide: {
artifactsEndpoint,
artifactsEndpointPlaceholder,
},
propsData: {
pipelineId,
},
data() {
return {
...mockData,
};
},
stubs: {
GlSprintf,
2022-11-25 23:54:43 +05:30
GlDropdown,
2021-06-08 01:23:25 +05:30
},
}),
);
};
const findAlert = () => wrapper.findComponent(GlAlert);
const findDropdown = () => wrapper.findComponent(GlDropdown);
2021-11-11 11:23:49 +05:30
const findLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
2021-06-08 01:23:25 +05:30
const findAllArtifactItems = () => wrapper.findAllByTestId(artifactItemTestId);
const findFirstArtifactItem = () => wrapper.findByTestId(artifactItemTestId);
2022-11-25 23:54:43 +05:30
const findSearchBox = () => wrapper.findComponent(GlSearchBoxByType);
2021-10-27 15:23:28 +05:30
const findEmptyMessage = () => wrapper.findByTestId('artifacts-empty-message');
2021-06-08 01:23:25 +05:30
beforeEach(() => {
mockAxios = new MockAdapter(axios);
});
afterEach(() => {
mockAxios.restore();
});
it('should render the dropdown', () => {
createComponent();
expect(findDropdown().exists()).toBe(true);
});
describe('Artifacts', () => {
2022-11-25 23:54:43 +05:30
it('should fetch artifacts and show search box on dropdown click', async () => {
2021-06-08 01:23:25 +05:30
const endpoint = artifactsEndpoint.replace(artifactsEndpointPlaceholder, pipelineId);
2023-04-23 21:23:45 +05:30
mockAxios.onGet(endpoint).replyOnce(HTTP_STATUS_OK, { artifacts });
2021-06-08 01:23:25 +05:30
createComponent();
findDropdown().vm.$emit('show');
await waitForPromises();
expect(mockAxios.history.get).toHaveLength(1);
expect(wrapper.vm.artifacts).toEqual(artifacts);
2022-11-25 23:54:43 +05:30
expect(findSearchBox().exists()).toBe(true);
});
it('should focus the search box when opened with artifacts', () => {
createComponent({ mockData: { artifacts } });
wrapper.vm.$refs.searchInput.focusInput = jest.fn();
findDropdown().vm.$emit('shown');
expect(wrapper.vm.$refs.searchInput.focusInput).toHaveBeenCalled();
2021-06-08 01:23:25 +05:30
});
2022-08-27 11:52:29 +05:30
it('should render all the provided artifacts when search query is empty', () => {
const searchQuery = '';
createComponent({ mockData: { searchQuery, artifacts } });
2021-06-08 01:23:25 +05:30
expect(findAllArtifactItems()).toHaveLength(artifacts.length);
2021-10-27 15:23:28 +05:30
expect(findEmptyMessage().exists()).toBe(false);
2021-06-08 01:23:25 +05:30
});
2022-08-27 11:52:29 +05:30
it('should render filtered artifacts when search query is not empty', () => {
const searchQuery = 'job-2';
createComponent({ mockData: { searchQuery, artifacts } });
expect(findAllArtifactItems()).toHaveLength(1);
expect(findEmptyMessage().exists()).toBe(false);
});
2021-06-08 01:23:25 +05:30
it('should render the correct artifact name and path', () => {
createComponent({ mockData: { artifacts } });
expect(findFirstArtifactItem().attributes('href')).toBe(artifacts[0].path);
2021-11-18 22:05:49 +05:30
expect(findFirstArtifactItem().text()).toBe(artifacts[0].name);
2021-06-08 01:23:25 +05:30
});
2022-11-25 23:54:43 +05:30
it('should render empty message and no search box when no artifacts are found', () => {
2021-10-27 15:23:28 +05:30
createComponent({ mockData: { artifacts: [] } });
expect(findEmptyMessage().exists()).toBe(true);
2022-11-25 23:54:43 +05:30
expect(findSearchBox().exists()).toBe(false);
2021-10-27 15:23:28 +05:30
});
2021-11-11 11:23:49 +05:30
describe('while loading artifacts', () => {
it('should render a loading spinner and no empty message', () => {
createComponent({ mockData: { isLoading: true, artifacts: [] } });
expect(findLoadingIcon().exists()).toBe(true);
expect(findEmptyMessage().exists()).toBe(false);
});
});
2021-06-08 01:23:25 +05:30
describe('with a failing request', () => {
it('should render an error message', async () => {
const endpoint = artifactsEndpoint.replace(artifactsEndpointPlaceholder, pipelineId);
2023-04-23 21:23:45 +05:30
mockAxios.onGet(endpoint).replyOnce(HTTP_STATUS_INTERNAL_SERVER_ERROR);
2021-06-08 01:23:25 +05:30
createComponent();
findDropdown().vm.$emit('show');
await waitForPromises();
const error = findAlert();
expect(error.exists()).toBe(true);
expect(error.text()).toBe(i18n.artifactsFetchErrorMessage);
});
});
});
2022-10-11 01:57:18 +05:30
describe('tracking', () => {
afterEach(() => {
unmockTracking();
});
it('tracks artifacts dropdown click', () => {
const trackingSpy = mockTracking(undefined, wrapper.element, jest.spyOn);
createComponent();
findDropdown().vm.$emit('show');
expect(trackingSpy).toHaveBeenCalledWith(undefined, 'click_artifacts_dropdown', {
label: TRACKING_CATEGORIES.table,
});
});
});
2021-06-08 01:23:25 +05:30
});