Merge branch '41937-vue-prop-type' into 'master'

app/assets/javascripts/jobs/components/header.vue

@@ -30,8 +30,12 @@
       shouldRenderContent() {
         return !this.isLoading && Object.keys(this.job).length;
       },
+      /**
+       * When job has not started the key will be `false`
+       * When job started the key will be a string with a date.
+       */
       jobStarted() {
-        return this.job.started;
+        return !this.job.started === false;
       },
     },
     watch: {

spec/javascripts/jobs/header_spec.js

@@ -31,6 +31,7 @@ describe('Job details header', () => {
           email: 'foo@bar.com',
           avatar_url: 'link',
         },
+        started: '2018-01-08T09:48:27.319Z',
         new_issue_path: 'path',
       },
       isLoading: false,
@@ -43,6 +44,11 @@ describe('Job details header', () => {
     vm.$destroy();
   });
 
+  describe('triggered job', () => {
+    beforeEach(() => {
+      vm = mountComponent(HeaderComponent, props);
+    });
+
     it('should render provided job information', () => {
       expect(
         vm.$el.querySelector('.header-main-content').textContent.replace(/\s+/g, ' ').trim(),
@@ -54,4 +60,16 @@ describe('Job details header', () => {
         vm.$el.querySelector('.js-new-issue').getAttribute('href'),
       ).toEqual(props.job.new_issue_path);
     });
+  });
+
+  describe('created job', () => {
+    it('should render created key', () => {
+      props.job.started = false;
+      vm = mountComponent(HeaderComponent, props);
+
+      expect(
+        vm.$el.querySelector('.header-main-content').textContent.replace(/\s+/g, ' ').trim(),
+      ).toEqual('failed Job #123 created 3 weeks ago by Foo');
+    });
+  });
 });