Merge branch 'bw-enable-commonmark-preview' into 'master'

Use proper markdown rendering for previews

See merge request gitlab-org/gitlab-ce!19672

app/assets/javascripts/issue_show/components/app.vue

@@ -108,6 +108,11 @@
         type: String,
         required: true,
       },
+      markdownVersion: {
+        type: Number,
+        required: false,
+        default: 0,
+      },
       projectPath: {
         type: String,
         required: true,
@@ -282,6 +287,7 @@
         :issuable-templates="issuableTemplates"
         :markdown-docs-path="markdownDocsPath"
         :markdown-preview-path="markdownPreviewPath"
+        :markdown-version="markdownVersion"
         :project-path="projectPath"
         :project-namespace="projectNamespace"
         :show-delete-button="showDeleteButton"

app/assets/javascripts/issue_show/components/fields/description.vue

@@ -20,6 +20,11 @@
         type: String,
         required: true,
       },
+      markdownVersion: {
+        type: Number,
+        required: false,
+        default: 0,
+      },
       canAttachFile: {
         type: Boolean,
         required: false,
@@ -47,6 +52,7 @@
     <markdown-field
       :markdown-preview-path="markdownPreviewPath"
       :markdown-docs-path="markdownDocsPath"
+      :markdown-version="markdownVersion"
       :can-attach-file="canAttachFile"
       :enable-autocomplete="enableAutocomplete"
     >

app/assets/javascripts/issue_show/components/form.vue

@@ -35,6 +35,11 @@
         type: String,
         required: true,
       },
+      markdownVersion: {
+        type: Number,
+        required: false,
+        default: 0,
+      },
       projectPath: {
         type: String,
         required: true,
@@ -97,6 +102,7 @@
       :form-state="formState"
       :markdown-preview-path="markdownPreviewPath"
       :markdown-docs-path="markdownDocsPath"
+      :markdown-version="markdownVersion"
       :can-attach-file="canAttachFile"
       :enable-autocomplete="enableAutocomplete"
     />

app/assets/javascripts/notes.js

@@ -1251,13 +1251,15 @@ export default class Notes {
     var postUrl = $originalContentEl.data('postUrl');
     var targetId = $originalContentEl.data('targetId');
     var targetType = $originalContentEl.data('targetType');
+    var markdownVersion = $originalContentEl.data('markdownVersion');
 
     this.glForm = new GLForm($editForm.find('form'), this.enableGFM);
 
     $editForm
       .find('form')
       .attr('action', `${postUrl}?html=true`)
-      .attr('data-remote', 'true');
+      .attr('data-remote', 'true')
+      .attr('data-markdown-version', markdownVersion);
     $editForm.find('.js-form-target-id').val(targetId);
     $editForm.find('.js-form-target-type').val(targetType);
     $editForm

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

@@ -34,6 +34,11 @@ export default {
       type: String,
       required: true,
     },
+    markdownVersion: {
+      type: Number,
+      required: false,
+      default: 0,
+    },
   },
   data() {
     return {
@@ -344,6 +349,7 @@ Please check your network connection and try again.`;
                 :markdown-preview-path="markdownPreviewPath"
                 :markdown-docs-path="markdownDocsPath"
                 :quick-actions-docs-path="quickActionsDocsPath"
+                :markdown-version="markdownVersion"
                 :add-spacing-classes="false">
                 <textarea
                   id="note-body"

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

@@ -92,6 +92,7 @@ export default {
       :is-editing="isEditing"
       :note-body="noteBody"
       :note-id="note.id"
+      :markdown-version="note.cached_markdown_version"
       @handleFormUpdate="handleFormUpdate"
       @cancelForm="formCancelHandler"
     />

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

@@ -24,6 +24,11 @@ export default {
       required: false,
       default: 0,
     },
+    markdownVersion: {
+      type: Number,
+      required: false,
+      default: 0,
+    },
     saveButtonTitle: {
       type: String,
       required: false,
@@ -156,6 +161,7 @@ export default {
       <markdown-field
         :markdown-preview-path="markdownPreviewPath"
         :markdown-docs-path="markdownDocsPath"
+        :markdown-version="markdownVersion"
         :quick-actions-docs-path="quickActionsDocsPath"
         :add-spacing-classes="false">
         <textarea

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

@@ -43,6 +43,11 @@ export default {
       required: false,
       default: true,
     },
+    markdownVersion: {
+      type: Number,
+      required: false,
+      default: 0,
+    },
   },
   data() {
     return {
@@ -192,6 +197,7 @@ export default {
 
     <comment-form
       :noteable-type="noteableType"
+      :markdown-version="markdownVersion"
     />
   </div>
 </template>

app/assets/javascripts/notes/index.js

@@ -15,6 +15,7 @@ document.addEventListener('DOMContentLoaded', () => {
       const notesDataset = document.getElementById('js-vue-notes').dataset;
       const parsedUserData = JSON.parse(notesDataset.currentUserData);
       const noteableData = JSON.parse(notesDataset.noteableData);
+      const { markdownVersion } = notesDataset;
       let currentUserData = {};
 
       noteableData.noteableType = notesDataset.noteableType;
@@ -33,6 +34,7 @@ document.addEventListener('DOMContentLoaded', () => {
       return {
         noteableData,
         currentUserData,
+        markdownVersion,
         notesData: JSON.parse(notesDataset.notesData),
       };
     },
@@ -42,6 +44,7 @@ document.addEventListener('DOMContentLoaded', () => {
           noteableData: this.noteableData,
           notesData: this.notesData,
           userData: this.currentUserData,
+          markdownVersion: this.markdownVersion,
         },
       });
     },

app/assets/javascripts/preview_markdown.js

@@ -28,12 +28,16 @@ MarkdownPreview.prototype.ajaxCache = {};
 
 MarkdownPreview.prototype.showPreview = function ($form) {
   var mdText;
+  var markdownVersion;
+  var url;
   var preview = $form.find('.js-md-preview');
-  var url = preview.data('url');
   if (preview.hasClass('md-preview-loading')) {
     return;
   }
+
   mdText = $form.find('textarea.markdown-area').val();
+  markdownVersion = $form.attr('data-markdown-version');
+  url = this.versionedPreviewPath(preview.data('url'), markdownVersion);
 
   if (mdText.trim().length === 0) {
     preview.text(this.emptyMessage);
@@ -59,6 +63,14 @@ MarkdownPreview.prototype.showPreview = function ($form) {
   }
 };
 
+MarkdownPreview.prototype.versionedPreviewPath = function (markdownPreviewPath, markdownVersion) {
+  if (typeof markdownVersion === 'undefined') {
+    return markdownPreviewPath;
+  }
+
+  return `${markdownPreviewPath}${markdownPreviewPath.indexOf('?') === -1 ? '?' : '&'}markdown_version=${markdownVersion}`;
+};
+
 MarkdownPreview.prototype.fetchMarkdownPreview = function (text, url, success) {
   if (!url) {
     return;

app/assets/javascripts/vue_shared/components/markdown/field.vue

 <script>
   import $ from 'jquery';
+  import { s__ } from '~/locale';
   import Flash from '../../../flash';
   import GLForm from '../../../gl_form';
   import markdownHeader from './header.vue';
@@ -22,6 +23,11 @@
         type: String,
         required: true,
       },
+      markdownVersion: {
+        type: Number,
+        required: false,
+        default: 0,
+      },
       addSpacingClasses: {
         type: Boolean,
         required: false,
@@ -92,10 +98,11 @@
 
         if (text) {
           this.markdownPreviewLoading = true;
-          this.$http.post(this.markdownPreviewPath, { text })
+          this.$http
+            .post(this.versionedPreviewPath(), { text })
               .then(resp => resp.json())
               .then(data => this.renderMarkdown(data))
-            .catch(() => new Flash('Error loading markdown preview'));
+              .catch(() => new Flash(s__('Error loading markdown preview')));
         } else {
           this.renderMarkdown();
         }
@@ -119,6 +126,13 @@
           $(this.$refs['markdown-preview']).renderGFM();
         });
       },
+
+      versionedPreviewPath() {
+        const { markdownPreviewPath, markdownVersion } = this;
+        return `${markdownPreviewPath}${
+          markdownPreviewPath.indexOf('?') === -1 ? '?' : '&'
+          }markdown_version=${markdownVersion}`;
+      },
     },
   };
 </script>

app/controllers/concerns/preview_markdown.rb

@@ -14,6 +14,8 @@ module PreviewMarkdown
       else {}
       end
 
+    markdown_params[:markdown_engine] = result[:markdown_engine]
+
     render json: {
       body: view_context.markdown(result[:text], markdown_params),
       references: {

app/helpers/issuables_helper.rb

@@ -249,6 +249,7 @@ module IssuablesHelper
       issuableRef: issuable.to_reference,
       markdownPreviewPath: preview_markdown_path(parent),
       markdownDocsPath: help_page_path('user/markdown'),
+      markdownVersion: issuable.cached_markdown_version,
       issuableTemplates: issuable_templates(issuable),
       initialTitleHtml: markdown_field(issuable, :title),
       initialTitleText: issuable.title,

app/helpers/markup_helper.rb

@@ -107,6 +107,7 @@ module MarkupHelper
 
   def markup(file_name, text, context = {})
     context[:project] ||= @project
+    context[:markdown_engine] ||= :redcarpet
     html = context.delete(:rendered) || markup_unsafe(file_name, text, context)
     prepare_for_rendering(html, context)
   end
@@ -120,7 +121,8 @@ module MarkupHelper
       project: @project,
       project_wiki: @project_wiki,
       page_slug: wiki_page.slug,
-      issuable_state_filter_enabled: true
+      issuable_state_filter_enabled: true,
+      markdown_engine: :redcarpet
     }
 
     html =

app/helpers/notes_helper.rb

@@ -169,6 +169,7 @@ module NotesHelper
       registerPath: new_session_path(:user, redirect_to_referer: 'yes', anchor: 'register-pane'),
       newSessionPath: new_session_path(:user, redirect_to_referer: 'yes'),
       markdownDocsPath: help_page_path('user/markdown'),
+      markdownVersion: issuable.cached_markdown_version,
       quickActionsDocsPath: help_page_path('user/project/quick_actions'),
       closePath: close_issuable_path(issuable),
       reopenPath: reopen_issuable_path(issuable),

app/models/concerns/cache_markdown_field.rb

@@ -40,6 +40,18 @@ module CacheMarkdownField
     end
   end
 
+  class MarkdownEngine
+    def self.from_version(version = nil)
+      return :common_mark if version.nil? || version == 0
+
+      if version < CacheMarkdownField::CACHE_COMMONMARK_VERSION_START
+        :redcarpet
+      else
+        :common_mark
+      end
+    end
+  end
+
   def skip_project_check?
     false
   end
@@ -57,7 +69,7 @@ module CacheMarkdownField
     # Banzai is less strict about authors, so don't always have an author key
     context[:author] = self.author if self.respond_to?(:author)
 
-    context[:markdown_engine] = markdown_engine
+    context[:markdown_engine] = MarkdownEngine.from_version(latest_cached_markdown_version)
 
     context
   end
@@ -123,14 +135,6 @@ module CacheMarkdownField
     end
   end
 
-  def markdown_engine
-    if latest_cached_markdown_version < CacheMarkdownField::CACHE_COMMONMARK_VERSION_START
-      :redcarpet
-    else
-      :common_mark
-    end
-  end
-
   included do
     cattr_reader :cached_markdown_fields do
       FieldData.new

app/models/repository.rb

@@ -564,7 +564,7 @@ class Repository
   end
 
   def rendered_readme
-    MarkupHelper.markup_unsafe(readme.name, readme.data, project: project) if readme
+    MarkupHelper.markup_unsafe(readme.name, readme.data, project: project, markdown_engine: :redcarpet) if readme
   end
   cache_method :rendered_readme
 

app/serializers/note_entity.rb

@@ -62,6 +62,8 @@ class NoteEntity < API::Entities::Note
 
   expose :attachment, using: NoteAttachmentEntity, if: -> (note, _) { note.attachment? }
 
+  expose :cached_markdown_version
+
   private
 
   def current_user

app/services/preview_markdown_service.rb

@@ -6,7 +6,8 @@ class PreviewMarkdownService < BaseService
     success(
       text: text,
       users: users,
-      commands: commands.join(' ')
+      commands: commands.join(' '),
+      markdown_engine: markdown_engine
     )
   end
 
@@ -42,4 +43,8 @@ class PreviewMarkdownService < BaseService
   def commands_target_id
     params[:quick_actions_target_id]
   end
+
+  def markdown_engine
+    CacheMarkdownField::MarkdownEngine.from_version(params[:markdown_version].to_i)
+  end
 end

app/views/projects/issues/_form.html.haml

-= form_for [@project.namespace.becomes(Namespace), @project, @issue], html: { class: 'issue-form common-note-form js-quick-submit js-requires-input' } do |f|
+= form_for [@project.namespace.becomes(Namespace), @project, @issue],
+           html: { class: 'issue-form common-note-form js-quick-submit js-requires-input' },
+           data: { markdown_version: @issue.cached_markdown_version } do |f|
   = render 'shared/issuable/form', f: f, issuable: @issue

app/views/projects/merge_requests/_form.html.haml

-= form_for [@project.namespace.becomes(Namespace), @project, @merge_request], html: { class: 'merge-request-form common-note-form js-requires-input js-quick-submit' } do |f|
+= form_for [@project.namespace.becomes(Namespace), @project, @merge_request],
+           html: { class: 'merge-request-form common-note-form js-requires-input js-quick-submit' },
+           data: { markdown_version: @merge_request.cached_markdown_version } do |f|
   = render 'shared/issuable/form', f: f, issuable: @merge_request

app/views/projects/milestones/_form.html.haml

-= form_for [@project.namespace.becomes(Namespace), @project, @milestone], html: {class: 'milestone-form common-note-form js-quick-submit js-requires-input'}  do |f|
+= form_for [@project.namespace.becomes(Namespace), @project, @milestone],
+           html: {class: 'milestone-form common-note-form js-quick-submit js-requires-input'},
+           data: { markdown_version: @milestone.cached_markdown_version }  do |f|
   = form_errors(@milestone)
   .row
     .col-md-6

app/views/projects/releases/edit.html.haml

@@ -11,7 +11,9 @@
         %strong= @tag.name
 
 
-  = form_for(@release, method: :put, url: project_tag_release_path(@project, @tag.name), html: { class: 'common-note-form release-form js-quick-submit' }) do |f|
+  = form_for(@release, method: :put, url: project_tag_release_path(@project, @tag.name),
+             html: { class: 'common-note-form release-form js-quick-submit' },
+             data: { markdown_version: @release.cached_markdown_version }) do |f|
     = render layout: 'projects/md_preview', locals: { url: preview_markdown_path(@project), referenced_users: true } do
       = render 'projects/zen', f: f, attr: :description, classes: 'note-textarea', placeholder: "Write your release notes or drag files here…"
       = render 'shared/notes/hints'

app/views/projects/wikis/_form.html.haml

 - commit_message = @page.persisted? ? s_("WikiPageEdit|Update %{page_title}") : s_("WikiPageCreate|Create %{page_title}")
 - commit_message = commit_message % { page_title: @page.title }
 
-= form_for [@project.namespace.becomes(Namespace), @project, @page], method: @page.persisted? ? :put : :post, html: { class: 'wiki-form common-note-form prepend-top-default js-quick-submit' } do |f|
+= form_for [@project.namespace.becomes(Namespace), @project, @page], method: @page.persisted? ? :put : :post,
+           html: { class: 'wiki-form common-note-form prepend-top-default js-quick-submit' },
+           data: { markdown_version: CacheMarkdownField::CACHE_REDCARPET_VERSION } do |f|
   = form_errors(@page)
 
   - if @page.persisted?

app/views/shared/notes/_note.html.haml

@@ -52,7 +52,7 @@
         .note-text.md
           = markdown_field(note, :note)
         = edited_time_ago_with_tooltip(note, placement: 'bottom', html_class: 'note_edited_ago')
-        .original-note-content.hidden{ data: { post_url: note_url(note), target_id: note.noteable.id, target_type: note.noteable.class.name.underscore } }
+        .original-note-content.hidden{ data: { post_url: note_url(note), target_id: note.noteable.id, target_type: note.noteable.class.name.underscore, markdown_version: note.cached_markdown_version } }
           #{note.note}
         - if note_editable
           = render 'shared/notes/edit', note: note

app/views/shared/snippets/_form.html.haml

@@ -2,7 +2,9 @@
   = page_specific_javascript_tag('lib/ace.js')
 
 .snippet-form-holder
-  = form_for @snippet, url: url, html: { class: "snippet-form js-requires-input js-quick-submit common-note-form" } do |f|
+  = form_for @snippet, url: url,
+             html: { class: "snippet-form js-requires-input js-quick-submit common-note-form" },
+             data: { markdown_version: @snippet.cached_markdown_version } do |f|
     = form_errors(@snippet)
 
     .form-group.row

spec/features/projects/wiki/markdown_preview_spec.rb

@@ -9,6 +9,7 @@ describe 'Projects > Wiki > User previews markdown changes', :js do
 [relative link 1](../relative)
 [relative link 2](./relative)
 [relative link 3](./e/f/relative)
+[spaced link](title with spaces)
     HEREDOC
   end
 
@@ -42,6 +43,7 @@ describe 'Projects > Wiki > User previews markdown changes', :js do
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a/b/relative\">relative link 1</a>")
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a/b/c/relative\">relative link 2</a>")
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a/b/c/e/f/relative\">relative link 3</a>")
+        expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/title%20with%20spaces\">spaced link</a>")
       end
     end
 
@@ -64,6 +66,7 @@ describe 'Projects > Wiki > User previews markdown changes', :js do
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a-page/b-page/relative\">relative link 1</a>")
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a-page/b-page/c-page/relative\">relative link 2</a>")
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a-page/b-page/c-page/e/f/relative\">relative link 3</a>")
+        expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/title%20with%20spaces\">spaced link</a>")
       end
     end
 
@@ -86,6 +89,7 @@ describe 'Projects > Wiki > User previews markdown changes', :js do
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a-page/b-page/relative\">relative link 1</a>")
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a-page/b-page/c-page/relative\">relative link 2</a>")
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a-page/b-page/c-page/e/f/relative\">relative link 3</a>")
+        expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/title%20with%20spaces\">spaced link</a>")
       end
     end
   end
@@ -119,6 +123,7 @@ describe 'Projects > Wiki > User previews markdown changes', :js do
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a/b/relative\">relative link 1</a>")
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a/b/c/relative\">relative link 2</a>")
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a/b/c/e/f/relative\">relative link 3</a>")
+        expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/title%20with%20spaces\">spaced link</a>")
       end
     end
 
@@ -136,6 +141,7 @@ describe 'Projects > Wiki > User previews markdown changes', :js do
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a-page/b-page/relative\">relative link 1</a>")
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a-page/b-page/c-page/relative\">relative link 2</a>")
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a-page/b-page/c-page/e/f/relative\">relative link 3</a>")
+        expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/title%20with%20spaces\">spaced link</a>")
       end
     end
 
@@ -153,6 +159,7 @@ describe 'Projects > Wiki > User previews markdown changes', :js do
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a-page/b-page/relative\">relative link 1</a>")
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a-page/b-page/c-page/relative\">relative link 2</a>")
         expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/a-page/b-page/c-page/e/f/relative\">relative link 3</a>")
+        expect(page.html).to include("<a href=\"/#{project.full_path}/wikis/title%20with%20spaces\">spaced link</a>")
       end
     end
   end

spec/features/snippets/show_spec.rb

@@ -68,6 +68,26 @@ describe 'Snippet', :js do
         end
       end
 
+      context 'with cached Redcarpet html' do
+        let(:snippet) { create(:personal_snippet, :public, file_name: file_name, content: content, cached_markdown_version: CacheMarkdownField::CACHE_REDCARPET_VERSION) }
+        let(:file_name) { 'test.md' }
+        let(:content) { "1. one\n  - sublist\n" }
+
+        it 'renders correctly' do
+          expect(page).to have_xpath("//ol//li//ul")
+        end
+      end
+
+      context 'with cached CommonMark html' do
+        let(:snippet) { create(:personal_snippet, :public, file_name: file_name, content: content, cached_markdown_version: CacheMarkdownField::CACHE_COMMONMARK_VERSION) }
+        let(:file_name) { 'test.md' }
+        let(:content) { "1. one\n  - sublist\n" }
+
+        it 'renders correctly' do
+          expect(page).not_to have_xpath("//ol//li//ul")
+        end
+      end
+
       context 'switching to the simple viewer' do
         before do
           find('.js-blob-viewer-switch-btn[data-viewer=simple]').click

spec/helpers/issuables_helper_spec.rb

@@ -184,6 +184,7 @@ describe IssuablesHelper do
         issuableRef: "##{issue.iid}",
         markdownPreviewPath: "/#{@project.full_path}/preview_markdown",
         markdownDocsPath: '/help/user/markdown',
+        markdownVersion: 11,
         issuableTemplates: [],
         projectPath: @project.path,
         projectNamespace: @project.namespace.path,

spec/helpers/markup_helper_spec.rb

@@ -205,7 +205,9 @@ describe MarkupHelper do
     it "uses Wiki pipeline for markdown files" do
       allow(@wiki).to receive(:format).and_return(:markdown)
 
-      expect(helper).to receive(:markdown_unsafe).with('wiki content', pipeline: :wiki, project: project, project_wiki: @wiki, page_slug: "nested/page", issuable_state_filter_enabled: true)
+      expect(helper).to receive(:markdown_unsafe).with('wiki content',
+        pipeline: :wiki, project: project, project_wiki: @wiki, page_slug: "nested/page",
+        issuable_state_filter_enabled: true, markdown_engine: :redcarpet)
 
       helper.render_wiki_content(@wiki)
     end
@@ -236,19 +238,32 @@ describe MarkupHelper do
       expect(helper.markup('foo.rst', content).encoding.name).to eq('UTF-8')
     end
 
-    it "delegates to #markdown_unsafe when file name corresponds to Markdown" do
+    it 'delegates to #markdown_unsafe when file name corresponds to Markdown' do
       expect(helper).to receive(:gitlab_markdown?).with('foo.md').and_return(true)
       expect(helper).to receive(:markdown_unsafe).and_return('NOEL')
 
       expect(helper.markup('foo.md', content)).to eq('NOEL')
     end
 
-    it "delegates to #asciidoc_unsafe when file name corresponds to AsciiDoc" do
+    it 'delegates to #asciidoc_unsafe when file name corresponds to AsciiDoc' do
       expect(helper).to receive(:asciidoc?).with('foo.adoc').and_return(true)
       expect(helper).to receive(:asciidoc_unsafe).and_return('NOEL')
 
       expect(helper.markup('foo.adoc', content)).to eq('NOEL')
     end
+
+    it 'uses passed in rendered content' do
+      expect(helper).not_to receive(:gitlab_markdown?)
+      expect(helper).not_to receive(:markdown_unsafe)
+
+      expect(helper.markup('foo.md', content, rendered: '<p>NOEL</p>')).to eq('<p>NOEL</p>')
+    end
+
+    it 'defaults to Redcarpet' do
+      expect(helper).to receive(:markdown_unsafe).with(content, hash_including(markdown_engine: :redcarpet)).and_return('NOEL')
+
+      expect(helper.markup('foo.md', content)).to eq('NOEL')
+    end
   end
 
   describe '#first_line_in_markdown' do

spec/javascripts/notes/mock_data.js

@@ -165,6 +165,7 @@ export const note = {
   report_abuse_path:
     '/abuse_reports/new?ref_url=http%3A%2F%2Flocalhost%3A3000%2Fgitlab-org%2Fgitlab-ce%2Fissues%2F7%23note_546&user_id=1',
   path: '/gitlab-org/gitlab-ce/notes/546',
+  cached_markdown_version: 11,
 };
 
 export const discussionMock = {

spec/lib/banzai/filter/markdown_filter_spec.rb

@@ -3,7 +3,32 @@ require 'spec_helper'
 describe Banzai::Filter::MarkdownFilter do
   include FilterSpecHelper
 
-  context 'code block' do
+  describe 'markdown engine from context' do
+    it 'defaults to CommonMark' do
+      expect_any_instance_of(Banzai::Filter::MarkdownEngines::CommonMark).to receive(:render).and_return('test')
+
+      filter('test')
+    end
+
+    it 'uses Redcarpet' do
+      expect_any_instance_of(Banzai::Filter::MarkdownEngines::Redcarpet).to receive(:render).and_return('test')
+
+      filter('test', { markdown_engine: :redcarpet })
+    end
+
+    it 'uses CommonMark' do
+      expect_any_instance_of(Banzai::Filter::MarkdownEngines::CommonMark).to receive(:render).and_return('test')
+
+      filter('test', { markdown_engine: :common_mark })
+    end
+  end
+
+  describe 'code block' do
+    context 'using CommonMark' do
+      before do
+        stub_const('Banzai::Filter::MarkdownFilter::DEFAULT_ENGINE', :common_mark)
+      end
+
       it 'adds language to lang attribute when specified' do
         result = filter("```html\nsome code\n```")
 
@@ -16,4 +41,23 @@ describe Banzai::Filter::MarkdownFilter do
         expect(result).to start_with("<pre><code>")
       end
     end
+
+    context 'using Redcarpet' do
+      before do
+        stub_const('Banzai::Filter::MarkdownFilter::DEFAULT_ENGINE', :redcarpet)
+      end
+
+      it 'adds language to lang attribute when specified' do
+        result = filter("```html\nsome code\n```")
+
+        expect(result).to start_with("\n<pre><code lang=\"html\">")
+      end
+
+      it 'does not add language to lang attribute when not specified' do
+        result = filter("```\nsome code\n```")
+
+        expect(result).to start_with("\n<pre><code>")
+      end
+    end
+  end
 end

spec/models/concerns/cache_markdown_field_spec.rb

@@ -370,4 +370,20 @@ describe CacheMarkdownField do
       end
     end
   end
+
+  describe CacheMarkdownField::MarkdownEngine do
+    subject { lambda { |version| CacheMarkdownField::MarkdownEngine.from_version(version) } }
+
+    it 'returns :common_mark as a default' do
+      expect(subject.call(nil)).to eq :common_mark
+    end
+
+    it 'returns :common_mark' do
+      expect(subject.call(CacheMarkdownField::CACHE_COMMONMARK_VERSION)).to eq :common_mark
+    end
+
+    it 'returns :redcarpet' do
+      expect(subject.call(CacheMarkdownField::CACHE_REDCARPET_VERSION)).to eq :redcarpet
+    end
+  end
 end

spec/services/preview_markdown_service_spec.rb

@@ -64,4 +64,16 @@ describe PreviewMarkdownService do
       expect(result[:commands]).to eq 'Sets time estimate to 2y.'
     end
   end
+
+  it 'sets correct markdown engine' do
+    service = described_class.new(project, user, { markdown_version: CacheMarkdownField::CACHE_REDCARPET_VERSION })
+    result  = service.execute
+
+    expect(result[:markdown_engine]).to eq :redcarpet
+
+    service = described_class.new(project, user, { markdown_version: CacheMarkdownField::CACHE_COMMONMARK_VERSION })
+    result  = service.execute
+
+    expect(result[:markdown_engine]).to eq :common_mark
+  end
 end