removed useless v-if

removed pointless test & changed some deployment tests to make more sense
added in v-tooltip

5 files changed, 17 insertions, 55 deletions

diff --git a/app/assets/javascripts/vue_merge_request_widget/components/deployment.vue b/app/assets/javascripts/vue_merge_request_widget/components/deployment.vue
index dc91f8ca68c..7bef2e97349 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/deployment.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/components/deployment.vue
@@ -119,16 +119,15 @@ export default {
           </template>
           <span
             v-if="hasDeploymentTime"
-            :data-title="deployment.deployed_at_formatted"
+            v-tooltip
+            :title="deployment.deployed_at_formatted"
             class="js-deploy-time"
-            data-toggle="tooltip"
-            data-placement="top"
           >
             {{ deployTimeago }}
           </span>
           <loading-button
             v-if="deployment.stop_url"
-            container-class="btn btn-default btn-xs"
+            container-class="btn btn-default btn-xs prepend-left-default"
             label="Stop environment"
             :loading="isStopping"
             @click="stopEnvironment"
diff --git a/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js b/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js
index 3675a2eaa85..169adfe0a1d 100644
--- a/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js
+++ b/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js
@@ -67,9 +67,6 @@ export default {
     shouldRenderRelatedLinks() {
       return !!this.mr.relatedLinks && !this.mr.isNothingToMergeState;
     },
-    shouldRenderDeployments() {
-      return this.mr.deployments.length;
-    },
     shouldRenderSourceBranchRemovalStatus() {
       return !this.mr.canRemoveSourceBranch && this.mr.shouldRemoveSourceBranch &&
         (!this.mr.isNothingToMergeState && !this.mr.isMergedState);
@@ -251,7 +248,6 @@ export default {
         :has-ci="mr.hasCI"
         />
       <deployment
-        v-if="shouldRenderDeployments"
         v-for="deployment in mr.deployments"
         :key="deployment.id"
         :deployment="deployment"
diff --git a/app/assets/stylesheets/pages/merge_requests.scss b/app/assets/stylesheets/pages/merge_requests.scss
index bdb8e3535dd..4692d0fb873 100644
--- a/app/assets/stylesheets/pages/merge_requests.scss
+++ b/app/assets/stylesheets/pages/merge_requests.scss
@@ -748,10 +748,6 @@
   > *:not(:last-child) {
     margin-right: .3em;
   }
-
-  .btn {
-    margin-left: $gl-padding;
-  }
 }
 
 .deploy-link {
diff --git a/spec/javascripts/vue_mr_widget/components/deployment_spec.js b/spec/javascripts/vue_mr_widget/components/deployment_spec.js
index 9943c7ad668..ff8d54c029f 100644
--- a/spec/javascripts/vue_mr_widget/components/deployment_spec.js
+++ b/spec/javascripts/vue_mr_widget/components/deployment_spec.js
@@ -147,16 +147,26 @@ describe('Deployment component', () => {
       el = vm.$el;
     });
 
-    it('should render template elements correctly', () => {
-      expect(el.classList.contains('mr-widget-heading')).toEqual(true);
-      expect(el.querySelector('.js-icon-link')).not.toBeNull();
+    it('renders deployment name', () => {
       expect(el.querySelector('.js-deploy-meta').getAttribute('href')).toEqual(deploymentMockData.url);
       expect(el.querySelector('.js-deploy-meta').innerText).toContain(deploymentMockData.name);
+    });
+
+    it('renders external URL', () => {
       expect(el.querySelector('.js-deploy-url').getAttribute('href')).toEqual(deploymentMockData.external_url);
       expect(el.querySelector('.js-deploy-url').innerText).toContain(deploymentMockData.external_url_formatted);
+    });
+
+    it('renders stop button', () => {
+      expect(el.querySelector('.btn')).not.toBeNull();
+    });
+
+    it('renders deployment time', () => {
       expect(el.querySelector('.js-deploy-time').innerText).toContain(vm.deployTimeago);
+    });
+
+    it('renders metrics component', () => {
       expect(el.querySelector('.js-mr-memory-usage')).not.toBeNull();
-      expect(el.querySelector('button')).not.toBeNull();
     });
   });
 });
diff --git a/spec/javascripts/vue_mr_widget/mr_widget_options_spec.js b/spec/javascripts/vue_mr_widget/mr_widget_options_spec.js
index e235776fe3d..e55c7649d40 100644
--- a/spec/javascripts/vue_mr_widget/mr_widget_options_spec.js
+++ b/spec/javascripts/vue_mr_widget/mr_widget_options_spec.js
@@ -123,17 +123,6 @@ describe('mrWidgetOptions', () => {
         expect(vm.shouldRenderSourceBranchRemovalStatus).toEqual(false);
       });
     });
-
-    describe('shouldRenderDeployments', () => {
-      it('should return false for the initial data', () => {
-        expect(vm.shouldRenderDeployments).toBeFalsy();
-      });
-
-      it('should return true if there is deployments', () => {
-        vm.mr.deployments.push({}, {});
-        expect(vm.shouldRenderDeployments).toBeTruthy();
-      });
-    });
   });
 
   describe('methods', () => {
@@ -368,34 +357,6 @@ describe('mrWidgetOptions', () => {
     });
   });
 
-  describe('components', () => {
-    it('should register all components', () => {
-      const comps = mrWidgetOptions.components;
-      expect(comps['mr-widget-header']).toBeDefined();
-      expect(comps['mr-widget-merge-help']).toBeDefined();
-      expect(comps['mr-widget-pipeline']).toBeDefined();
-      expect(comps.Deployment).toBeDefined();
-      expect(comps['mr-widget-related-links']).toBeDefined();
-      expect(comps['mr-widget-merged']).toBeDefined();
-      expect(comps['mr-widget-closed']).toBeDefined();
-      expect(comps['mr-widget-merging']).toBeDefined();
-      expect(comps['mr-widget-failed-to-merge']).toBeDefined();
-      expect(comps['mr-widget-wip']).toBeDefined();
-      expect(comps['mr-widget-archived']).toBeDefined();
-      expect(comps['mr-widget-conflicts']).toBeDefined();
-      expect(comps['mr-widget-nothing-to-merge']).toBeDefined();
-      expect(comps['mr-widget-not-allowed']).toBeDefined();
-      expect(comps['mr-widget-missing-branch']).toBeDefined();
-      expect(comps['mr-widget-ready-to-merge']).toBeDefined();
-      expect(comps['mr-widget-checking']).toBeDefined();
-      expect(comps['mr-widget-unresolved-discussions']).toBeDefined();
-      expect(comps['mr-widget-pipeline-blocked']).toBeDefined();
-      expect(comps['mr-widget-pipeline-failed']).toBeDefined();
-      expect(comps['mr-widget-merge-when-pipeline-succeeds']).toBeDefined();
-      expect(comps['mr-widget-maintainer-edit']).toBeDefined();
-    });
-  });
-
   describe('rendering relatedLinks', () => {
     beforeEach((done) => {
       vm.mr.relatedLinks = {