diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2019-11-21 15:06:40 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2019-11-21 15:06:40 +0300 |
commit | 0a6ffb540e569bd7a7c548d59b12bc55d4bf9cf1 (patch) | |
tree | 9ff7dd7b21a3f9642a8fbb45c922f71a433faf02 /spec/javascripts/vue_shared | |
parent | a048261403ea7e12992ccffe704f0779235712d7 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/javascripts/vue_shared')
-rw-r--r-- | spec/javascripts/vue_shared/components/memory_graph_spec.js | 131 | ||||
-rw-r--r-- | spec/javascripts/vue_shared/components/mock_data.js | 67 |
2 files changed, 0 insertions, 198 deletions
diff --git a/spec/javascripts/vue_shared/components/memory_graph_spec.js b/spec/javascripts/vue_shared/components/memory_graph_spec.js deleted file mode 100644 index 78c3ae3ddb3..00000000000 --- a/spec/javascripts/vue_shared/components/memory_graph_spec.js +++ /dev/null @@ -1,131 +0,0 @@ -import Vue from 'vue'; -import MemoryGraph from '~/vue_shared/components/memory_graph.vue'; -import { mockMetrics, mockMedian, mockMedianIndex } from './mock_data'; - -const defaultHeight = '25'; -const defaultWidth = '100'; - -const createComponent = () => { - const Component = Vue.extend(MemoryGraph); - - return new Component({ - el: document.createElement('div'), - propsData: { - metrics: [], - deploymentTime: 0, - width: '', - height: '', - pathD: '', - pathViewBox: '', - dotX: '', - dotY: '', - }, - }); -}; - -describe('MemoryGraph', () => { - let vm; - let el; - - beforeEach(() => { - vm = createComponent(); - el = vm.$el; - }); - - describe('data', () => { - it('should have default data', () => { - const data = MemoryGraph.data(); - const dataValidator = (dataItem, expectedType, defaultVal) => { - expect(typeof dataItem).toBe(expectedType); - expect(dataItem).toBe(defaultVal); - }; - - dataValidator(data.pathD, 'string', ''); - dataValidator(data.pathViewBox, 'string', ''); - dataValidator(data.dotX, 'string', ''); - dataValidator(data.dotY, 'string', ''); - }); - }); - - describe('computed', () => { - describe('getFormattedMedian', () => { - it('should show human readable median value based on provided median timestamp', () => { - vm.deploymentTime = mockMedian; - const formattedMedian = vm.getFormattedMedian; - - expect(formattedMedian.indexOf('Deployed')).toBeGreaterThan(-1); - expect(formattedMedian.indexOf('ago')).toBeGreaterThan(-1); - }); - }); - }); - - describe('methods', () => { - describe('getMedianMetricIndex', () => { - it('should return index of closest metric timestamp to that of median', () => { - const matchingIndex = vm.getMedianMetricIndex(mockMedian, mockMetrics); - - expect(matchingIndex).toBe(mockMedianIndex); - }); - }); - - describe('getGraphPlotValues', () => { - it('should return Object containing values to plot graph', () => { - const plotValues = vm.getGraphPlotValues(mockMedian, mockMetrics); - - expect(plotValues.pathD).toBeDefined(); - expect(Array.isArray(plotValues.pathD)).toBeTruthy(); - - expect(plotValues.pathViewBox).toBeDefined(); - expect(typeof plotValues.pathViewBox).toBe('object'); - - expect(plotValues.dotX).toBeDefined(); - expect(typeof plotValues.dotX).toBe('number'); - - expect(plotValues.dotY).toBeDefined(); - expect(typeof plotValues.dotY).toBe('number'); - }); - }); - }); - - describe('template', () => { - it('should render template elements correctly', () => { - expect(el.classList.contains('memory-graph-container')).toBeTruthy(); - expect(el.querySelector('svg')).toBeDefined(); - }); - - it('should render graph when renderGraph is called internally', done => { - const { pathD, pathViewBox, dotX, dotY } = vm.getGraphPlotValues(mockMedian, mockMetrics); - vm.height = defaultHeight; - vm.width = defaultWidth; - vm.pathD = `M ${pathD}`; - vm.pathViewBox = `0 0 ${pathViewBox.lineWidth} ${pathViewBox.diff}`; - vm.dotX = dotX; - vm.dotY = dotY; - - Vue.nextTick(() => { - const svgEl = el.querySelector('svg'); - - expect(svgEl).toBeDefined(); - expect(svgEl.getAttribute('height')).toBe(defaultHeight); - expect(svgEl.getAttribute('width')).toBe(defaultWidth); - - const pathEl = el.querySelector('path'); - - expect(pathEl).toBeDefined(); - expect(pathEl.getAttribute('d')).toBe(`M ${pathD}`); - expect(pathEl.getAttribute('viewBox')).toBe( - `0 0 ${pathViewBox.lineWidth} ${pathViewBox.diff}`, - ); - - const circleEl = el.querySelector('circle'); - - expect(circleEl).toBeDefined(); - expect(circleEl.getAttribute('r')).toBe('1.5'); - expect(circleEl.getAttribute('transform')).toBe('translate(0 -1)'); - expect(circleEl.getAttribute('cx')).toBe(`${dotX}`); - expect(circleEl.getAttribute('cy')).toBe(`${dotY}`); - done(); - }); - }); - }); -}); diff --git a/spec/javascripts/vue_shared/components/mock_data.js b/spec/javascripts/vue_shared/components/mock_data.js deleted file mode 100644 index 15b56c58c33..00000000000 --- a/spec/javascripts/vue_shared/components/mock_data.js +++ /dev/null @@ -1,67 +0,0 @@ -export const mockMetrics = [ - [1493716685, '4.30859375'], - [1493716745, '4.30859375'], - [1493716805, '4.30859375'], - [1493716865, '4.30859375'], - [1493716925, '4.30859375'], - [1493716985, '4.30859375'], - [1493717045, '4.30859375'], - [1493717105, '4.30859375'], - [1493717165, '4.30859375'], - [1493717225, '4.30859375'], - [1493717285, '4.30859375'], - [1493717345, '4.30859375'], - [1493717405, '4.30859375'], - [1493717465, '4.30859375'], - [1493717525, '4.30859375'], - [1493717585, '4.30859375'], - [1493717645, '4.30859375'], - [1493717705, '4.30859375'], - [1493717765, '4.30859375'], - [1493717825, '4.30859375'], - [1493717885, '4.30859375'], - [1493717945, '4.30859375'], - [1493718005, '4.30859375'], - [1493718065, '4.30859375'], - [1493718125, '4.30859375'], - [1493718185, '4.30859375'], - [1493718245, '4.30859375'], - [1493718305, '4.234375'], - [1493718365, '4.234375'], - [1493718425, '4.234375'], - [1493718485, '4.234375'], - [1493718545, '4.243489583333333'], - [1493718605, '4.2109375'], - [1493718665, '4.2109375'], - [1493718725, '4.2109375'], - [1493718785, '4.26171875'], - [1493718845, '4.26171875'], - [1493718905, '4.26171875'], - [1493718965, '4.26171875'], - [1493719025, '4.26171875'], - [1493719085, '4.26171875'], - [1493719145, '4.26171875'], - [1493719205, '4.26171875'], - [1493719265, '4.26171875'], - [1493719325, '4.26171875'], - [1493719385, '4.26171875'], - [1493719445, '4.26171875'], - [1493719505, '4.26171875'], - [1493719565, '4.26171875'], - [1493719625, '4.26171875'], - [1493719685, '4.26171875'], - [1493719745, '4.26171875'], - [1493719805, '4.26171875'], - [1493719865, '4.26171875'], - [1493719925, '4.26171875'], - [1493719985, '4.26171875'], - [1493720045, '4.26171875'], - [1493720105, '4.26171875'], - [1493720165, '4.26171875'], - [1493720225, '4.26171875'], - [1493720285, '4.26171875'], -]; - -export const mockMedian = 1493718485; - -export const mockMedianIndex = 30; |