Apply patch & modify tests

- Remove tooltip specs from components & revert back to original
- Add delete scenario in changed_file_icon_spec

app/assets/javascripts/diffs/components/diff_file_row.vue

@@ -6,7 +6,6 @@
 import FileRow from '~/vue_shared/components/file_row.vue';
 import FileRowStats from './file_row_stats.vue';
 import ChangedFileIcon from '~/vue_shared/components/changed_file_icon.vue';
-import { __ } from '~/locale';
 
 export default {
   name: 'DiffFileRow',
@@ -29,19 +28,6 @@ export default {
     showFileRowStats() {
       return !this.hideFileStats && this.file.type === 'blob';
     },
-    tooltipTitle() {
-      if (!this.file.changed) return undefined;
-
-      if (this.file.deleted) {
-        return __('Deleted');
-      }
-
-      if (this.file.tempFile) {
-        return __('Added');
-      }
-
-      return __('Modified');
-    },
   },
 };
 </script>
@@ -49,6 +35,6 @@ export default {
 <template>
   <file-row :file="file" v-bind="$attrs" v-on="$listeners">
     <file-row-stats v-if="showFileRowStats" :file="file" class="mr-1" />
-    <changed-file-icon :file="file" :size="16" :show-tooltip="true" :tooltip-title="tooltipTitle" />
+    <changed-file-icon :file="file" :size="16" :show-tooltip="true" />
   </file-row>
 </template>

app/assets/javascripts/ide/components/file_row_extra.vue

 <script>
 import { mapGetters } from 'vuex';
-import { n__, __ } from '~/locale';
+import { n__ } from '~/locale';
 import tooltip from '~/vue_shared/directives/tooltip';
 import Icon from '~/vue_shared/components/icon.vue';
 import ChangedFileIcon from '~/vue_shared/components/changed_file_icon.vue';
@@ -60,11 +60,6 @@ export default {
     showChangedFileIcon() {
       return !this.isTree && this.isModified;
     },
-    tooltipTitle() {
-      if (!this.file.changed) return undefined;
-
-      return this.file.tempFile ? __('Added') : __('Modified');
-    },
   },
 };
 </script>
@@ -89,7 +84,6 @@ export default {
       :file="file"
       :show-tooltip="true"
       :show-staged-icon="false"
-      :tooltip-title="tooltipTitle"
     />
     <new-dropdown
       :type="file.type"

app/assets/javascripts/vue_shared/components/changed_file_icon.vue

@@ -2,6 +2,7 @@
 import { GlTooltipDirective } from '@gitlab/ui';
 import Icon from '~/vue_shared/components/icon.vue';
 import { getCommitIconMap } from '~/ide/utils';
+import { __ } from '~/locale';
 
 export default {
   components: {
@@ -35,11 +36,6 @@ export default {
       required: false,
       default: true,
     },
-    tooltipTitle: {
-      type: String,
-      required: false,
-      default: null,
-    },
   },
   computed: {
     changedIcon() {
@@ -52,10 +48,18 @@ export default {
     changedIconClass() {
       return `${this.changedIcon} float-left d-block`;
     },
-    changedTooltipTitle() {
-      if (!this.showTooltip) return undefined;
+    tooltipTitle() {
+      if (!this.showTooltip) {
+        return undefined;
+      } else if (this.file.deleted) {
+        return __('Deleted');
+      } else if (this.file.tempFile) {
+        return __('Added');
+      } else if (this.file.changed) {
+        return __('Modified');
+      }
 
-      return this.tooltipTitle;
+      return undefined;
     },
     showIcon() {
       return (
@@ -73,7 +77,7 @@ export default {
 <template>
   <span
     v-gl-tooltip.right
-    :title="changedTooltipTitle"
+    :title="tooltipTitle"
     :class="{ 'ml-auto': isCentered }"
     class="file-changed-icon d-inline-block"
   >

spec/frontend/diffs/components/diff_file_row_spec.js

@@ -39,54 +39,21 @@ describe('Diff File Row component', () => {
     );
   });
 
-  describe('ChangedFileIcon component', () => {
-    const fileObject = (file = {}) => {
-      return {
-        changed: true,
-        ...file,
-      };
-    };
-    const componentProps = file => {
-      return {
-        level: 4,
-        file,
-        hideFileStats: false,
-      };
-    };
-
-    it('renders component with showTooltip', () => {
-      const file = fileObject();
-      createComponent(componentProps(file));
-      expect(wrapper.find(ChangedFileIcon).props()).toEqual(
-        expect.objectContaining({
-          file,
-          size: 16,
-          showTooltip: true,
-        }),
-      );
-    });
-
-    it.each`
-      message      | file          | desc
-      ${'Deleted'} | ${'deleted'}  | ${'shows "Deleted" tooltip if file has been deleted'}
-      ${'Added'}   | ${'tempFile'} | ${'shows "Added" tooltip if file has been added'}
-    `('$desc', ({ message, file }) => {
-      createComponent(
-        componentProps(
-          fileObject({
-            [file]: true,
-          }),
-        ),
-      );
-      expect(wrapper.find(ChangedFileIcon).props('tooltipTitle')).toBe(message);
+  it('renders ChangedFileIcon component', () => {
+    createComponent({
+      level: 4,
+      file: {},
+      hideFileStats: false,
+      showTooltip: true,
     });
 
-    it('shows "Modified" tooltip if file has been modified', () => {
-      const file = fileObject({ deleted: false, tempFile: false });
-
-      createComponent(componentProps(file));
-      expect(wrapper.find(ChangedFileIcon).props('tooltipTitle')).toBe('Modified');
-    });
+    expect(wrapper.find(ChangedFileIcon).props()).toEqual(
+      expect.objectContaining({
+        file: {},
+        size: 16,
+        showTooltip: true,
+      }),
+    );
   });
 
   describe('FileRowStats components', () => {

spec/frontend/vue_shared/components/changed_file_icon_spec.js

@@ -73,6 +73,16 @@ describe('Changed file icon', () => {
     });
   });
 
+  it('shows "Deleted" tooltip if file has been deleted', () => {
+    factory({
+      file: {
+        deleted: true,
+      },
+    });
+
+    expect(findTooltipText()).toBe('Deleted');
+  });
+
   describe('with file unchanged', () => {
     beforeEach(() => {
       factory({

spec/javascripts/ide/components/file_row_extra_spec.js

@@ -150,27 +150,6 @@ describe('IDE extra file row component', () => {
         done();
       });
     });
-
-    it('shows "Added" tooltip if file has been added', done => {
-      vm.file.changed = true;
-      vm.file.tempFile = true;
-
-      vm.$nextTick(() => {
-        expect(vm.$el.querySelector('.file-changed-icon').getAttribute('title')).toBe('Added');
-
-        done();
-      });
-    });
-
-    it('shows "Modified" tooltip if file has been modified', done => {
-      vm.file.changed = true;
-
-      vm.$nextTick(() => {
-        expect(vm.$el.querySelector('.file-changed-icon').getAttribute('title')).toBe('Modified');
-
-        done();
-      });
-    });
   });
 
   describe('merge request icon', () => {