2020-06-23 00:09:42 +05:30
|
|
|
import axios from 'axios';
|
|
|
|
import MockAdapter from 'axios-mock-adapter';
|
2021-03-11 19:13:27 +05:30
|
|
|
import Vue from 'vue';
|
2020-01-01 13:55:28 +05:30
|
|
|
import MemoryUsage from '~/vue_merge_request_widget/components/deployment/memory_usage.vue';
|
2017-08-17 22:00:37 +05:30
|
|
|
import MRWidgetService from '~/vue_merge_request_widget/services/mr_widget_service';
|
|
|
|
|
|
|
|
const url = '/root/acets-review-apps/environments/15/deployments/1/metrics';
|
2017-09-10 17:25:29 +05:30
|
|
|
const monitoringUrl = '/root/acets-review-apps/environments/15/metrics';
|
2017-08-17 22:00:37 +05:30
|
|
|
|
|
|
|
const metricsMockData = {
|
|
|
|
success: true,
|
|
|
|
metrics: {
|
2017-09-10 17:25:29 +05:30
|
|
|
memory_before: [
|
|
|
|
{
|
|
|
|
metric: {},
|
|
|
|
value: [1495785220.607, '9572875.906976745'],
|
|
|
|
},
|
|
|
|
],
|
|
|
|
memory_after: [
|
|
|
|
{
|
|
|
|
metric: {},
|
|
|
|
value: [1495787020.607, '4485853.130206379'],
|
|
|
|
},
|
|
|
|
],
|
2017-08-17 22:00:37 +05:30
|
|
|
memory_values: [
|
|
|
|
{
|
|
|
|
metric: {},
|
2018-05-09 12:01:36 +05:30
|
|
|
values: [[1493716685, '4.30859375']],
|
2017-08-17 22:00:37 +05:30
|
|
|
},
|
|
|
|
],
|
|
|
|
},
|
|
|
|
last_update: '2017-05-02T12:34:49.628Z',
|
|
|
|
deployment_time: 1493718485,
|
|
|
|
};
|
|
|
|
|
|
|
|
const createComponent = () => {
|
2018-05-09 12:01:36 +05:30
|
|
|
const Component = Vue.extend(MemoryUsage);
|
2017-08-17 22:00:37 +05:30
|
|
|
|
|
|
|
return new Component({
|
|
|
|
el: document.createElement('div'),
|
|
|
|
propsData: {
|
|
|
|
metricsUrl: url,
|
2017-09-10 17:25:29 +05:30
|
|
|
metricsMonitoringUrl: monitoringUrl,
|
2017-08-17 22:00:37 +05:30
|
|
|
memoryMetrics: [],
|
|
|
|
deploymentTime: 0,
|
|
|
|
hasMetrics: false,
|
|
|
|
loadFailed: false,
|
|
|
|
loadingMetrics: true,
|
|
|
|
backOffRequestCounter: 0,
|
|
|
|
},
|
|
|
|
});
|
|
|
|
};
|
|
|
|
|
|
|
|
const messages = {
|
2017-09-10 17:25:29 +05:30
|
|
|
loadingMetrics: 'Loading deployment statistics',
|
2018-05-09 12:01:36 +05:30
|
|
|
hasMetrics: 'Memory usage is unchanged at 0MB',
|
2017-09-10 17:25:29 +05:30
|
|
|
loadFailed: 'Failed to load deployment statistics',
|
|
|
|
metricsUnavailable: 'Deployment statistics are not available currently',
|
2017-08-17 22:00:37 +05:30
|
|
|
};
|
|
|
|
|
|
|
|
describe('MemoryUsage', () => {
|
|
|
|
let vm;
|
|
|
|
let el;
|
2020-06-23 00:09:42 +05:30
|
|
|
let mock;
|
2017-08-17 22:00:37 +05:30
|
|
|
|
|
|
|
beforeEach(() => {
|
2020-06-23 00:09:42 +05:30
|
|
|
mock = new MockAdapter(axios);
|
|
|
|
mock.onGet(`${url}.json`).reply(200);
|
|
|
|
|
2017-08-17 22:00:37 +05:30
|
|
|
vm = createComponent();
|
|
|
|
el = vm.$el;
|
|
|
|
});
|
|
|
|
|
2020-06-23 00:09:42 +05:30
|
|
|
afterEach(() => {
|
|
|
|
mock.restore();
|
|
|
|
});
|
|
|
|
|
2017-08-17 22:00:37 +05:30
|
|
|
describe('data', () => {
|
|
|
|
it('should have default data', () => {
|
2018-05-09 12:01:36 +05:30
|
|
|
const data = MemoryUsage.data();
|
2017-08-17 22:00:37 +05:30
|
|
|
|
|
|
|
expect(Array.isArray(data.memoryMetrics)).toBeTruthy();
|
|
|
|
expect(data.memoryMetrics.length).toBe(0);
|
|
|
|
|
|
|
|
expect(typeof data.deploymentTime).toBe('number');
|
|
|
|
expect(data.deploymentTime).toBe(0);
|
|
|
|
|
|
|
|
expect(typeof data.hasMetrics).toBe('boolean');
|
|
|
|
expect(data.hasMetrics).toBeFalsy();
|
|
|
|
|
|
|
|
expect(typeof data.loadFailed).toBe('boolean');
|
|
|
|
expect(data.loadFailed).toBeFalsy();
|
|
|
|
|
|
|
|
expect(typeof data.loadingMetrics).toBe('boolean');
|
|
|
|
expect(data.loadingMetrics).toBeTruthy();
|
|
|
|
|
|
|
|
expect(typeof data.backOffRequestCounter).toBe('number');
|
|
|
|
expect(data.backOffRequestCounter).toBe(0);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2017-09-10 17:25:29 +05:30
|
|
|
describe('computed', () => {
|
2018-05-09 12:01:36 +05:30
|
|
|
describe('memoryChangeMessage', () => {
|
|
|
|
it('should contain "increased" if memoryFrom value is less than memoryTo value', () => {
|
2017-09-10 17:25:29 +05:30
|
|
|
vm.memoryFrom = 4.28;
|
|
|
|
vm.memoryTo = 9.13;
|
|
|
|
|
2018-05-09 12:01:36 +05:30
|
|
|
expect(vm.memoryChangeMessage.indexOf('increased')).not.toEqual('-1');
|
2017-09-10 17:25:29 +05:30
|
|
|
});
|
|
|
|
|
2018-05-09 12:01:36 +05:30
|
|
|
it('should contain "decreased" if memoryFrom value is less than memoryTo value', () => {
|
2017-09-10 17:25:29 +05:30
|
|
|
vm.memoryFrom = 9.13;
|
|
|
|
vm.memoryTo = 4.28;
|
|
|
|
|
2018-05-09 12:01:36 +05:30
|
|
|
expect(vm.memoryChangeMessage.indexOf('decreased')).not.toEqual('-1');
|
2017-09-10 17:25:29 +05:30
|
|
|
});
|
|
|
|
|
2018-05-09 12:01:36 +05:30
|
|
|
it('should contain "unchanged" if memoryFrom value equal to memoryTo value', () => {
|
2017-09-10 17:25:29 +05:30
|
|
|
vm.memoryFrom = 1;
|
|
|
|
vm.memoryTo = 1;
|
|
|
|
|
2018-05-09 12:01:36 +05:30
|
|
|
expect(vm.memoryChangeMessage.indexOf('unchanged')).not.toEqual('-1');
|
2017-09-10 17:25:29 +05:30
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2017-08-17 22:00:37 +05:30
|
|
|
describe('methods', () => {
|
|
|
|
const { metrics, deployment_time } = metricsMockData;
|
|
|
|
|
2017-09-10 17:25:29 +05:30
|
|
|
describe('getMegabytes', () => {
|
|
|
|
it('should return Megabytes from provided Bytes value', () => {
|
|
|
|
const memoryInBytes = '9572875.906976745';
|
|
|
|
|
|
|
|
expect(vm.getMegabytes(memoryInBytes)).toEqual('9.13');
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2017-08-17 22:00:37 +05:30
|
|
|
describe('computeGraphData', () => {
|
|
|
|
it('should populate sparkline graph', () => {
|
2020-06-23 00:09:42 +05:30
|
|
|
// ignore BoostrapVue warnings
|
|
|
|
jest.spyOn(console, 'warn').mockImplementation();
|
|
|
|
|
2017-08-17 22:00:37 +05:30
|
|
|
vm.computeGraphData(metrics, deployment_time);
|
2018-12-13 13:39:08 +05:30
|
|
|
const { hasMetrics, memoryMetrics, deploymentTime, memoryFrom, memoryTo } = vm;
|
2017-08-17 22:00:37 +05:30
|
|
|
|
|
|
|
expect(hasMetrics).toBeTruthy();
|
2018-12-13 13:39:08 +05:30
|
|
|
expect(memoryMetrics.length).toBeGreaterThan(0);
|
2017-08-17 22:00:37 +05:30
|
|
|
expect(deploymentTime).toEqual(deployment_time);
|
2017-09-10 17:25:29 +05:30
|
|
|
expect(memoryFrom).toEqual('9.13');
|
|
|
|
expect(memoryTo).toEqual('4.28');
|
2017-08-17 22:00:37 +05:30
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('loadMetrics', () => {
|
2018-05-09 12:01:36 +05:30
|
|
|
const returnServicePromise = () =>
|
2021-03-08 18:12:59 +05:30
|
|
|
new Promise((resolve) => {
|
2018-05-09 12:01:36 +05:30
|
|
|
resolve({
|
|
|
|
data: metricsMockData,
|
|
|
|
});
|
2017-08-17 22:00:37 +05:30
|
|
|
});
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
it('should load metrics data using MRWidgetService', (done) => {
|
2020-06-23 00:09:42 +05:30
|
|
|
jest.spyOn(MRWidgetService, 'fetchMetrics').mockReturnValue(returnServicePromise(true));
|
|
|
|
jest.spyOn(vm, 'computeGraphData').mockImplementation(() => {});
|
2017-08-17 22:00:37 +05:30
|
|
|
|
|
|
|
vm.loadMetrics();
|
2020-06-23 00:09:42 +05:30
|
|
|
setImmediate(() => {
|
2017-08-17 22:00:37 +05:30
|
|
|
expect(MRWidgetService.fetchMetrics).toHaveBeenCalledWith(url);
|
2018-12-13 13:39:08 +05:30
|
|
|
expect(vm.computeGraphData).toHaveBeenCalledWith(metrics, deployment_time);
|
2017-08-17 22:00:37 +05:30
|
|
|
done();
|
2020-06-23 00:09:42 +05:30
|
|
|
});
|
2017-08-17 22:00:37 +05:30
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('template', () => {
|
|
|
|
it('should render template elements correctly', () => {
|
|
|
|
expect(el.classList.contains('mr-memory-usage')).toBeTruthy();
|
|
|
|
expect(el.querySelector('.js-usage-info')).toBeDefined();
|
|
|
|
});
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
it('should show loading metrics message while metrics are being loaded', (done) => {
|
2017-08-17 22:00:37 +05:30
|
|
|
vm.loadingMetrics = true;
|
|
|
|
vm.hasMetrics = false;
|
|
|
|
vm.loadFailed = false;
|
|
|
|
|
|
|
|
Vue.nextTick(() => {
|
2018-12-13 13:39:08 +05:30
|
|
|
expect(el.querySelector('.js-usage-info.usage-info-loading')).toBeDefined();
|
|
|
|
|
|
|
|
expect(el.querySelector('.js-usage-info .usage-info-load-spinner')).toBeDefined();
|
|
|
|
|
|
|
|
expect(el.querySelector('.js-usage-info').innerText).toContain(messages.loadingMetrics);
|
2017-08-17 22:00:37 +05:30
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
it('should show deployment memory usage when metrics are loaded', (done) => {
|
2020-06-23 00:09:42 +05:30
|
|
|
// ignore BoostrapVue warnings
|
|
|
|
jest.spyOn(console, 'warn').mockImplementation();
|
|
|
|
|
2017-08-17 22:00:37 +05:30
|
|
|
vm.loadingMetrics = false;
|
|
|
|
vm.hasMetrics = true;
|
|
|
|
vm.loadFailed = false;
|
2020-01-01 13:55:28 +05:30
|
|
|
vm.memoryMetrics = metricsMockData.metrics.memory_values[0].values;
|
2017-08-17 22:00:37 +05:30
|
|
|
|
|
|
|
Vue.nextTick(() => {
|
|
|
|
expect(el.querySelector('.memory-graph-container')).toBeDefined();
|
2018-12-13 13:39:08 +05:30
|
|
|
expect(el.querySelector('.js-usage-info').innerText).toContain(messages.hasMetrics);
|
2017-08-17 22:00:37 +05:30
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
it('should show failure message when metrics loading failed', (done) => {
|
2017-08-17 22:00:37 +05:30
|
|
|
vm.loadingMetrics = false;
|
|
|
|
vm.hasMetrics = false;
|
|
|
|
vm.loadFailed = true;
|
|
|
|
|
|
|
|
Vue.nextTick(() => {
|
2018-12-13 13:39:08 +05:30
|
|
|
expect(el.querySelector('.js-usage-info.usage-info-failed')).toBeDefined();
|
|
|
|
|
|
|
|
expect(el.querySelector('.js-usage-info').innerText).toContain(messages.loadFailed);
|
2017-08-17 22:00:37 +05:30
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
it('should show metrics unavailable message when metrics loading failed', (done) => {
|
2017-08-17 22:00:37 +05:30
|
|
|
vm.loadingMetrics = false;
|
|
|
|
vm.hasMetrics = false;
|
|
|
|
vm.loadFailed = false;
|
|
|
|
|
|
|
|
Vue.nextTick(() => {
|
2018-12-13 13:39:08 +05:30
|
|
|
expect(el.querySelector('.js-usage-info.usage-info-unavailable')).toBeDefined();
|
|
|
|
|
|
|
|
expect(el.querySelector('.js-usage-info').innerText).toContain(messages.metricsUnavailable);
|
2017-08-17 22:00:37 +05:30
|
|
|
done();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|