Commit 12ee622c authored by Jose Ivan Vargas's avatar Jose Ivan Vargas

Merge branch '328825-write-job-table-app-spec' into 'master'

Write job table app spec

See merge request gitlab-org/gitlab!60738
parents 975c4d03 2faa4de1
......@@ -29,7 +29,7 @@ export default {
};
},
update({ project }) {
return project?.jobs;
return project?.jobs?.nodes || [];
},
error() {
this.hasError = true;
......@@ -80,6 +80,6 @@ export default {
/>
</div>
<jobs-table v-else :jobs="jobs.nodes" />
<jobs-table v-else :jobs="jobs" />
</div>
</template>
import { GlSkeletonLoader, GlAlert } from '@gitlab/ui';
import { createLocalVue, shallowMount } from '@vue/test-utils';
import VueApollo from 'vue-apollo';
import createMockApollo from 'helpers/mock_apollo_helper';
import waitForPromises from 'helpers/wait_for_promises';
import getJobsQuery from '~/jobs/components/table/graphql/queries/get_jobs.query.graphql';
import JobsTable from '~/jobs/components/table/jobs_table.vue';
import JobsTableApp from '~/jobs/components/table/jobs_table_app.vue';
import JobsTableTabs from '~/jobs/components/table/jobs_table_tabs.vue';
import { mockJobsQueryResponse } from '../../mock_data';
const projectPath = 'gitlab-org/gitlab';
const localVue = createLocalVue();
localVue.use(VueApollo);
describe('Job table app', () => {
let wrapper;
const successHandler = jest.fn().mockResolvedValue(mockJobsQueryResponse);
const failedHandler = jest.fn().mockRejectedValue(new Error('GraphQL error'));
const findSkeletonLoader = () => wrapper.findComponent(GlSkeletonLoader);
const findTable = () => wrapper.findComponent(JobsTable);
const findTabs = () => wrapper.findComponent(JobsTableTabs);
const findAlert = () => wrapper.findComponent(GlAlert);
const createMockApolloProvider = (handler) => {
const requestHandlers = [[getJobsQuery, handler]];
return createMockApollo(requestHandlers);
};
const createComponent = (handler = successHandler) => {
wrapper = shallowMount(JobsTableApp, {
provide: {
projectPath,
},
localVue,
apolloProvider: createMockApolloProvider(handler),
});
};
afterEach(() => {
wrapper.destroy();
});
describe('loading state', () => {
it('should display skeleton loader when loading', () => {
createComponent();
expect(findSkeletonLoader().exists()).toBe(true);
expect(findTable().exists()).toBe(false);
});
});
describe('loaded state', () => {
beforeEach(async () => {
createComponent();
await waitForPromises();
});
it('should display the jobs table with data', () => {
expect(findTable().exists()).toBe(true);
expect(findSkeletonLoader().exists()).toBe(false);
});
it('should retfech jobs query on fetchJobsByStatus event', async () => {
jest.spyOn(wrapper.vm.$apollo.queries.jobs, 'refetch').mockImplementation(jest.fn());
expect(wrapper.vm.$apollo.queries.jobs.refetch).toHaveBeenCalledTimes(0);
await findTabs().vm.$emit('fetchJobsByStatus');
expect(wrapper.vm.$apollo.queries.jobs.refetch).toHaveBeenCalledTimes(1);
});
});
describe('error state', () => {
it('should show an alert if there is an error fetching the data', async () => {
createComponent(failedHandler);
await waitForPromises();
expect(findAlert().exists()).toBe(true);
});
});
});
......@@ -1408,3 +1408,96 @@ export const mockJobsInTable = [
__typename: 'CiJob',
},
];
export const mockJobsQueryResponse = {
data: {
project: {
jobs: {
pageInfo: {
endCursor: 'eyJpZCI6IjIzMTcifQ',
hasNextPage: true,
hasPreviousPage: false,
startCursor: 'eyJpZCI6IjIzMzYifQ',
__typename: 'PageInfo',
},
nodes: [
{
artifacts: {
nodes: [
{
downloadPath: '/root/ci-project/-/jobs/2336/artifacts/download?file_type=trace',
__typename: 'CiJobArtifact',
},
{
downloadPath:
'/root/ci-project/-/jobs/2336/artifacts/download?file_type=metadata',
__typename: 'CiJobArtifact',
},
{
downloadPath: '/root/ci-project/-/jobs/2336/artifacts/download?file_type=archive',
__typename: 'CiJobArtifact',
},
],
__typename: 'CiJobArtifactConnection',
},
allowFailure: false,
status: 'SUCCESS',
scheduledAt: null,
manualJob: false,
triggered: null,
createdByTag: false,
detailedStatus: {
detailsPath: '/root/ci-project/-/jobs/2336',
group: 'success',
icon: 'status_success',
label: 'passed',
text: 'passed',
tooltip: 'passed',
action: {
buttonTitle: 'Retry this job',
icon: 'retry',
method: 'post',
path: '/root/ci-project/-/jobs/2336/retry',
title: 'Retry',
__typename: 'StatusAction',
},
__typename: 'DetailedStatus',
},
id: 'gid://gitlab/Ci::Build/2336',
refName: 'master',
refPath: '/root/ci-project/-/commits/master',
tags: [],
shortSha: '4408fa2a',
commitPath: '/root/ci-project/-/commit/4408fa2a27aaadfdf42d8dda3d6a9c01ce6cad78',
pipeline: {
id: 'gid://gitlab/Ci::Pipeline/473',
path: '/root/ci-project/-/pipelines/473',
user: {
webPath: '/root',
avatarUrl:
'https://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
__typename: 'UserCore',
},
__typename: 'Pipeline',
},
stage: {
name: 'deploy',
__typename: 'CiStage',
},
name: 'artifact_job',
duration: 3,
finishedAt: '2021-04-29T14:19:50Z',
coverage: null,
retryable: true,
playable: false,
cancelable: false,
active: false,
__typename: 'CiJob',
},
],
__typename: 'CiJobConnection',
},
__typename: 'Project',
},
},
};
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment