Commit 5e468137 authored by Filipa Lacerda's avatar Filipa Lacerda

Check for null in job tooltip title

parent 4ccbd556
......@@ -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');
});
});
});
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