Check for null in job tooltip title
This commit is contained in:
parent
4ccbd556d9
commit
5e4681372a
|
@ -59,8 +59,26 @@
|
|||
},
|
||||
|
||||
computed: {
|
||||
status() {
|
||||
return this.job && this.job.status ? this.job.status : {};
|
||||
},
|
||||
|
||||
tooltipText() {
|
||||
return `${this.job.name} - ${this.job.status.label}`;
|
||||
const textBuilder = [];
|
||||
|
||||
if (this.job.name) {
|
||||
textBuilder.push(this.job.name);
|
||||
}
|
||||
|
||||
if (this.job.name && this.status.label) {
|
||||
textBuilder.push('-');
|
||||
}
|
||||
|
||||
if (this.status.label) {
|
||||
textBuilder.push(`${this.job.status.label}`);
|
||||
}
|
||||
|
||||
return textBuilder.join(' ');
|
||||
},
|
||||
|
||||
/**
|
||||
|
@ -78,8 +96,8 @@
|
|||
<div class="ci-job-component">
|
||||
<a
|
||||
v-tooltip
|
||||
v-if="job.status.has_details"
|
||||
:href="job.status.details_path"
|
||||
v-if="status.has_details"
|
||||
:href="status.details_path"
|
||||
:title="tooltipText"
|
||||
:class="cssClassJobName"
|
||||
data-container="body"
|
||||
|
@ -95,6 +113,7 @@
|
|||
<div
|
||||
v-else
|
||||
v-tooltip
|
||||
class="js-job-component-tooltip"
|
||||
:title="tooltipText"
|
||||
:class="cssClassJobName"
|
||||
data-container="body"
|
||||
|
@ -108,18 +127,18 @@
|
|||
|
||||
<action-component
|
||||
v-if="hasAction && !isDropdown"
|
||||
:tooltip-text="job.status.action.title"
|
||||
:link="job.status.action.path"
|
||||
:action-icon="job.status.action.icon"
|
||||
:action-method="job.status.action.method"
|
||||
:tooltip-text="status.action.title"
|
||||
:link="status.action.path"
|
||||
:action-icon="status.action.icon"
|
||||
:action-method="status.action.method"
|
||||
/>
|
||||
|
||||
<dropdown-action-component
|
||||
v-if="hasAction && isDropdown"
|
||||
:tooltip-text="job.status.action.title"
|
||||
:link="job.status.action.path"
|
||||
:action-icon="job.status.action.icon"
|
||||
:action-method="job.status.action.method"
|
||||
:tooltip-text="status.action.title"
|
||||
:link="status.action.path"
|
||||
:action-icon="status.action.icon"
|
||||
:action-method="status.action.method"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
@ -113,4 +113,35 @@ describe('pipeline graph job component', () => {
|
|||
component.$el.querySelector('a').classList.contains('css-class-job-name'),
|
||||
).toBe(true);
|
||||
});
|
||||
|
||||
describe('status label', () => {
|
||||
it('should not render status label when it is not provided', () => {
|
||||
component = mountComponent(JobComponent, {
|
||||
job: {
|
||||
id: 4256,
|
||||
name: 'test',
|
||||
status: {
|
||||
icon: 'icon_status_success',
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
expect(component.$el.querySelector('.js-job-component-tooltip').getAttribute('data-original-title')).toEqual('test');
|
||||
});
|
||||
|
||||
it('should not render status label when it is provided', () => {
|
||||
component = mountComponent(JobComponent, {
|
||||
job: {
|
||||
id: 4256,
|
||||
name: 'test',
|
||||
status: {
|
||||
icon: 'icon_status_success',
|
||||
label: 'success',
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
expect(component.$el.querySelector('.js-job-component-tooltip').getAttribute('data-original-title')).toEqual('test - success');
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
Loading…
Reference in New Issue