From d40f393d2c99e4a36d097471acf9379f12c34f19 Mon Sep 17 00:00:00 2001
From: Annabel Dunstone Gray <annabel.dunstone@gmail.com>
Date: Wed, 20 Dec 2017 12:29:44 -0700
Subject: Add spec for previewing a note

---
 .../javascripts/vue_shared/components/markdown/header.vue |  3 ++-
 app/assets/stylesheets/framework/markdown_area.scss       |  1 -
 spec/features/merge_requests/user_posts_notes_spec.rb     | 15 +++++++++++++++
 3 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/app/assets/javascripts/vue_shared/components/markdown/header.vue b/app/assets/javascripts/vue_shared/components/markdown/header.vue
index 55aaab77b7a..36d2d1dc164 100644
--- a/app/assets/javascripts/vue_shared/components/markdown/header.vue
+++ b/app/assets/javascripts/vue_shared/components/markdown/header.vue
@@ -72,7 +72,8 @@
           Preview
         </a>
       </li>
-      <li class="md-header-toolbar"
+      <li
+        class="md-header-toolbar"
         :class="{ active: !previewMarkdown }">
         <toolbar-button
           tag="**"
diff --git a/app/assets/stylesheets/framework/markdown_area.scss b/app/assets/stylesheets/framework/markdown_area.scss
index 7e803dfa8eb..6b07ffdbd61 100644
--- a/app/assets/stylesheets/framework/markdown_area.scss
+++ b/app/assets/stylesheets/framework/markdown_area.scss
@@ -102,7 +102,6 @@
   }
 }
 
-
 .referenced-users {
   color: $gl-text-color;
   padding-top: 10px;
diff --git a/spec/features/merge_requests/user_posts_notes_spec.rb b/spec/features/merge_requests/user_posts_notes_spec.rb
index f4c75a2f265..e17e9c2ccf5 100644
--- a/spec/features/merge_requests/user_posts_notes_spec.rb
+++ b/spec/features/merge_requests/user_posts_notes_spec.rb
@@ -66,6 +66,21 @@ describe 'Merge requests > User posts notes', :js do
     end
   end
 
+  describe 'when previewing a note' do
+    it 'shows the toolbar buttons when editing a note' do
+      page.within('.js-main-target-form') do
+        expect(page).to have_css('.md-header-toolbar.active')
+      end
+    end
+
+    it 'hides the toolbar buttons when previewing a note' do
+      find('.js-md-preview-button').click
+      page.within('.js-main-target-form') do
+        expect(page).not_to have_css('.md-header-toolbar.active')
+      end
+    end
+  end
+
   describe 'when editing a note' do
     it 'there should be a hidden edit form' do
       is_expected.to have_css('.note-edit-form:not(.mr-note-edit-form)', visible: false, count: 1)
-- 
cgit v1.2.1