Fixed image commenting on moved files

2 files changed, 25 insertions, 2 deletions

diff --git a/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff_viewer.vue b/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff_viewer.vue
index e68a2aa73fa..d7f24c1afc5 100644
--- a/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff_viewer.vue
+++ b/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff_viewer.vue
@@ -44,8 +44,11 @@ export default {
     isNew() {
       return this.diffMode === diffModes.new;
     },
+    isRenamed() {
+      return this.diffMode === diffModes.renamed;
+    },
     imagePath() {
-      return this.isNew ? this.newPath : this.oldPath;
+      return this.isNew || this.isRenamed ? this.newPath : this.oldPath;
     },
   },
   methods: {
@@ -114,7 +117,7 @@ export default {
           }]"
         >
           <slot
-            v-if="isNew"
+            v-if="isNew || isRenamed"
             slot="image-overlay"
             name="image-overlay"
           >
diff --git a/spec/javascripts/vue_shared/components/diff_viewer/viewers/image_diff_viewer_spec.js b/spec/javascripts/vue_shared/components/diff_viewer/viewers/image_diff_viewer_spec.js
index 2d3e178d249..7f2e246d656 100644
--- a/spec/javascripts/vue_shared/components/diff_viewer/viewers/image_diff_viewer_spec.js
+++ b/spec/javascripts/vue_shared/components/diff_viewer/viewers/image_diff_viewer_spec.js
@@ -97,6 +97,26 @@ describe('ImageDiffViewer', () => {
     });
   });
 
+  it('renders image diff for renamed', done => {
+    vm = new Vue({
+      components: {
+        imageDiffViewer,
+      },
+      template: `
+        <image-diff-viewer diff-mode="renamed" new-path="${GREEN_BOX_IMAGE_URL}" old-path="">
+          <span slot="image-overlay" class="overlay">test</span>
+        </image-diff-viewer>
+      `,
+    }).$mount();
+
+    setTimeout(() => {
+      expect(vm.$el.querySelector('img').getAttribute('src')).toBe(GREEN_BOX_IMAGE_URL);
+      expect(vm.$el.querySelector('.overlay')).not.toBe(null);
+
+      done();
+    });
+  });
+
   describe('swipeMode', () => {
     beforeEach(done => {
       createComponent({