2020-04-22 19:07:51 +05:30
|
|
|
import { GlBarChart } from '@gitlab/ui/dist/charts';
|
2021-03-11 19:13:27 +05:30
|
|
|
import { shallowMount } from '@vue/test-utils';
|
2020-04-22 19:07:51 +05:30
|
|
|
import Bar from '~/monitoring/components/charts/bar.vue';
|
2020-11-24 15:15:51 +05:30
|
|
|
import { barGraphData } from '../../graph_data';
|
2020-04-22 19:07:51 +05:30
|
|
|
|
|
|
|
jest.mock('~/lib/utils/icon_utils', () => ({
|
|
|
|
getSvgIconPathContent: jest.fn().mockResolvedValue('mockSvgPathContent'),
|
|
|
|
}));
|
|
|
|
|
|
|
|
describe('Bar component', () => {
|
|
|
|
let barChart;
|
|
|
|
let store;
|
2020-11-24 15:15:51 +05:30
|
|
|
let graphData;
|
2020-04-22 19:07:51 +05:30
|
|
|
|
|
|
|
beforeEach(() => {
|
2020-11-24 15:15:51 +05:30
|
|
|
graphData = barGraphData();
|
|
|
|
|
2020-04-22 19:07:51 +05:30
|
|
|
barChart = shallowMount(Bar, {
|
|
|
|
propsData: {
|
2020-11-24 15:15:51 +05:30
|
|
|
graphData,
|
2020-04-22 19:07:51 +05:30
|
|
|
},
|
|
|
|
store,
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
afterEach(() => {
|
|
|
|
barChart.destroy();
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('wrapped components', () => {
|
|
|
|
describe('GitLab UI bar chart', () => {
|
|
|
|
let glbarChart;
|
|
|
|
let chartData;
|
|
|
|
|
|
|
|
beforeEach(() => {
|
2022-08-27 11:52:29 +05:30
|
|
|
glbarChart = barChart.findComponent(GlBarChart);
|
2020-11-24 15:15:51 +05:30
|
|
|
chartData = barChart.vm.chartData[graphData.metrics[0].label];
|
2020-04-22 19:07:51 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
it('should display a label on the x axis', () => {
|
2020-11-24 15:15:51 +05:30
|
|
|
expect(glbarChart.props('xAxisTitle')).toBe(graphData.xLabel);
|
2020-04-22 19:07:51 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
it('should return chartData as array of arrays', () => {
|
|
|
|
expect(chartData).toBeInstanceOf(Array);
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
chartData.forEach((item) => {
|
2020-04-22 19:07:51 +05:30
|
|
|
expect(item).toBeInstanceOf(Array);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|