Commit 6bcf316e authored by Bryce Johnson's avatar Bryce Johnson

Pass docsUrl to pipeline schedules callout component.

parent f737a079
...@@ -4,8 +4,10 @@ import illustrationSvg from '../icons/intro_illustration.svg'; ...@@ -4,8 +4,10 @@ import illustrationSvg from '../icons/intro_illustration.svg';
const cookieKey = 'pipeline_schedules_callout_dismissed'; const cookieKey = 'pipeline_schedules_callout_dismissed';
export default { export default {
name: 'PipelineSchedulesCallout',
data() { data() {
return { return {
docsUrl: document.getElementById('pipeline-schedules-callout').dataset.docsUrl,
illustrationSvg, illustrationSvg,
calloutDismissed: Cookies.get(cookieKey) === 'true', calloutDismissed: Cookies.get(cookieKey) === 'true',
}; };
...@@ -33,8 +35,10 @@ export default { ...@@ -33,8 +35,10 @@ export default {
Those scheduled pipelines will inherit limited project access based on their associated user. Those scheduled pipelines will inherit limited project access based on their associated user.
</p> </p>
<p> Learn more in the <p> Learn more in the
<!-- FIXME --> <a
<a href="random.com">pipeline schedules documentation</a>. :href="docsUrl"
target="_blank"
rel="nofollow">pipeline schedules documentation</a>. <!-- oneline to prevent extra space before period -->
</p> </p>
</div> </div>
</div> </div>
......
import Vue from 'vue'; import Vue from 'vue';
import PipelineSchedulesCallout from './components/pipeline_schedules_callout'; import PipelineSchedulesCallout from './components/pipeline_schedules_callout';
const PipelineSchedulesCalloutComponent = Vue.extend(PipelineSchedulesCallout); document.addEventListener('DOMContentLoaded', () => new Vue({
el: '#pipeline-schedules-callout',
document.addEventListener('DOMContentLoaded', () => { components: {
new PipelineSchedulesCalloutComponent() 'pipeline-schedules-callout': PipelineSchedulesCallout,
.$mount('#scheduling-pipelines-callout'); },
}); render(createElement) {
return createElement('pipeline-schedules-callout');
},
}));
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
= render "projects/pipelines/head" = render "projects/pipelines/head"
%div{ class: container_class } %div{ class: container_class }
#scheduling-pipelines-callout #pipeline-schedules-callout{ data: { docs_url: help_page_path('ci/pipeline_schedules') } }
.top-area .top-area
- schedule_path_proc = ->(scope) { pipeline_schedules_path(@project, scope: scope) } - schedule_path_proc = ->(scope) { pipeline_schedules_path(@project, scope: scope) }
= render "tabs", schedule_path_proc: schedule_path_proc, all_schedules: @all_schedules, scope: @scope = render "tabs", schedule_path_proc: schedule_path_proc, all_schedules: @all_schedules, scope: @scope
......
---
title: Pass docsUrl to pipeline schedules callout component.
merge_request: !1126
author:
...@@ -4,8 +4,15 @@ import PipelineSchedulesCallout from '~/pipeline_schedules/components/pipeline_s ...@@ -4,8 +4,15 @@ import PipelineSchedulesCallout from '~/pipeline_schedules/components/pipeline_s
const PipelineSchedulesCalloutComponent = Vue.extend(PipelineSchedulesCallout); const PipelineSchedulesCalloutComponent = Vue.extend(PipelineSchedulesCallout);
const cookieKey = 'pipeline_schedules_callout_dismissed'; const cookieKey = 'pipeline_schedules_callout_dismissed';
const docsUrl = 'help/ci/scheduled_pipelines';
describe('Pipeline Schedule Callout', () => { describe('Pipeline Schedule Callout', () => {
beforeEach(() => {
setFixtures(`
<div id='pipeline-schedules-callout' data-docs-url=${docsUrl}></div>
`);
});
describe('independent of cookies', () => { describe('independent of cookies', () => {
beforeEach(() => { beforeEach(() => {
this.calloutComponent = new PipelineSchedulesCalloutComponent().$mount(); this.calloutComponent = new PipelineSchedulesCalloutComponent().$mount();
...@@ -18,6 +25,10 @@ describe('Pipeline Schedule Callout', () => { ...@@ -18,6 +25,10 @@ describe('Pipeline Schedule Callout', () => {
it('correctly sets illustrationSvg', () => { it('correctly sets illustrationSvg', () => {
expect(this.calloutComponent.illustrationSvg).toContain('<svg'); expect(this.calloutComponent.illustrationSvg).toContain('<svg');
}); });
it('correctly sets docsUrl', () => {
expect(this.calloutComponent.docsUrl).toContain(docsUrl);
});
}); });
describe(`when ${cookieKey} cookie is set`, () => { describe(`when ${cookieKey} cookie is set`, () => {
...@@ -61,6 +72,10 @@ describe('Pipeline Schedule Callout', () => { ...@@ -61,6 +72,10 @@ describe('Pipeline Schedule Callout', () => {
expect(this.calloutComponent.$el.outerHTML).toContain('runs pipelines in the future'); expect(this.calloutComponent.$el.outerHTML).toContain('runs pipelines in the future');
}); });
it('renders the documentation url', () => {
expect(this.calloutComponent.$el.outerHTML).toContain(docsUrl);
});
it('updates calloutDismissed when close button is clicked', (done) => { it('updates calloutDismissed when close button is clicked', (done) => {
this.calloutComponent.$el.querySelector('#dismiss-callout-btn').click(); this.calloutComponent.$el.querySelector('#dismiss-callout-btn').click();
......
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