1 files changed, 14 insertions, 12 deletions

diff --git a/app/assets/javascripts/vue_shared/components/markdown/header.vue b/app/assets/javascripts/vue_shared/components/markdown/header.vue
index d91fe3cf0c5..83171ae50b8 100644
--- a/app/assets/javascripts/vue_shared/components/markdown/header.vue
+++ b/app/assets/javascripts/vue_shared/components/markdown/header.vue
@@ -27,20 +27,22 @@
       $(document).off('markdown-preview:hide.vue', this.writeMarkdownTab);
     },
     methods: {
-      isMarkdownForm(form) {
-        return form && !form.find('.js-vue-markdown-field').length;
+      isValid(form) {
+        return !form ||
+          form.find('.js-vue-markdown-field').length ||
+          $(this.$el).closest('form') === form[0];
       },
 
       previewMarkdownTab(event, form) {
         if (event.target.blur) event.target.blur();
-        if (this.isMarkdownForm(form)) return;
+        if (!this.isValid(form)) return;
 
         this.$emit('preview-markdown');
       },
 
       writeMarkdownTab(event, form) {
         if (event.target.blur) event.target.blur();
-        if (this.isMarkdownForm(form)) return;
+        if (!this.isValid(form)) return;
 
         this.$emit('write-markdown');
       },
@@ -52,8 +54,8 @@
   <div class="md-header">
     <ul class="nav-links clearfix">
       <li
-        class="md-header-tab"
         :class="{ active: !previewMarkdown }"
+        class="md-header-tab"
       >
         <a
           class="js-write-link"
@@ -65,11 +67,11 @@
         </a>
       </li>
       <li
-        class="md-header-tab"
         :class="{ active: previewMarkdown }"
+        class="md-header-tab"
       >
         <a
-          class="js-preview-link"
+          class="js-preview-link js-md-preview-button"
           href="#md-preview-holder"
           tabindex="-1"
           @click.prevent="previewMarkdownTab($event)"
@@ -78,8 +80,8 @@
         </a>
       </li>
       <li
-        class="md-header-toolbar"
         :class="{ active: !previewMarkdown }"
+        class="md-header-toolbar"
       >
         <toolbar-button
           tag="**"
@@ -92,8 +94,8 @@
           icon="italic"
         />
         <toolbar-button
-          tag="> "
           :prepend="true"
+          tag="> "
           button-title="Insert a quote"
           icon="quote"
         />
@@ -104,20 +106,20 @@
           icon="code"
         />
         <toolbar-button
-          tag="* "
           :prepend="true"
+          tag="* "
           button-title="Add a bullet list"
           icon="list-bulleted"
         />
         <toolbar-button
-          tag="1. "
           :prepend="true"
+          tag="1. "
           button-title="Add a numbered list"
           icon="list-numbered"
         />
         <toolbar-button
-          tag="* [ ] "
           :prepend="true"
+          tag="* [ ] "
           button-title="Add a task list"
           icon="task-done"
         />