From 7c61fb036e768dd8ed622f3022560d4f851014ff Mon Sep 17 00:00:00 2001
From: ftab <fury@xibase.com>
Date: Wed, 3 Apr 2019 12:29:22 +0000
Subject: MR image diff swipe view: Disable user-select on drag

Fixes https://gitlab.com/gitlab-org/gitlab-ce/issues/59942
---
 .../diff_viewer/viewers/image_diff/onion_skin_viewer.vue       |  2 +-
 .../components/diff_viewer/viewers/image_diff/swipe_viewer.vue | 10 +++++++---
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff/onion_skin_viewer.vue b/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff/onion_skin_viewer.vue
index f085ef35ccc..b25aebd7c98 100644
--- a/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff/onion_skin_viewer.vue
+++ b/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff/onion_skin_viewer.vue
@@ -102,7 +102,7 @@ export default {
       :style="{
         width: onionMaxPixelWidth,
         height: onionMaxPixelHeight,
-        'user-select': dragging === true ? 'none' : '',
+        'user-select': dragging ? 'none' : null,
       }"
       class="onion-skin-frame"
     >
diff --git a/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff/swipe_viewer.vue b/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff/swipe_viewer.vue
index 1c970b72a66..eddafc759a2 100644
--- a/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff/swipe_viewer.vue
+++ b/app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff/swipe_viewer.vue
@@ -68,12 +68,10 @@ export default {
     },
     startDrag() {
       this.dragging = true;
-      document.body.style.userSelect = 'none';
       document.body.addEventListener('mousemove', this.dragMove);
     },
     stopDrag() {
       this.dragging = false;
-      document.body.style.userSelect = '';
       document.body.removeEventListener('mousemove', this.dragMove);
     },
     prepareSwipe() {
@@ -104,7 +102,13 @@ export default {
 
 <template>
   <div class="swipe view">
-    <div ref="swipeFrame" class="swipe-frame">
+    <div
+      ref="swipeFrame"
+      :style="{
+        'user-select': dragging ? 'none' : null,
+      }"
+      class="swipe-frame"
+    >
       <image-viewer
         key="swipeOldImg"
         ref="swipeOldImg"
-- 
cgit v1.2.1