Add .code to all tables holding diffs

We need this to be able to distinguish between Markdown tables and diff
tables.

app/assets/javascripts/behaviors/markdown/copy_as_gfm.js

@@ -13,7 +13,7 @@ export class CopyAsGFM {
     $(document).on('copy', '.md', e => {
       CopyAsGFM.copyAsGFM(e, CopyAsGFM.transformGFMSelection);
     });
-    $(document).on('copy', 'pre.code.highlight, .diff-content .line_content', e => {
+    $(document).on('copy', 'pre.code.highlight, table.code td.line_content', e => {
       CopyAsGFM.copyAsGFM(e, CopyAsGFM.transformCodeSelection);
     });
     $(document).on('paste', '.js-gfm-input', CopyAsGFM.pasteGFM);

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

@@ -38,12 +38,11 @@ export default {
 </script>
 
 <template>
-  <div
+  <table
     :class="$options.userColorScheme"
     :data-commit-id="commitId"
     class="code diff-wrap-lines js-syntax-highlight text-file"
   >
-    <table>
     <tbody>
       <template v-for="(line, index) in diffLines">
         <parallel-diff-table-row
@@ -69,5 +68,4 @@ export default {
       </template>
     </tbody>
   </table>
-  </div>
 </template>

app/assets/javascripts/merge_conflicts/components/parallel_conflict_lines.js

@@ -16,7 +16,7 @@ import utilsMixin from '../mixins/line_conflict_utils';
       },
     },
     template: `
-      <table>
+      <table class="diff-wrap-lines code js-syntax-highlight">
         <tr class="line_holder parallel" v-for="section in file.parallelLines">
           <template v-for="line in section">
             <td class="diff-line-num header" :class="lineCssClass(line)" v-if="line.isHeader"></td>

app/assets/javascripts/notes/components/diff_with_note.vue

@@ -72,8 +72,8 @@ export default {
       :can-current-user-fork="false"
       :expanded="!discussion.diff_file.viewer.collapsed"
     />
-    <div v-if="isTextFile" :class="$options.userColorSchemeClass" class="diff-content code">
-      <table>
+    <div v-if="isTextFile" class="diff-content">
+      <table class="code js-syntax-highlight" :class="$options.userColorSchemeClass">
         <template v-if="hasTruncatedDiffLines">
           <tr
             v-for="line in discussion.truncated_diff_lines"

app/views/discussions/_diff_with_notes.html.haml

@@ -11,8 +11,8 @@
       = render "projects/diffs/file_header", diff_file: diff_file, url: discussion_path(discussion), show_toggle: false
 
   - if diff_file.text?
-    .diff-content.code.js-syntax-highlight
-      %table
+    .diff-content
+      %table.code.js-syntax-highlight
         - if expanded
           - discussions = { discussion.original_line_code => [discussion] }
           = render partial: "projects/diffs/line",

app/views/projects/blob/preview.html.haml

-.diff-file.file-holder
-  .diff-content
-    - if markup?(@blob.name)
+- if markup?(@blob.name)
   .file-content.md.md-file{ class: ('use-csslab' if Feature.enabled?(:csslab)) }
     = markup(@blob.name, @content)
-    - else
-      .file-content.code.js-syntax-highlight
+- else
+  .diff-file
+    .diff-content
       - unless @diff_lines.empty?
-          %table.text-file
+        %table.text-file.code.js-syntax-highlight
           - @diff_lines.each do |line|
             %tr.line_holder{ class: "#{line.type}" }
               - if line.type == "match"

app/views/projects/diffs/_parallel_view.html.haml

 / Side-by-side diff view
 
-.text-file.diff-wrap-lines.code.js-syntax-highlight{ data: diff_view_data }
-  %table
+.text-file{ data: diff_view_data }
+  %table.diff-wrap-lines.code.js-syntax-highlight
     - diff_file.parallel_diff_lines.each do |line|
       - left = line[:left]
       - right = line[:right]

app/views/projects/merge_requests/conflicts/components/_inline_conflict_lines.html.haml

 %inline-conflict-lines{ "inline-template" => "true", ":file" => "file" }
-  %table
+  %table.diff-wrap-lines.code.js-syntax-highlight
     %tr.line_holder.diff-inline{ "v-for" => "line in file.inlineLines" }
       %td.diff-line-num.new_line{ ":class" => "lineCssClass(line)", "v-if" => "!line.isHeader" }
         %a {{line.new_line}}

app/views/projects/merge_requests/conflicts/show.html.haml

@@ -26,9 +26,9 @@
           %strong {{file.filePath}}
           = render partial: 'projects/merge_requests/conflicts/file_actions'
         .diff-content.diff-wrap-lines
-          .diff-wrap-lines.code.file-content.js-syntax-highlight{ "v-show" => "!isParallel && file.resolveMode === 'interactive' && file.type === 'text'" }
+          .file-content{ "v-show" => "!isParallel && file.resolveMode === 'interactive' && file.type === 'text'" }
             = render partial: "projects/merge_requests/conflicts/components/inline_conflict_lines"
-          .diff-wrap-lines.code.file-content.js-syntax-highlight{ "v-show" => "isParallel && file.resolveMode === 'interactive' && file.type === 'text'" }
+          .file-content{ "v-show" => "isParallel && file.resolveMode === 'interactive' && file.type === 'text'" }
             %parallel-conflict-lines{ ":file" => "file" }
           %div{ "v-show" => "file.resolveMode === 'edit' ||  file.type === 'text-editor'" }
             = render partial: "projects/merge_requests/conflicts/components/diff_file_editor"