Adds tests for tabs in the rspec for pipelines
Adds tests for the Linked Tabs class Removes event listener Adds builds
This commit is contained in:
parent
43e5009a30
commit
640062abdb
|
@ -1,4 +1,3 @@
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Linked Tabs
|
* Linked Tabs
|
||||||
*
|
*
|
||||||
|
@ -61,7 +60,9 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
// since this is a custom event we need jQuery :(
|
// since this is a custom event we need jQuery :(
|
||||||
$(document).on('shown.bs.tab', `${this.options.parentEl} a[data-toggle="tab"]`, evt => this.tabShown(evt));
|
$(document)
|
||||||
|
.off('shown.bs.tab', `${this.options.parentEl} a[data-toggle="tab"]`)
|
||||||
|
.on('shown.bs.tab', `${this.options.parentEl} a[data-toggle="tab"]`, evt => this.tabShown(evt));
|
||||||
|
|
||||||
this.activateTab(this.action);
|
this.activateTab(this.action);
|
||||||
}
|
}
|
||||||
|
@ -104,7 +105,7 @@
|
||||||
* Note: Will trigger `shown.bs.tab`
|
* Note: Will trigger `shown.bs.tab`
|
||||||
*/
|
*/
|
||||||
activateTab() {
|
activateTab() {
|
||||||
return $(`.pipelines-tabs a[data-action='${this.action}']`).tab('show');
|
return $(`${this.options.parentEl} a[data-action='${this.action}']`).tab('show');
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
})();
|
})();
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
class Projects::PipelinesController < Projects::ApplicationController
|
class Projects::PipelinesController < Projects::ApplicationController
|
||||||
before_action :pipeline, except: [:index, :new, :create]
|
before_action :pipeline, except: [:index, :new, :create]
|
||||||
before_action :commit, only: [:show]
|
before_action :commit, only: [:show, :builds]
|
||||||
before_action :authorize_read_pipeline!
|
before_action :authorize_read_pipeline!
|
||||||
before_action :authorize_create_pipeline!, only: [:new, :create]
|
before_action :authorize_create_pipeline!, only: [:new, :create]
|
||||||
before_action :authorize_update_pipeline!, only: [:retry, :cancel]
|
before_action :authorize_update_pipeline!, only: [:retry, :cancel]
|
||||||
|
@ -33,8 +33,12 @@ class Projects::PipelinesController < Projects::ApplicationController
|
||||||
end
|
end
|
||||||
|
|
||||||
def builds
|
def builds
|
||||||
|
respond_to do |format|
|
||||||
|
format.html do
|
||||||
render 'show'
|
render 'show'
|
||||||
end
|
end
|
||||||
|
end
|
||||||
|
end
|
||||||
|
|
||||||
def retry
|
def retry
|
||||||
pipeline.retry_failed(current_user)
|
pipeline.retry_failed(current_user)
|
||||||
|
|
|
@ -1,12 +1,12 @@
|
||||||
.tabs-holder
|
.tabs-holder
|
||||||
%ul.pipelines-tabs.nav-links.no-top.no-bottom
|
%ul.pipelines-tabs.nav-links.no-top.no-bottom
|
||||||
%li
|
%li
|
||||||
= link_to namespace_project_pipeline_path(@project.namespace, @project, @pipeline), data: { target: 'div#js-tab-pipeline', action: 'pipelines', toggle: 'tab' } do
|
= link_to namespace_project_pipeline_path(@project.namespace, @project, @pipeline), data: { target: 'div#js-tab-pipeline', action: 'pipelines', toggle: 'tab' }, class: 'pipeline-tab' do
|
||||||
Pipeline
|
Pipeline
|
||||||
%li
|
%li
|
||||||
= link_to builds_namespace_project_pipeline_path(@project.namespace, @project, @pipeline), data: {target: 'div#js-tab-builds', action: 'builds', toggle: 'tab' } do
|
= link_to builds_namespace_project_pipeline_path(@project.namespace, @project, @pipeline), data: {target: 'div#js-tab-builds', action: 'builds', toggle: 'tab' }, class: 'builds-tab' do
|
||||||
Builds
|
Builds
|
||||||
%span.badge= pipeline.statuses.count
|
%span.badge.js-builds-counter= pipeline.statuses.count
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -179,10 +179,14 @@ describe "Pipelines" do
|
||||||
end
|
end
|
||||||
|
|
||||||
context 'page tabs' do
|
context 'page tabs' do
|
||||||
it 'should have two tabs' do
|
it 'shows Pipeline and Builds tabs with link' do
|
||||||
expect(page).to have_link('Pipeline')
|
expect(page).to have_link('Pipeline')
|
||||||
expect(page).to have_link('Builds')
|
expect(page).to have_link('Builds')
|
||||||
end
|
end
|
||||||
|
|
||||||
|
it 'shows counter in Builds tab' do
|
||||||
|
expect(page.find('.js-builds-counter').text).to eq(pipeline.statuses.count.to_s)
|
||||||
|
end
|
||||||
end
|
end
|
||||||
|
|
||||||
context 'retrying builds' do
|
context 'retrying builds' do
|
||||||
|
|
|
@ -0,0 +1,55 @@
|
||||||
|
//= require lib/utils/bootstrap_linked_tabs
|
||||||
|
|
||||||
|
(() => {
|
||||||
|
describe('Linked Tabs', () => {
|
||||||
|
fixture.preload('linked_tabs');
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture.load('linked_tabs');
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('when is initialized', () => {
|
||||||
|
it('should activate the tab correspondent to the given action', () => {
|
||||||
|
const linkedTabs = new window.gl.LinkedTabs({ // eslint-disable-line
|
||||||
|
action: 'tab1',
|
||||||
|
defaultAction: 'tab1',
|
||||||
|
parentEl: '.linked-tabs',
|
||||||
|
});
|
||||||
|
|
||||||
|
expect(document.querySelector('#tab1').classList).toContain('active');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should active the default tab action when the action is show', () => {
|
||||||
|
const linkedTabs = new window.gl.LinkedTabs({ // eslint-disable-line
|
||||||
|
action: 'show',
|
||||||
|
defaultAction: 'tab1',
|
||||||
|
parentEl: '.linked-tabs',
|
||||||
|
});
|
||||||
|
|
||||||
|
expect(document.querySelector('#tab1').classList).toContain('active');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('on click', () => {
|
||||||
|
it('should change the url according to the clicked tab', () => {
|
||||||
|
const historySpy = spyOn(history, 'replaceState').and.callFake(() => {});
|
||||||
|
|
||||||
|
const linkedTabs = new window.gl.LinkedTabs({ // eslint-disable-line
|
||||||
|
action: 'show',
|
||||||
|
defaultAction: 'tab1',
|
||||||
|
parentEl: '.linked-tabs',
|
||||||
|
});
|
||||||
|
|
||||||
|
const secondTab = document.querySelector('.linked-tabs li:nth-child(2) a');
|
||||||
|
const newState = secondTab.getAttribute('href') + linkedTabs.currentLocation.search + linkedTabs.currentLocation.hash;
|
||||||
|
|
||||||
|
secondTab.click();
|
||||||
|
|
||||||
|
expect(historySpy).toHaveBeenCalledWith({
|
||||||
|
turbolinks: true,
|
||||||
|
url: newState,
|
||||||
|
}, document.title, newState);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
})();
|
|
@ -0,0 +1,13 @@
|
||||||
|
%ul.nav.nav-tabs.linked-tabs
|
||||||
|
%li
|
||||||
|
%a{ href: 'foo/bar/1', data: { target: 'div#tab1', action: 'tab1', toggle: 'tab' } }
|
||||||
|
Tab 1
|
||||||
|
%li
|
||||||
|
%a{ href: 'foo/bar/1/context', data: { target: 'div#tab2', action: 'tab2', toggle: 'tab' } }
|
||||||
|
Tab 2
|
||||||
|
|
||||||
|
.tab-content
|
||||||
|
#tab1.tab-pane
|
||||||
|
Tab 1 Content
|
||||||
|
#tab2.tab-pane
|
||||||
|
Tab 2 Content
|
Loading…
Reference in New Issue