Commit 31ce3e81 authored by Lukas Eipert's avatar Lukas Eipert

resolve conflict in spec/javascripts/pipelines/graph/graph_component_spec.js

parent 4369fa6d
import Vue from 'vue';
import mountComponent from 'spec/helpers/vue_mount_component_helper';
import graphComponent from '~/pipelines/components/graph/graph_component.vue';
import graphJSON from './mock_data';
import linkedPipelineJSON from './linked_pipelines_mock_data';
import pipelineJSON from 'spec/pipelines/graph/mock_data';
import linkedPipelineJSON from 'spec/pipelines/graph/linked_pipelines_mock_data';
<<<<<<< HEAD
const GraphComponent = Vue.extend(graphComponent);
const pipelineJSON = Object.assign(graphJSON, {
const graphJSON = Object.assign(pipelineJSON, {
triggered: linkedPipelineJSON.triggered,
triggered_by: linkedPipelineJSON.triggered_by,
});
const defaultPropsData = {
pipeline: pipelineJSON,
isLoading: false,
};
describe('graph component', () => {
const GraphComponent = Vue.extend(graphComponent);
let component;
describe('graph component', function () {
describe('while is loading', function () {
beforeEach(function () {
this.component = new GraphComponent({
propsData: { pipeline: {}, isLoading: true },
}).$mount();
});
afterEach(() => {
component.$destroy();
});
it('should render a loading icon', function () {
expect(this.component.$el.querySelector('.fa-spinner')).not.toBeNull();
describe('while is loading', () => {
it('should render a loading icon', () => {
component = mountComponent(GraphComponent, {
isLoading: true,
pipeline: {},
});
expect(component.$el.querySelector('.loading-icon')).toBeDefined();
});
});
describe('when linked pipelines are present', function () {
beforeEach(function () {
this.component = new GraphComponent({
propsData: defaultPropsData,
}).$mount();
component = mountComponent(GraphComponent, {
isLoading: false,
pipeline: graphJSON,
});
});
describe('rendered output', function () {
it('should include the pipelines graph', function () {
expect(this.component.$el.classList.contains('js-pipeline-graph')).toEqual(true);
expect(component.$el.classList.contains('js-pipeline-graph')).toEqual(true);
});
it('should not include the loading icon', function () {
expect(this.component.$el.querySelector('.fa-spinner')).toBeNull();
expect(component.$el.querySelector('.fa-spinner')).toBeNull();
});
it('should include the stage column list', function () {
expect(this.component.$el.querySelector('.stage-column-list')).not.toBeNull();
expect(component.$el.querySelector('.stage-column-list')).not.toBeNull();
});
it('should include the no-margin class on the first child', function () {
const firstStageColumnElement = this.component.$el.querySelector('.stage-column-list .stage-column');
const firstStageColumnElement = component.$el.querySelector('.stage-column-list .stage-column');
expect(firstStageColumnElement.classList.contains('no-margin')).toEqual(true);
});
it('should include the has-only-one-job class on the first child', function () {
const firstStageColumnElement = this.component.$el.querySelector('.stage-column-list .stage-column');
const firstStageColumnElement = component.$el.querySelector('.stage-column-list .stage-column');
expect(firstStageColumnElement.classList.contains('has-only-one-job')).toEqual(true);
});
it('should include the left-margin class on the second child', function () {
const firstStageColumnElement = this.component.$el.querySelector('.stage-column-list .stage-column:last-child');
const firstStageColumnElement = component.$el.querySelector('.stage-column-list .stage-column:last-child');
expect(firstStageColumnElement.classList.contains('left-margin')).toEqual(true);
=======
describe('graph component', () => {
const GraphComponent = Vue.extend(graphComponent);
let component;
afterEach(() => {
component.$destroy();
});
describe('while is loading', () => {
it('should render a loading icon', () => {
component = mountComponent(GraphComponent, {
isLoading: true,
pipeline: {},
});
expect(component.$el.querySelector('.loading-icon')).toBeDefined();
});
});
describe('with data', () => {
it('should render the graph', () => {
component = mountComponent(GraphComponent, {
isLoading: false,
pipeline: graphJSON,
>>>>>>> upstream/master
});
it('should include the has-linked-pipelines flag', function () {
expect(this.component.$el.querySelector('.has-linked-pipelines')).not.toBeNull();
expect(component.$el.querySelector('.has-linked-pipelines')).not.toBeNull();
});
});
describe('computeds and methods', function () {
describe('capitalizeStageName', function () {
it('it capitalizes the stage name', function () {
expect(this.component.capitalizeStageName('mystage')).toBe('Mystage');
expect(component.capitalizeStageName('mystage')).toBe('Mystage');
});
});
describe('stageConnectorClass', function () {
it('it returns left-margin when there is a triggerer', function () {
expect(this.component.stageConnectorClass(0, { groups: ['job'] })).toBe('no-margin');
expect(component.stageConnectorClass(0, { groups: ['job'] })).toBe('no-margin');
});
});
});
describe('linked pipelines components', function () {
it('should coerce triggeredBy into a collection', function () {
expect(this.component.triggeredBy.length).toBe(1);
expect(component.triggeredBy.length).toBe(1);
});
it('should render an upstream pipelines column', function () {
expect(this.component.$el.querySelector('.linked-pipelines-column')).not.toBeNull();
expect(this.component.$el.innerHTML).toContain('Upstream');
expect(component.$el.querySelector('.linked-pipelines-column')).not.toBeNull();
expect(component.$el.innerHTML).toContain('Upstream');
});
it('should render a downstream pipelines column', function () {
expect(this.component.$el.querySelector('.linked-pipelines-column')).not.toBeNull();
expect(this.component.$el.innerHTML).toContain('Downstream');
expect(component.$el.querySelector('.linked-pipelines-column')).not.toBeNull();
expect(component.$el.innerHTML).toContain('Downstream');
});
});
});
......@@ -130,29 +103,30 @@ describe('graph component', () => {
describe('when linked pipelines are not present', function () {
beforeEach(function () {
const pipeline = Object.assign(graphJSON, { triggered: null, triggered_by: null });
this.component = new GraphComponent({
propsData: { pipeline, isLoading: false },
}).$mount();
component = mountComponent(GraphComponent, {
isLoading: false,
pipeline,
});
});
describe('rendered output', function () {
it('should include the first column with a no margin', function () {
const firstColumn = this.component.$el.querySelector('.stage-column:first-child');
const firstColumn = component.$el.querySelector('.stage-column:first-child');
expect(firstColumn.classList.contains('no-margin')).toEqual(true);
});
it('should not render a linked pipelines column', function () {
expect(this.component.$el.querySelector('.linked-pipelines-column')).toBeNull();
expect(component.$el.querySelector('.linked-pipelines-column')).toBeNull();
});
});
describe('stageConnectorClass', function () {
it('it returns left-margin when no triggerer and there is one job', function () {
expect(this.component.stageConnectorClass(0, { groups: ['job'] })).toBe('no-margin');
expect(component.stageConnectorClass(0, { groups: ['job'] })).toBe('no-margin');
});
it('it returns left-margin when no triggerer and not the first stage', function () {
expect(this.component.stageConnectorClass(99, { groups: ['job'] })).toBe('left-margin');
expect(component.stageConnectorClass(99, { groups: ['job'] })).toBe('left-margin');
});
});
});
......
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