diff options
Diffstat (limited to 'spec/frontend/projects/pipelines/charts/components/pipeline_charts_spec.js')
-rw-r--r-- | spec/frontend/projects/pipelines/charts/components/pipeline_charts_spec.js | 72 |
1 files changed, 38 insertions, 34 deletions
diff --git a/spec/frontend/projects/pipelines/charts/components/pipeline_charts_spec.js b/spec/frontend/projects/pipelines/charts/components/pipeline_charts_spec.js index 598055d5828..c5cfe783569 100644 --- a/spec/frontend/projects/pipelines/charts/components/pipeline_charts_spec.js +++ b/spec/frontend/projects/pipelines/charts/components/pipeline_charts_spec.js @@ -1,35 +1,37 @@ -import { shallowMount } from '@vue/test-utils'; import { GlColumnChart } from '@gitlab/ui/dist/charts'; -import StatisticsList from '~/projects/pipelines/charts/components/statistics_list.vue'; -import CiCdAnalyticsAreaChart from '~/projects/pipelines/charts/components/ci_cd_analytics_area_chart.vue'; +import { createLocalVue, shallowMount } from '@vue/test-utils'; +import VueApollo from 'vue-apollo'; +import createMockApollo from 'helpers/mock_apollo_helper'; +import CiCdAnalyticsCharts from '~/projects/pipelines/charts/components/ci_cd_analytics_charts.vue'; import PipelineCharts from '~/projects/pipelines/charts/components/pipeline_charts.vue'; -import { - counts, - timesChartData as timesChart, - areaChartData as lastWeek, - areaChartData as lastMonth, - lastYearChartData as lastYear, -} from '../mock_data'; +import StatisticsList from '~/projects/pipelines/charts/components/statistics_list.vue'; +import getPipelineCountByStatus from '~/projects/pipelines/charts/graphql/queries/get_pipeline_count_by_status.query.graphql'; +import getProjectPipelineStatistics from '~/projects/pipelines/charts/graphql/queries/get_project_pipeline_statistics.query.graphql'; +import { mockPipelineCount, mockPipelineStatistics } from '../mock_data'; + +const projectPath = 'gitlab-org/gitlab'; +const localVue = createLocalVue(); +localVue.use(VueApollo); -describe('ProjectsPipelinesChartsApp', () => { +describe('~/projects/pipelines/charts/components/pipeline_charts.vue', () => { let wrapper; + function createMockApolloProvider() { + const requestHandlers = [ + [getPipelineCountByStatus, jest.fn().mockResolvedValue(mockPipelineCount)], + [getProjectPipelineStatistics, jest.fn().mockResolvedValue(mockPipelineStatistics)], + ]; + + return createMockApollo(requestHandlers); + } + beforeEach(() => { wrapper = shallowMount(PipelineCharts, { - propsData: { - counts, - timesChart, - lastWeek, - lastMonth, - lastYear, - }, provide: { - projectPath: 'test/project', - shouldRenderDeploymentFrequencyCharts: true, - }, - stubs: { - DeploymentFrequencyCharts: true, + projectPath, }, + localVue, + apolloProvider: createMockApolloProvider(), }); }); @@ -43,7 +45,12 @@ describe('ProjectsPipelinesChartsApp', () => { const list = wrapper.find(StatisticsList); expect(list.exists()).toBe(true); - expect(list.props('counts')).toBe(counts); + expect(list.props('counts')).toEqual({ + total: 34, + success: 23, + failed: 1, + successRatio: (23 / (23 + 1)) * 100, + }); }); it('displays the commit duration chart', () => { @@ -58,20 +65,17 @@ describe('ProjectsPipelinesChartsApp', () => { }); describe('pipelines charts', () => { - it('displays 3 area charts', () => { - expect(wrapper.findAll(CiCdAnalyticsAreaChart)).toHaveLength(3); + it('displays the charts components', () => { + expect(wrapper.find(CiCdAnalyticsCharts).exists()).toBe(true); }); describe('displays individual correctly', () => { it('renders with the correct data', () => { - const charts = wrapper.findAll(CiCdAnalyticsAreaChart); - for (let i = 0; i < charts.length; i += 1) { - const chart = charts.at(i); - - expect(chart.exists()).toBeTruthy(); - expect(chart.props('chartData')).toBe(wrapper.vm.areaCharts[i].data); - expect(chart.text()).toBe(wrapper.vm.areaCharts[i].title); - } + const charts = wrapper.find(CiCdAnalyticsCharts); + expect(charts.props()).toEqual({ + charts: wrapper.vm.areaCharts, + chartOptions: wrapper.vm.$options.areaChartOptions, + }); }); }); }); |