Resolve "Clicking confidential and lock icons on sidebar should also activate dropdown"

4 files changed, 81 insertions, 1 deletions

diff --git a/spec/features/issuables/discussion_lock_spec.rb b/spec/features/issuables/discussion_lock_spec.rb
index ecbe51a7bc2..7ea29ff252b 100644
--- a/spec/features/issuables/discussion_lock_spec.rb
+++ b/spec/features/issuables/discussion_lock_spec.rb
@@ -14,7 +14,7 @@ describe 'Discussion Lock', :js do
       project.add_developer(user)
     end
 
-    context 'when the discussion is   unlocked' do
+    context 'when the discussion is unlocked' do
       it 'the user can lock the issue' do
         visit project_issue_path(project, issue)
 
diff --git a/spec/features/issues/issue_sidebar_spec.rb b/spec/features/issues/issue_sidebar_spec.rb
index b835558b142..27551bb70ee 100644
--- a/spec/features/issues/issue_sidebar_spec.rb
+++ b/spec/features/issues/issue_sidebar_spec.rb
@@ -161,6 +161,50 @@ feature 'Issue Sidebar' do
         end
       end
     end
+
+    context 'interacting with collapsed sidebar', :js do
+      collapsed_sidebar_selector = 'aside.right-sidebar.right-sidebar-collapsed'
+      expanded_sidebar_selector = 'aside.right-sidebar.right-sidebar-expanded'
+      confidentiality_sidebar_block = '.block.confidentiality'
+      lock_sidebar_block = '.block.lock'
+      collapsed_sidebar_block_icon = '.sidebar-collapsed-icon'
+
+      before do
+        resize_screen_sm
+      end
+
+      it 'confidentiality block expands then collapses sidebar' do
+        expect(page).to have_css(collapsed_sidebar_selector)
+
+        page.within(confidentiality_sidebar_block) do
+          find(collapsed_sidebar_block_icon).click
+        end
+
+        expect(page).to have_css(expanded_sidebar_selector)
+
+        page.within(confidentiality_sidebar_block) do
+          page.find('button', text: 'Cancel').click
+        end
+
+        expect(page).to have_css(collapsed_sidebar_selector)
+      end
+
+      it 'lock block expands then collapses sidebar' do
+        expect(page).to have_css(collapsed_sidebar_selector)
+
+        page.within(lock_sidebar_block) do
+          find(collapsed_sidebar_block_icon).click
+        end
+
+        expect(page).to have_css(expanded_sidebar_selector)
+
+        page.within(lock_sidebar_block) do
+          page.find('button', text: 'Cancel').click
+        end
+
+        expect(page).to have_css(collapsed_sidebar_selector)
+      end
+    end
   end
 
   context 'as a guest' do
diff --git a/spec/javascripts/sidebar/confidential_issue_sidebar_spec.js b/spec/javascripts/sidebar/confidential_issue_sidebar_spec.js
index 88a33caf2e3..0c173062835 100644
--- a/spec/javascripts/sidebar/confidential_issue_sidebar_spec.js
+++ b/spec/javascripts/sidebar/confidential_issue_sidebar_spec.js
@@ -62,4 +62,22 @@ describe('Confidential Issue Sidebar Block', () => {
       done();
     });
   });
+
+  it('displays the edit form when opened from collapsed state', (done) => {
+    expect(vm1.edit).toBe(false);
+
+    vm1.$el.querySelector('.sidebar-collapsed-icon').click();
+
+    expect(vm1.edit).toBe(true);
+
+    setTimeout(() => {
+      expect(
+        vm1.$el
+          .innerHTML
+          .includes('You are going to turn off the confidentiality.'),
+      ).toBe(true);
+
+      done();
+    });
+  });
 });
diff --git a/spec/javascripts/sidebar/lock/lock_issue_sidebar_spec.js b/spec/javascripts/sidebar/lock/lock_issue_sidebar_spec.js
index 696fca516bc..9abc3daf221 100644
--- a/spec/javascripts/sidebar/lock/lock_issue_sidebar_spec.js
+++ b/spec/javascripts/sidebar/lock/lock_issue_sidebar_spec.js
@@ -68,4 +68,22 @@ describe('LockIssueSidebar', () => {
       done();
     });
   });
+
+  it('displays the edit form when opened from collapsed state', (done) => {
+    expect(vm1.isLockDialogOpen).toBe(false);
+
+    vm1.$el.querySelector('.sidebar-collapsed-icon').click();
+
+    expect(vm1.isLockDialogOpen).toBe(true);
+
+    setTimeout(() => {
+      expect(
+        vm1.$el
+          .innerHTML
+          .includes('Unlock this issue?'),
+      ).toBe(true);
+
+      done();
+    });
+  });
 });