Use plain JS to get elements and data and values

1 files changed, 5 insertions, 5 deletions

diff --git a/app/assets/javascripts/merge_conflicts/merge_conflicts_bundle.js.es6 b/app/assets/javascripts/merge_conflicts/merge_conflicts_bundle.js.es6
index 12688365f19..7fd3749b3e2 100644
--- a/app/assets/javascripts/merge_conflicts/merge_conflicts_bundle.js.es6
+++ b/app/assets/javascripts/merge_conflicts/merge_conflicts_bundle.js.es6
@@ -10,14 +10,14 @@
 
 $(() => {
   const INTERACTIVE_RESOLVE_MODE = 'interactive';
-  const $conflicts = $(document.getElementById('conflicts'));
+  const conflictsEl = document.querySelector('#conflicts');
   const mergeConflictsStore = gl.mergeConflicts.mergeConflictsStore;
   const mergeConflictsService = new gl.mergeConflicts.mergeConflictsService({
-    conflictsPath: $conflicts.data('conflictsPath'),
-    resolveConflictsPath: $conflicts.data('resolveConflictsPath')
+    conflictsPath: conflictsEl.dataset.conflictsPath,
+    resolveConflictsPath: conflictsEl.dataset.resolveConflictsPath
   });
 
-  gl.MergeConflictsResolverApp   = new Vue({
+  gl.MergeConflictsResolverApp = new Vue({
     el: '#conflicts',
     data: mergeConflictsStore.state,
     components: {
@@ -48,7 +48,7 @@ $(() => {
           mergeConflictsStore.setLoadingState(false);
 
           this.$nextTick(() => {
-            $conflicts.find('.js-syntax-highlight').syntaxHighlight();
+            $(conflictsEl.querySelectorAll('.js-syntax-highlight')).syntaxHighlight();
           });
         });
     },