diff options
author | bikebilly <fabio@gitlab.com> | 2017-08-03 10:05:56 +0200 |
---|---|---|
committer | bikebilly <fabio@gitlab.com> | 2017-08-03 10:05:56 +0200 |
commit | 40dfddd4077da4d594bd9e8956e1fcb1c99434e6 (patch) | |
tree | d0761ed84471c22b3b0949720e3e0734e8645aac /spec/javascripts/pipelines | |
parent | ed5445388de13f1d126fec14cc0a9ea9ae03b397 (diff) | |
parent | dc412b48693668f7fba3adea57b8be76685afa76 (diff) | |
download | gitlab-ce-40dfddd4077da4d594bd9e8956e1fcb1c99434e6.tar.gz |
Merge branch 'master' into 33329-tech-article-deploying-maven-artifacts
Diffstat (limited to 'spec/javascripts/pipelines')
-rw-r--r-- | spec/javascripts/pipelines/async_button_spec.js | 44 | ||||
-rw-r--r-- | spec/javascripts/pipelines/nav_controls_spec.js | 2 | ||||
-rw-r--r-- | spec/javascripts/pipelines/pipeline_url_spec.js | 4 | ||||
-rw-r--r-- | spec/javascripts/pipelines/pipelines_actions_spec.js | 33 | ||||
-rw-r--r-- | spec/javascripts/pipelines/pipelines_artifacts_spec.js | 2 | ||||
-rw-r--r-- | spec/javascripts/pipelines/pipelines_spec.js | 2 | ||||
-rw-r--r-- | spec/javascripts/pipelines/pipelines_table_row_spec.js | 161 | ||||
-rw-r--r-- | spec/javascripts/pipelines/pipelines_table_spec.js | 67 | ||||
-rw-r--r-- | spec/javascripts/pipelines/stage_spec.js | 43 | ||||
-rw-r--r-- | spec/javascripts/pipelines/time_ago_spec.js | 2 |
10 files changed, 283 insertions, 77 deletions
diff --git a/spec/javascripts/pipelines/async_button_spec.js b/spec/javascripts/pipelines/async_button_spec.js index 28c9c7ab282..48620898357 100644 --- a/spec/javascripts/pipelines/async_button_spec.js +++ b/spec/javascripts/pipelines/async_button_spec.js @@ -1,25 +1,20 @@ import Vue from 'vue'; import asyncButtonComp from '~/pipelines/components/async_button.vue'; +import eventHub from '~/pipelines/event_hub'; describe('Pipelines Async Button', () => { let component; - let spy; let AsyncButtonComponent; beforeEach(() => { AsyncButtonComponent = Vue.extend(asyncButtonComp); - spy = jasmine.createSpy('spy').and.returnValue(Promise.resolve()); - component = new AsyncButtonComponent({ propsData: { endpoint: '/foo', title: 'Foo', icon: 'fa fa-foo', cssClass: 'bar', - service: { - postAction: spy, - }, }, }).$mount(); }); @@ -33,7 +28,7 @@ describe('Pipelines Async Button', () => { }); it('should render the provided title', () => { - expect(component.$el.getAttribute('title')).toContain('Foo'); + expect(component.$el.getAttribute('data-original-title')).toContain('Foo'); expect(component.$el.getAttribute('aria-label')).toContain('Foo'); }); @@ -41,37 +36,12 @@ describe('Pipelines Async Button', () => { expect(component.$el.getAttribute('class')).toContain('bar'); }); - it('should call the service when it is clicked with the provided endpoint', () => { - component.$el.click(); - expect(spy).toHaveBeenCalledWith('/foo'); - }); - - it('should hide loading if request fails', () => { - spy = jasmine.createSpy('spy').and.returnValue(Promise.reject()); - - component = new AsyncButtonComponent({ - propsData: { - endpoint: '/foo', - title: 'Foo', - icon: 'fa fa-foo', - cssClass: 'bar', - dataAttributes: { - 'data-foo': 'foo', - }, - service: { - postAction: spy, - }, - }, - }).$mount(); - - component.$el.click(); - expect(component.$el.querySelector('.fa-spinner')).toBe(null); - }); - describe('With confirm dialog', () => { it('should call the service when confimation is positive', () => { spyOn(window, 'confirm').and.returnValue(true); - spy = jasmine.createSpy('spy').and.returnValue(Promise.resolve()); + eventHub.$on('postAction', (endpoint) => { + expect(endpoint).toEqual('/foo'); + }); component = new AsyncButtonComponent({ propsData: { @@ -79,15 +49,11 @@ describe('Pipelines Async Button', () => { title: 'Foo', icon: 'fa fa-foo', cssClass: 'bar', - service: { - postAction: spy, - }, confirmActionMessage: 'bar', }, }).$mount(); component.$el.click(); - expect(spy).toHaveBeenCalledWith('/foo'); }); }); }); diff --git a/spec/javascripts/pipelines/nav_controls_spec.js b/spec/javascripts/pipelines/nav_controls_spec.js index 601eebce38a..f1697840fcd 100644 --- a/spec/javascripts/pipelines/nav_controls_spec.js +++ b/spec/javascripts/pipelines/nav_controls_spec.js @@ -1,5 +1,5 @@ import Vue from 'vue'; -import navControlsComp from '~/pipelines/components/nav_controls'; +import navControlsComp from '~/pipelines/components/nav_controls.vue'; describe('Pipelines Nav Controls', () => { let NavControlsComponent; diff --git a/spec/javascripts/pipelines/pipeline_url_spec.js b/spec/javascripts/pipelines/pipeline_url_spec.js index 594a9856d2c..3c4b20a5f06 100644 --- a/spec/javascripts/pipelines/pipeline_url_spec.js +++ b/spec/javascripts/pipelines/pipeline_url_spec.js @@ -19,7 +19,7 @@ describe('Pipeline Url Component', () => { }, }).$mount(); - expect(component.$el.tagName).toEqual('TD'); + expect(component.$el.getAttribute('class')).toContain('table-section'); }); it('should render a link the provided path and id', () => { @@ -94,7 +94,7 @@ describe('Pipeline Url Component', () => { }, }).$mount(); - expect(component.$el.querySelector('.js-pipeline-url-lastest').textContent).toContain('latest'); + expect(component.$el.querySelector('.js-pipeline-url-latest').textContent).toContain('latest'); expect(component.$el.querySelector('.js-pipeline-url-yaml').textContent).toContain('yaml invalid'); expect(component.$el.querySelector('.js-pipeline-url-stuck').textContent).toContain('stuck'); }); diff --git a/spec/javascripts/pipelines/pipelines_actions_spec.js b/spec/javascripts/pipelines/pipelines_actions_spec.js index c89dacbcd93..72fb0a8f9ef 100644 --- a/spec/javascripts/pipelines/pipelines_actions_spec.js +++ b/spec/javascripts/pipelines/pipelines_actions_spec.js @@ -1,9 +1,8 @@ import Vue from 'vue'; -import pipelinesActionsComp from '~/pipelines/components/pipelines_actions'; +import pipelinesActionsComp from '~/pipelines/components/pipelines_actions.vue'; describe('Pipelines Actions dropdown', () => { let component; - let spy; let actions; let ActionsComponent; @@ -22,14 +21,9 @@ describe('Pipelines Actions dropdown', () => { }, ]; - spy = jasmine.createSpy('spy').and.returnValue(Promise.resolve()); - component = new ActionsComponent({ propsData: { actions, - service: { - postAction: spy, - }, }, }).$mount(); }); @@ -40,31 +34,6 @@ describe('Pipelines Actions dropdown', () => { ).toEqual(actions.length); }); - it('should call the service when an action is clicked', () => { - component.$el.querySelector('.js-pipeline-dropdown-manual-actions').click(); - component.$el.querySelector('.js-pipeline-action-link').click(); - - expect(spy).toHaveBeenCalledWith(actions[0].path); - }); - - it('should hide loading if request fails', () => { - spy = jasmine.createSpy('spy').and.returnValue(Promise.reject()); - - component = new ActionsComponent({ - propsData: { - actions, - service: { - postAction: spy, - }, - }, - }).$mount(); - - component.$el.querySelector('.js-pipeline-dropdown-manual-actions').click(); - component.$el.querySelector('.js-pipeline-action-link').click(); - - expect(component.$el.querySelector('.fa-spinner')).toEqual(null); - }); - it('should render a disabled action when it\'s not playable', () => { expect( component.$el.querySelector('.dropdown-menu li:last-child button').getAttribute('disabled'), diff --git a/spec/javascripts/pipelines/pipelines_artifacts_spec.js b/spec/javascripts/pipelines/pipelines_artifacts_spec.js index 9724b63d957..acb67d0ec21 100644 --- a/spec/javascripts/pipelines/pipelines_artifacts_spec.js +++ b/spec/javascripts/pipelines/pipelines_artifacts_spec.js @@ -1,5 +1,5 @@ import Vue from 'vue'; -import artifactsComp from '~/pipelines/components/pipelines_artifacts'; +import artifactsComp from '~/pipelines/components/pipelines_artifacts.vue'; describe('Pipelines Artifacts dropdown', () => { let component; diff --git a/spec/javascripts/pipelines/pipelines_spec.js b/spec/javascripts/pipelines/pipelines_spec.js index 3a56156358b..c30abb2edb0 100644 --- a/spec/javascripts/pipelines/pipelines_spec.js +++ b/spec/javascripts/pipelines/pipelines_spec.js @@ -1,5 +1,5 @@ import Vue from 'vue'; -import pipelinesComp from '~/pipelines/pipelines'; +import pipelinesComp from '~/pipelines/components/pipelines.vue'; import Store from '~/pipelines/stores/pipelines_store'; describe('Pipelines', () => { diff --git a/spec/javascripts/pipelines/pipelines_table_row_spec.js b/spec/javascripts/pipelines/pipelines_table_row_spec.js new file mode 100644 index 00000000000..7ce39dca112 --- /dev/null +++ b/spec/javascripts/pipelines/pipelines_table_row_spec.js @@ -0,0 +1,161 @@ +import Vue from 'vue'; +import tableRowComp from '~/pipelines/components/pipelines_table_row.vue'; + +describe('Pipelines Table Row', () => { + const jsonFixtureName = 'pipelines/pipelines.json'; + const buildComponent = (pipeline) => { + const PipelinesTableRowComponent = Vue.extend(tableRowComp); + return new PipelinesTableRowComponent({ + el: document.querySelector('.test-dom-element'), + propsData: { + pipeline, + service: {}, + }, + }).$mount(); + }; + + let component; + let pipeline; + let pipelineWithoutAuthor; + let pipelineWithoutCommit; + + preloadFixtures(jsonFixtureName); + + beforeEach(() => { + const pipelines = getJSONFixture(jsonFixtureName).pipelines; + pipeline = pipelines.find(p => p.id === 1); + pipelineWithoutAuthor = pipelines.find(p => p.id === 2); + pipelineWithoutCommit = pipelines.find(p => p.id === 3); + }); + + afterEach(() => { + component.$destroy(); + }); + + it('should render a table row', () => { + component = buildComponent(pipeline); + expect(component.$el.getAttribute('class')).toContain('gl-responsive-table-row'); + }); + + describe('status column', () => { + beforeEach(() => { + component = buildComponent(pipeline); + }); + + it('should render a pipeline link', () => { + expect( + component.$el.querySelector('.table-section.commit-link a').getAttribute('href'), + ).toEqual(pipeline.path); + }); + + it('should render status text', () => { + expect( + component.$el.querySelector('.table-section.commit-link a').textContent, + ).toContain(pipeline.details.status.text); + }); + }); + + describe('information column', () => { + beforeEach(() => { + component = buildComponent(pipeline); + }); + + it('should render a pipeline link', () => { + expect( + component.$el.querySelector('.table-section:nth-child(2) a').getAttribute('href'), + ).toEqual(pipeline.path); + }); + + it('should render pipeline ID', () => { + expect( + component.$el.querySelector('.table-section:nth-child(2) a > span').textContent, + ).toEqual(`#${pipeline.id}`); + }); + + describe('when a user is provided', () => { + it('should render user information', () => { + expect( + component.$el.querySelector('.table-section:nth-child(2) a:nth-child(3)').getAttribute('href'), + ).toEqual(pipeline.user.path); + + expect( + component.$el.querySelector('.table-section:nth-child(2) img').getAttribute('data-original-title'), + ).toEqual(pipeline.user.name); + }); + }); + }); + + describe('commit column', () => { + it('should render link to commit', () => { + component = buildComponent(pipeline); + + const commitLink = component.$el.querySelector('.branch-commit .commit-sha'); + expect(commitLink.getAttribute('href')).toEqual(pipeline.commit.commit_path); + }); + + const findElements = () => { + const commitTitleElement = component.$el.querySelector('.branch-commit .commit-title'); + const commitAuthorElement = commitTitleElement.querySelector('a.avatar-image-container'); + + if (!commitAuthorElement) { + return { commitAuthorElement }; + } + + const commitAuthorLink = commitAuthorElement.getAttribute('href'); + const commitAuthorName = commitAuthorElement.querySelector('img.avatar').getAttribute('data-original-title'); + + return { commitAuthorElement, commitAuthorLink, commitAuthorName }; + }; + + it('renders nothing without commit', () => { + expect(pipelineWithoutCommit.commit).toBe(null); + component = buildComponent(pipelineWithoutCommit); + + const { commitAuthorElement } = findElements(); + + expect(commitAuthorElement).toBe(null); + }); + + it('renders commit author', () => { + component = buildComponent(pipeline); + const { commitAuthorLink, commitAuthorName } = findElements(); + + expect(commitAuthorLink).toEqual(pipeline.commit.author.path); + expect(commitAuthorName).toEqual(pipeline.commit.author.username); + }); + + it('renders commit with unregistered author', () => { + expect(pipelineWithoutAuthor.commit.author).toBe(null); + component = buildComponent(pipelineWithoutAuthor); + + const { commitAuthorLink, commitAuthorName } = findElements(); + + expect(commitAuthorLink).toEqual(`mailto:${pipelineWithoutAuthor.commit.author_email}`); + expect(commitAuthorName).toEqual(pipelineWithoutAuthor.commit.author_name); + }); + }); + + describe('stages column', () => { + beforeEach(() => { + component = buildComponent(pipeline); + }); + + it('should render an icon for each stage', () => { + expect( + component.$el.querySelectorAll('.table-section:nth-child(4) .js-builds-dropdown-button').length, + ).toEqual(pipeline.details.stages.length); + }); + }); + + describe('actions column', () => { + beforeEach(() => { + component = buildComponent(pipeline); + }); + + it('should render the provided actions', () => { + expect( + component.$el.querySelectorAll('.table-section:nth-child(6) ul li').length, + ).toEqual(pipeline.details.manual_actions.length); + }); + }); +}); diff --git a/spec/javascripts/pipelines/pipelines_table_spec.js b/spec/javascripts/pipelines/pipelines_table_spec.js new file mode 100644 index 00000000000..3afe89c8db4 --- /dev/null +++ b/spec/javascripts/pipelines/pipelines_table_spec.js @@ -0,0 +1,67 @@ +import Vue from 'vue'; +import pipelinesTableComp from '~/pipelines/components/pipelines_table.vue'; +import '~/lib/utils/datetime_utility'; + +describe('Pipelines Table', () => { + const jsonFixtureName = 'pipelines/pipelines.json'; + + let pipeline; + let PipelinesTableComponent; + + preloadFixtures(jsonFixtureName); + + beforeEach(() => { + PipelinesTableComponent = Vue.extend(pipelinesTableComp); + const pipelines = getJSONFixture(jsonFixtureName).pipelines; + pipeline = pipelines.find(p => p.id === 1); + }); + + describe('table', () => { + let component; + beforeEach(() => { + component = new PipelinesTableComponent({ + propsData: { + pipelines: [], + }, + }).$mount(); + }); + + afterEach(() => { + component.$destroy(); + }); + + it('should render a table', () => { + expect(component.$el.getAttribute('class')).toContain('ci-table'); + }); + + it('should render table head with correct columns', () => { + expect(component.$el.querySelector('.table-section.js-pipeline-status').textContent.trim()).toEqual('Status'); + expect(component.$el.querySelector('.table-section.js-pipeline-info').textContent.trim()).toEqual('Pipeline'); + expect(component.$el.querySelector('.table-section.js-pipeline-commit').textContent.trim()).toEqual('Commit'); + expect(component.$el.querySelector('.table-section.js-pipeline-stages').textContent.trim()).toEqual('Stages'); + }); + }); + + describe('without data', () => { + it('should render an empty table', () => { + const component = new PipelinesTableComponent({ + propsData: { + pipelines: [], + }, + }).$mount(); + expect(component.$el.querySelectorAll('.commit.gl-responsive-table-row').length).toEqual(0); + }); + }); + + describe('with data', () => { + it('should render rows', () => { + const component = new PipelinesTableComponent({ + propsData: { + pipelines: [pipeline], + }, + }).$mount(); + + expect(component.$el.querySelectorAll('.commit.gl-responsive-table-row').length).toEqual(1); + }); + }); +}); diff --git a/spec/javascripts/pipelines/stage_spec.js b/spec/javascripts/pipelines/stage_spec.js index a4f32a1faed..1b96b2e3d51 100644 --- a/spec/javascripts/pipelines/stage_spec.js +++ b/spec/javascripts/pipelines/stage_spec.js @@ -83,4 +83,47 @@ describe('Pipelines stage component', () => { }, 0); }); }); + + describe('update endpoint correctly', () => { + const updatedInterceptor = (request, next) => { + if (request.url === 'bar') { + next(request.respondWith(JSON.stringify({ html: 'this is the updated content' }), { + status: 200, + })); + } + next(); + }; + + beforeEach(() => { + Vue.http.interceptors.push(updatedInterceptor); + }); + + afterEach(() => { + Vue.http.interceptors = _.without( + Vue.http.interceptors, updatedInterceptor, + ); + }); + + it('should update the stage to request the new endpoint provided', (done) => { + component.stage = { + status: { + group: 'running', + icon: 'running', + title: 'running', + }, + dropdown_path: 'bar', + }; + + Vue.nextTick(() => { + component.$el.querySelector('button').click(); + + setTimeout(() => { + expect( + component.$el.querySelector('.js-builds-dropdown-container ul').textContent.trim(), + ).toEqual('this is the updated content'); + done(); + }); + }); + }); + }); }); diff --git a/spec/javascripts/pipelines/time_ago_spec.js b/spec/javascripts/pipelines/time_ago_spec.js index 24581e8c672..42b34c82f89 100644 --- a/spec/javascripts/pipelines/time_ago_spec.js +++ b/spec/javascripts/pipelines/time_ago_spec.js @@ -1,5 +1,5 @@ import Vue from 'vue'; -import timeAgo from '~/pipelines/components/time_ago'; +import timeAgo from '~/pipelines/components/time_ago.vue'; describe('Timeago component', () => { let TimeAgo; |