Uses Vue app to render part of job show page

7 files changed, 487 insertions, 297 deletions

diff --git a/spec/features/projects/jobs/user_browses_job_spec.rb b/spec/features/projects/jobs/user_browses_job_spec.rb
index 7be6d23af65..fc7b78ac21f 100644
--- a/spec/features/projects/jobs/user_browses_job_spec.rb
+++ b/spec/features/projects/jobs/user_browses_job_spec.rb
@@ -16,7 +16,9 @@ describe 'User browses a job', :js do
     visit(project_job_path(project, build))
   end
 
-  it 'erases the job log' do
+  it 'erases the job log', :js do
+    wait_for_requests
+
     expect(page).to have_content("Job ##{build.id}")
     expect(page).to have_css('#build-trace')
 
@@ -29,9 +31,7 @@ describe 'User browses a job', :js do
     expect(build.artifacts_file.exists?).to be_falsy
     expect(build.artifacts_metadata.exists?).to be_falsy
 
-    page.within('.erased') do
-      expect(page).to have_content('Job has been erased')
-    end
+    expect(page).to have_content('Job has been erased')
   end
 
   context 'with a failed job' do
diff --git a/spec/features/projects/jobs_spec.rb b/spec/features/projects/jobs_spec.rb
index a95140f0fa4..6213cabfaad 100644
--- a/spec/features/projects/jobs_spec.rb
+++ b/spec/features/projects/jobs_spec.rb
@@ -369,39 +369,167 @@ describe 'Jobs', :clean_gitlab_redis_shared_state do
       end
     end
 
-    context 'when job starts environment' do
-      let(:environment) { create(:environment, project: project) }
-      let(:pipeline) { create(:ci_pipeline, project: project) }
+    context 'when job starts environment', :js do
+      let(:environment) { create(:environment, name: 'production', project: project) }
 
-      context 'job is successfull and has deployment' do
-        let(:deployment) { create(:deployment) }
-        let(:job) { create(:ci_build, :success, :trace_artifact, environment: environment.name, deployments: [deployment], pipeline: pipeline) }
+      context 'job is successful and has deployment' do
+        let(:build) { create(:ci_build, :success, :trace_live, environment: environment.name, pipeline: pipeline) }
+        let!(:deployment) { create(:deployment, environment: environment, project: environment.project, deployable: build) }
 
-        it 'shows a link for the job' do
-          visit project_job_path(project, job)
+        before do
+          visit project_job_path(project, build)
+          wait_for_requests
+          # scroll to the top of the page first
+          execute_script "window.scrollTo(0,0)"
+        end
 
+        it 'shows a link for the job' do
           expect(page).to have_link environment.name
         end
+
+        it 'shows deployment message' do
+          expect(page).to have_content 'This job is the most recent deployment'
+          expect(find('.js-environment-link')['href']).to match("environments/#{environment.id}")
+        end
       end
 
       context 'job is complete and not successful' do
-        let(:job) { create(:ci_build, :failed, :trace_artifact, environment: environment.name, pipeline: pipeline) }
+        let(:build) { create(:ci_build, :failed, :trace_artifact, environment: environment.name, pipeline: pipeline) }
 
         it 'shows a link for the job' do
-          visit project_job_path(project, job)
+          visit project_job_path(project, build)
+          wait_for_requests
+          # scroll to the top of the page first
+          execute_script "window.scrollTo(0,0)"
 
           expect(page).to have_link environment.name
+          expect(find('.js-environment-link')['href']).to match("environments/#{environment.id}")
         end
       end
 
-      context 'job creates a new deployment' do
-        let!(:deployment) { create(:deployment, environment: environment, sha: project.commit.id) }
-        let(:job) { create(:ci_build, :success, :trace_artifact, environment: environment.name, pipeline: pipeline) }
+      context 'deployment still not finished' do
+        let(:build) { create(:ci_build, :success, environment: environment.name, pipeline: pipeline) }
 
         it 'shows a link to latest deployment' do
-          visit project_job_path(project, job)
+          visit project_job_path(project, build)
+          wait_for_all_requests
+          # scroll to the top of the page first
+          execute_script "window.scrollTo(0,0)"
+
+          expect(page).to have_link environment.name
+          expect(page).to have_content 'This job is creating a deployment'
+          expect(find('.js-environment-link')['href']).to match("environments/#{environment.id}")
+        end
+      end
+    end
+
+    describe 'environment info in job view', :js do
+      before do
+        visit project_job_path(project, job)
+        wait_for_requests
+        # scroll to the top of the page first
+        execute_script "window.scrollTo(0,0)"
+      end
+
+      context 'job with outdated deployment' do
+        let(:job) { create(:ci_build, :success, :trace_artifact, environment: 'staging', pipeline: pipeline) }
+        let(:second_build) { create(:ci_build, :success, :trace_artifact, environment: 'staging', pipeline: pipeline) }
+        let(:environment) { create(:environment, name: 'staging', project: project) }
+        let!(:first_deployment) { create(:deployment, environment: environment, deployable: job) }
+        let!(:second_deployment) { create(:deployment, environment: environment, deployable: second_build) }
+
+        it 'shows deployment message' do
+          expected_text = 'This job is an out-of-date deployment ' \
+            "to staging. View the most recent deployment ##{second_deployment.iid}."
+
+          expect(page).to have_css('.environment-information', text: expected_text)
+        end
+
+        it 'renders a link to the most recent deployment' do
+          expect(find('.js-environment-link')['href']).to match("environments/#{environment.id}")
+          expect(find('.js-job-deployment-link')['href']).to include(second_deployment.deployable.project.path, second_deployment.deployable_id.to_s)
+        end
+      end
+
+      context 'job failed to deploy' do
+        let(:job) { create(:ci_build, :failed, :trace_artifact, environment: 'staging', pipeline: pipeline) }
+        let!(:environment) { create(:environment, name: 'staging', project: project) }
+
+        it 'shows deployment message' do
+          expected_text = 'The deployment of this job to staging did not succeed.'
+
+          expect(page).to have_css(
+            '.environment-information', text: expected_text)
+        end
+      end
+
+      context 'job will deploy' do
+        let(:job) { create(:ci_build, :running, :trace_live, environment: 'staging', pipeline: pipeline) }
+
+        context 'when environment exists' do
+          let!(:environment) { create(:environment, name: 'staging', project: project) }
+
+          it 'shows deployment message' do
+            expected_text = 'This job is creating a deployment to staging'
+
+            expect(page).to have_css(
+              '.environment-information', text: expected_text)
+            expect(find('.js-environment-link')['href']).to match("environments/#{environment.id}")
+          end
+
+          context 'when it has deployment' do
+            let!(:deployment) { create(:deployment, environment: environment) }
+
+            it 'shows that deployment will be overwritten' do
+              expected_text = 'This job is creating a deployment to staging'
+
+              expect(page).to have_css(
+                '.environment-information', text: expected_text)
+              expect(page).to have_css(
+                '.environment-information', text: 'latest deployment')
+              expect(find('.js-environment-link')['href']).to match("environments/#{environment.id}")
+            end
+          end
+        end
+
+        context 'when environment does not exist' do
+          let!(:environment) { create(:environment, name: 'staging', project: project) }
+
+          it 'shows deployment message' do
+            expected_text = 'This job is creating a deployment to staging'
+
+            expect(page).to have_css(
+              '.environment-information', text: expected_text)
+            expect(page).not_to have_css(
+              '.environment-information', text: 'latest deployment')
+            expect(find('.js-environment-link')['href']).to match("environments/#{environment.id}")
+          end
+        end
+      end
+
+      context 'job that failed to deploy and environment has not been created' do
+        let(:job) { create(:ci_build, :failed, :trace_artifact, environment: 'staging', pipeline: pipeline) }
+        let!(:environment) { create(:environment, name: 'staging', project: project) }
+
+        it 'shows deployment message' do
+          expected_text = 'The deployment of this job to staging did not succeed'
+
+          expect(page).to have_css(
+            '.environment-information', text: expected_text)
+        end
+      end
+
+      context 'job that will deploy and environment has not been created' do
+        let(:job) { create(:ci_build, :running, :trace_live, environment: 'staging', pipeline: pipeline) }
+        let!(:environment) { create(:environment, name: 'staging', project: project) }
+
+        it 'shows deployment message' do
+          expected_text = 'This job is creating a deployment to staging'
 
-          expect(page).to have_link('latest deployment')
+          expect(page).to have_css(
+            '.environment-information', text: expected_text)
+          expect(page).not_to have_css(
+            '.environment-information', text: 'latest deployment')
         end
       end
     end
diff --git a/spec/javascripts/jobs/components/environments_block_spec.js b/spec/javascripts/jobs/components/environments_block_spec.js
index 015c26be9fc..7d836129b13 100644
--- a/spec/javascripts/jobs/components/environments_block_spec.js
+++ b/spec/javascripts/jobs/components/environments_block_spec.js
@@ -5,19 +5,16 @@ import mountComponent from '../../helpers/vue_mount_component_helper';
 describe('Environments block', () => {
   const Component = Vue.extend(component);
   let vm;
-  const icon = {
+  const status = {
     group: 'success',
     icon: 'status_success',
     label: 'passed',
     text: 'passed',
     tooltip: 'passed',
   };
-  const deployment = {
-    path: 'deployment',
-    name: 'deployment name',
-  };
+
   const environment = {
-    path: '/environment',
+    environment_path: '/environment',
     name: 'environment',
   };
 
@@ -25,15 +22,14 @@ describe('Environments block', () => {
     vm.$destroy();
   });
 
-  describe('with latest deployment', () => {
+  describe('with last deployment', () => {
     it('renders info for most recent deployment', () => {
       vm = mountComponent(Component, {
         deploymentStatus: {
-          status: 'latest',
-          icon,
-          deployment,
+          status: 'last',
           environment,
         },
+        iconStatus: status,
       });
 
       expect(vm.$el.textContent.trim()).toEqual(
@@ -48,17 +44,17 @@ describe('Environments block', () => {
         vm = mountComponent(Component, {
           deploymentStatus: {
             status: 'out_of_date',
-            icon,
-            deployment,
             environment: Object.assign({}, environment, {
-              last_deployment: { name: 'deployment', path: 'last_deployment' },
+              last_deployment: { iid: 'deployment', deployable: { build_path: 'bar' } },
             }),
           },
+          iconStatus: status,
         });
 
         expect(vm.$el.textContent.trim()).toEqual(
-          'This job is an out-of-date deployment to environment. View the most recent deployment deployment.',
+          'This job is an out-of-date deployment to environment. View the most recent deployment #deployment.',
         );
+        expect(vm.$el.querySelector('.js-job-deployment-link').getAttribute('href')).toEqual('bar');
       });
     });
 
@@ -67,10 +63,9 @@ describe('Environments block', () => {
         vm = mountComponent(Component, {
           deploymentStatus: {
             status: 'out_of_date',
-            icon,
-            deployment: null,
             environment,
           },
+          iconStatus: status,
         });
 
         expect(vm.$el.textContent.trim()).toEqual(
@@ -85,10 +80,9 @@ describe('Environments block', () => {
       vm = mountComponent(Component, {
         deploymentStatus: {
           status: 'failed',
-          icon,
-          deployment: null,
           environment,
         },
+        iconStatus: status,
       });
 
       expect(vm.$el.textContent.trim()).toEqual(
@@ -99,21 +93,24 @@ describe('Environments block', () => {
 
   describe('creating deployment', () => {
     describe('with last deployment', () => {
-      it('renders info about creating deployment and overriding lastest deployment', () => {
+      it('renders info about creating deployment and overriding latest deployment', () => {
         vm = mountComponent(Component, {
           deploymentStatus: {
             status: 'creating',
-            icon,
-            deployment,
             environment: Object.assign({}, environment, {
-              last_deployment: { name: 'deployment', path: 'last_deployment' },
+              last_deployment: {
+                iid: 'deployment',
+                deployable: { build_path: 'foo' },
+              },
             }),
           },
+          iconStatus: status,
         });
 
         expect(vm.$el.textContent.trim()).toEqual(
-          'This job is creating a deployment to environment and will overwrite the last deployment.',
+          'This job is creating a deployment to environment and will overwrite the latest deployment.',
         );
+        expect(vm.$el.querySelector('.js-job-deployment-link').getAttribute('href')).toEqual('foo');
       });
     });
 
@@ -122,10 +119,9 @@ describe('Environments block', () => {
         vm = mountComponent(Component, {
           deploymentStatus: {
             status: 'creating',
-            icon,
-            deployment: null,
             environment,
           },
+          iconStatus: status,
         });
 
         expect(vm.$el.textContent.trim()).toEqual(
@@ -133,5 +129,18 @@ describe('Environments block', () => {
         );
       });
     });
+
+    describe('without environment', () => {
+      it('does not render environment link', () => {
+        vm = mountComponent(Component, {
+          deploymentStatus: {
+            status: 'creating',
+            environment: null,
+          },
+          iconStatus: status,
+        });
+        expect(vm.$el.querySelector('.js-environment-link')).toBeNull();
+      });
+    });
   });
 });
diff --git a/spec/javascripts/jobs/components/header_spec.js b/spec/javascripts/jobs/components/header_spec.js
deleted file mode 100644
index e21e2c6d6e3..00000000000
--- a/spec/javascripts/jobs/components/header_spec.js
+++ /dev/null
@@ -1,98 +0,0 @@
-import Vue from 'vue';
-import headerComponent from '~/jobs/components/header.vue';
-import mountComponent from 'spec/helpers/vue_mount_component_helper';
-
-describe('Job details header', () => {
-  let HeaderComponent;
-  let vm;
-  let props;
-
-  beforeEach(() => {
-    HeaderComponent = Vue.extend(headerComponent);
-
-    const threeWeeksAgo = new Date();
-    threeWeeksAgo.setDate(threeWeeksAgo.getDate() - 21);
-
-    const twoDaysAgo = new Date();
-    twoDaysAgo.setDate(twoDaysAgo.getDate() - 2);
-
-    props = {
-      job: {
-        status: {
-          group: 'failed',
-          icon: 'status_failed',
-          label: 'failed',
-          text: 'failed',
-          details_path: 'path',
-        },
-        id: 123,
-        created_at: threeWeeksAgo.toISOString(),
-        user: {
-          web_url: 'path',
-          name: 'Foo',
-          username: 'foobar',
-          email: 'foo@bar.com',
-          avatar_url: 'link',
-        },
-        started: twoDaysAgo.toISOString(),
-        new_issue_path: 'path',
-      },
-      isLoading: false,
-    };
-  });
-
-  afterEach(() => {
-    vm.$destroy();
-  });
-
-  describe('job reason', () => {
-    it('should not render the reason when reason is absent', () => {
-      vm = mountComponent(HeaderComponent, props);
-
-      expect(vm.shouldRenderReason).toBe(false);
-    });
-
-    it('should render the reason when reason is present', () => {
-      props.job.callout_message = 'There is an unknown failure, please try again';
-
-      vm = mountComponent(HeaderComponent, props);
-
-      expect(vm.shouldRenderReason).toBe(true);
-    });
-  });
-
-  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(),
-      ).toEqual('failed Job #123 triggered 2 days ago by Foo');
-    });
-
-    it('should render new issue link', () => {
-      expect(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');
-    });
-  });
-});
diff --git a/spec/javascripts/jobs/components/job_app_spec.js b/spec/javascripts/jobs/components/job_app_spec.js
new file mode 100644
index 00000000000..c31fa6f9887
--- /dev/null
+++ b/spec/javascripts/jobs/components/job_app_spec.js
@@ -0,0 +1,185 @@
+import Vue from 'vue';
+import jobApp from '~/jobs/components/job_app.vue';
+import createStore from '~/jobs/store';
+import { mountComponentWithStore } from 'spec/helpers/vue_mount_component_helper';
+
+describe('Job App ', () => {
+  const Component = Vue.extend(jobApp);
+  let store;
+  let vm;
+
+  const threeWeeksAgo = new Date();
+  threeWeeksAgo.setDate(threeWeeksAgo.getDate() - 21);
+
+  const twoDaysAgo = new Date();
+  twoDaysAgo.setDate(twoDaysAgo.getDate() - 2);
+
+  const job = {
+    status: {
+      group: 'failed',
+      icon: 'status_failed',
+      label: 'failed',
+      text: 'failed',
+      details_path: 'path',
+    },
+    id: 123,
+    created_at: threeWeeksAgo.toISOString(),
+    user: {
+      web_url: 'path',
+      name: 'Foo',
+      username: 'foobar',
+      email: 'foo@bar.com',
+      avatar_url: 'link',
+    },
+    started: twoDaysAgo.toISOString(),
+    new_issue_path: 'path',
+    runners: {
+      available: false,
+    },
+    tags: ['docker'],
+  };
+
+  const props = {
+    runnerHelpUrl: 'help/runners',
+  };
+
+  beforeEach(() => {
+    store = createStore();
+  });
+
+  afterEach(() => {
+    vm.$destroy();
+  });
+
+  describe('Header section', () => {
+    describe('job callout message', () => {
+      it('should not render the reason when reason is absent', () => {
+        store.dispatch('receiveJobSuccess', job);
+
+        vm = mountComponentWithStore(Component, {
+          props,
+          store,
+        });
+
+        expect(vm.shouldRenderCalloutMessage).toBe(false);
+      });
+
+      it('should render the reason when reason is present', () => {
+        store.dispatch(
+          'receiveJobSuccess',
+          Object.assign({}, job, {
+            callout_message: 'There is an unknown failure, please try again',
+          }),
+        );
+
+        vm = mountComponentWithStore(Component, {
+          props,
+          store,
+        });
+
+        expect(vm.shouldRenderCalloutMessage).toBe(true);
+      });
+    });
+
+    describe('triggered job', () => {
+      beforeEach(() => {
+        store.dispatch('receiveJobSuccess', job);
+
+        vm = mountComponentWithStore(Component, {
+          props,
+          store,
+        });
+      });
+
+      it('should render provided job information', () => {
+        expect(
+          vm.$el
+            .querySelector('.header-main-content')
+            .textContent.replace(/\s+/g, ' ')
+            .trim(),
+        ).toEqual('failed Job #123 triggered 2 days ago by Foo');
+      });
+
+      it('should render new issue link', () => {
+        expect(vm.$el.querySelector('.js-new-issue').getAttribute('href')).toEqual(
+          job.new_issue_path,
+        );
+      });
+    });
+
+    describe('created job', () => {
+      it('should render created key', () => {
+        store.dispatch('receiveJobSuccess', Object.assign({}, job, { started: false }));
+
+        vm = mountComponentWithStore(Component, {
+          props,
+          store,
+        });
+
+        expect(
+          vm.$el
+            .querySelector('.header-main-content')
+            .textContent.replace(/\s+/g, ' ')
+            .trim(),
+        ).toEqual('failed Job #123 created 3 weeks ago by Foo');
+      });
+    });
+  });
+
+  describe('stuck block', () => {
+    it('renders stuck block when there are no runners', () => {
+      store.dispatch(
+        'receiveJobSuccess',
+        Object.assign({}, job, {
+          status: {
+            group: 'pending',
+            icon: 'status_pending',
+            label: 'pending',
+            text: 'pending',
+            details_path: 'path',
+          },
+        }),
+      );
+
+      vm = mountComponentWithStore(Component, {
+        props,
+        store,
+      });
+
+      expect(vm.$el.querySelector('.js-job-stuck')).not.toBeNull();
+    });
+
+    it('renders tags in stuck block when there are no runners', () => {
+      store.dispatch(
+        'receiveJobSuccess',
+        Object.assign({}, job, {
+          status: {
+            group: 'pending',
+            icon: 'status_pending',
+            label: 'pending',
+            text: 'pending',
+            details_path: 'path',
+          },
+        }),
+      );
+
+      vm = mountComponentWithStore(Component, {
+        props,
+        store,
+      });
+
+      expect(vm.$el.querySelector('.js-job-stuck').textContent).toContain(job.tags[0]);
+    });
+
+    it(' does not renders stuck block when there are no runners', () => {
+      store.dispatch('receiveJobSuccess', Object.assign({}, job, { runners: { available: true } }));
+
+      vm = mountComponentWithStore(Component, {
+        props,
+        store,
+      });
+
+      expect(vm.$el.querySelector('.js-job-stuck')).toBeNull();
+    });
+  });
+});
diff --git a/spec/javascripts/jobs/store/getters_spec.js b/spec/javascripts/jobs/store/getters_spec.js
new file mode 100644
index 00000000000..63ef4135d83
--- /dev/null
+++ b/spec/javascripts/jobs/store/getters_spec.js
@@ -0,0 +1,121 @@
+import * as getters from '~/jobs/store/getters';
+import state from '~/jobs/store/state';
+
+describe('Job Store Getters', () => {
+  let localState;
+
+  beforeEach(() => {
+    localState = state();
+  });
+
+  describe('headerActions', () => {
+    describe('with new issue path', () => {
+      it('returns an array with action to create a new issue', () => {
+        localState.job.new_issue_path = 'issues/new';
+
+        expect(getters.headerActions(localState)).toEqual([
+          {
+            label: 'New issue',
+            path: localState.job.new_issue_path,
+            cssClass:
+              'js-new-issue btn btn-success btn-inverted d-none d-md-block d-lg-block d-xl-block',
+            type: 'link',
+          },
+        ]);
+      });
+    });
+
+    describe('without new issue path', () => {
+      it('returns an empty array', () => {
+        expect(getters.headerActions(localState)).toEqual([]);
+      });
+    });
+  });
+
+  describe('headerTime', () => {
+    describe('when the job has started key', () => {
+      it('returns started key', () => {
+        const started = '2018-08-31T16:20:49.023Z';
+        localState.job.started = started;
+
+        expect(getters.headerTime(localState)).toEqual(started);
+      });
+    });
+
+    describe('when the job does not have started key', () => {
+      it('returns created_at key', () => {
+        const created = '2018-08-31T16:20:49.023Z';
+        localState.job.created_at = created;
+        expect(getters.headerTime(localState)).toEqual(created);
+      });
+    });
+  });
+
+  describe('shouldRenderCalloutMessage', () => {
+    describe('with status and callout message', () => {
+      it('returns true', () => {
+        localState.job.callout_message = 'Callout message';
+        localState.job.status = { icon: 'passed' };
+
+        expect(getters.shouldRenderCalloutMessage(localState)).toEqual(true);
+      });
+    });
+
+    describe('without status & with callout message', () => {
+      it('returns false', () => {
+        localState.job.callout_message = 'Callout message';
+        expect(getters.shouldRenderCalloutMessage(localState)).toEqual(false);
+      });
+    });
+
+    describe('with status & without callout message', () => {
+      it('returns false', () => {
+        localState.job.status = { icon: 'passed' };
+
+        expect(getters.shouldRenderCalloutMessage(localState)).toEqual(false);
+      });
+    });
+  });
+
+  describe('jobHasStarted', () => {
+    describe('when started equals false', () => {
+      it('returns false', () => {
+        localState.job.started = false;
+        expect(getters.jobHasStarted(localState)).toEqual(false);
+      });
+    });
+
+    describe('when started equals string', () => {
+      it('returns true', () => {
+        localState.job.started = '2018-08-31T16:20:49.023Z';
+        expect(getters.jobHasStarted(localState)).toEqual(true);
+      });
+    });
+  });
+
+  describe('hasEnvironment', () => {
+    describe('without `deployment_status`', () => {
+      it('returns false', () => {
+        expect(getters.hasEnvironment(localState)).toEqual(false);
+      });
+    });
+    describe('with an empty object for `deployment_status`', () => {
+      it('returns false', () => {
+        localState.job.deployment_status = {};
+        expect(getters.hasEnvironment(localState)).toEqual(false);
+      });
+    });
+    describe('when `deployment_status` is defined and not empty', () => {
+      it('returns true', () => {
+        localState.job.deployment_status = {
+          status: 'creating',
+          environment: {
+            last_deployment: {},
+          },
+        };
+
+        expect(getters.hasEnvironment(localState)).toEqual(true);
+      });
+    });
+  });
+});
diff --git a/spec/views/projects/jobs/show.html.haml_spec.rb b/spec/views/projects/jobs/show.html.haml_spec.rb
index 496646dc623..e06a9ecb98b 100644
--- a/spec/views/projects/jobs/show.html.haml_spec.rb
+++ b/spec/views/projects/jobs/show.html.haml_spec.rb
@@ -18,161 +18,6 @@ describe 'projects/jobs/show' do
     allow(view).to receive(:can?).and_return(true)
   end
 
-  describe 'environment info in job view' do
-    context 'job with latest deployment' do
-      let(:build) do
-        create(:ci_build, :success, :trace_artifact, environment: 'staging')
-      end
-
-      before do
-        create(:environment, name: 'staging')
-        create(:deployment, deployable: build)
-      end
-
-      it 'shows deployment message' do
-        expected_text = 'This job is the most recent deployment'
-        render
-
-        expect(rendered).to have_css(
-          '.environment-information', text: expected_text)
-      end
-    end
-
-    context 'job with outdated deployment' do
-      let(:build) do
-        create(:ci_build, :success, :trace_artifact, environment: 'staging', pipeline: pipeline)
-      end
-
-      let(:second_build) do
-        create(:ci_build, :success, :trace_artifact, environment: 'staging', pipeline: pipeline)
-      end
-
-      let(:environment) do
-        create(:environment, name: 'staging', project: project)
-      end
-
-      let!(:first_deployment) do
-        create(:deployment, environment: environment, deployable: build)
-      end
-
-      let!(:second_deployment) do
-        create(:deployment, environment: environment, deployable: second_build)
-      end
-
-      it 'shows deployment message' do
-        expected_text = 'This job is an out-of-date deployment ' \
-          "to staging.\nView the most recent deployment ##{second_deployment.iid}."
-        render
-
-        expect(rendered).to have_css('.environment-information', text: expected_text)
-      end
-    end
-
-    context 'job failed to deploy' do
-      let(:build) do
-        create(:ci_build, :failed, :trace_artifact, environment: 'staging', pipeline: pipeline)
-      end
-
-      let!(:environment) do
-        create(:environment, name: 'staging', project: project)
-      end
-
-      it 'shows deployment message' do
-        expected_text = 'The deployment of this job to staging did not succeed.'
-        render
-
-        expect(rendered).to have_css(
-          '.environment-information', text: expected_text)
-      end
-    end
-
-    context 'job will deploy' do
-      let(:build) do
-        create(:ci_build, :running, :trace_live, environment: 'staging', pipeline: pipeline)
-      end
-
-      context 'when environment exists' do
-        let!(:environment) do
-          create(:environment, name: 'staging', project: project)
-        end
-
-        it 'shows deployment message' do
-          expected_text = 'This job is creating a deployment to staging'
-          render
-
-          expect(rendered).to have_css(
-            '.environment-information', text: expected_text)
-        end
-
-        context 'when it has deployment' do
-          let!(:deployment) do
-            create(:deployment, environment: environment)
-          end
-
-          it 'shows that deployment will be overwritten' do
-            expected_text = 'This job is creating a deployment to staging'
-            render
-
-            expect(rendered).to have_css(
-              '.environment-information', text: expected_text)
-            expect(rendered).to have_css(
-              '.environment-information', text: 'latest deployment')
-          end
-        end
-      end
-
-      context 'when environment does not exist' do
-        it 'shows deployment message' do
-          expected_text = 'This job is creating a deployment to staging'
-          render
-
-          expect(rendered).to have_css(
-            '.environment-information', text: expected_text)
-          expect(rendered).not_to have_css(
-            '.environment-information', text: 'latest deployment')
-        end
-      end
-    end
-
-    context 'job that failed to deploy and environment has not been created' do
-      let(:build) do
-        create(:ci_build, :failed, :trace_artifact, environment: 'staging', pipeline: pipeline)
-      end
-
-      let!(:environment) do
-        create(:environment, name: 'staging', project: project)
-      end
-
-      it 'shows deployment message' do
-        expected_text = 'The deployment of this job to staging did not succeed'
-        render
-
-        expect(rendered).to have_css(
-          '.environment-information', text: expected_text)
-      end
-    end
-
-    context 'job that will deploy and environment has not been created' do
-      let(:build) do
-        create(:ci_build, :running, :trace_live, environment: 'staging', pipeline: pipeline)
-      end
-
-      let!(:environment) do
-        create(:environment, name: 'staging', project: project)
-      end
-
-      it 'shows deployment message' do
-        expected_text = 'This job is creating a deployment to staging'
-        render
-
-        expect(rendered).to have_css(
-          '.environment-information', text: expected_text)
-        expect(rendered).not_to have_css(
-          '.environment-information', text: 'latest deployment')
-      end
-    end
-  end
-
   context 'when job is running' do
     let(:build) { create(:ci_build, :trace_live, :running, pipeline: pipeline) }