Merge branch 'ide-commit-actions-update' into 'master'

Improve commit flow in Web IDE

Closes #46122

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

4 files changed, 17 insertions, 12 deletions

diff --git a/spec/javascripts/ide/components/commit_sidebar/list_item_spec.js b/spec/javascripts/ide/components/commit_sidebar/list_item_spec.js
index 8f7cf24c22f..bf96170f703 100644
--- a/spec/javascripts/ide/components/commit_sidebar/list_item_spec.js
+++ b/spec/javascripts/ide/components/commit_sidebar/list_item_spec.js
@@ -93,14 +93,14 @@ describe('Multi-file editor commit sidebar list item', () => {
 
   describe('is active', () => {
     it('does not add active class when dont keys match', () => {
-      expect(vm.$el.classList).not.toContain('is-active');
+      expect(vm.$el.querySelector('.is-active')).toBe(null);
     });
 
     it('adds active class when keys match', done => {
       vm.keyPrefix = 'staged';
 
       vm.$nextTick(() => {
-        expect(vm.$el.classList).toContain('is-active');
+        expect(vm.$el.querySelector('.is-active')).not.toBe(null);
 
         done();
       });
diff --git a/spec/javascripts/ide/components/commit_sidebar/list_spec.js b/spec/javascripts/ide/components/commit_sidebar/list_spec.js
index 6fb52378386..b786be55019 100644
--- a/spec/javascripts/ide/components/commit_sidebar/list_spec.js
+++ b/spec/javascripts/ide/components/commit_sidebar/list_spec.js
@@ -16,6 +16,7 @@ describe('Multi-file editor commit sidebar list', () => {
       iconName: 'staged',
       action: 'stageAllChanges',
       actionBtnText: 'stage all',
+      actionBtnIcon: 'history',
       itemActionComponent: 'stage-button',
       activeFileKey: 'staged-testing',
       keyPrefix: 'staged',
@@ -42,7 +43,7 @@ describe('Multi-file editor commit sidebar list', () => {
     });
 
     it('renders list', () => {
-      expect(vm.$el.querySelectorAll('li').length).toBe(1);
+      expect(vm.$el.querySelectorAll('.multi-file-commit-list > li').length).toBe(1);
     });
   });
 
diff --git a/spec/javascripts/ide/components/commit_sidebar/stage_button_spec.js b/spec/javascripts/ide/components/commit_sidebar/stage_button_spec.js
index 6bf8710bda7..a5b906da8a1 100644
--- a/spec/javascripts/ide/components/commit_sidebar/stage_button_spec.js
+++ b/spec/javascripts/ide/components/commit_sidebar/stage_button_spec.js
@@ -39,7 +39,7 @@ describe('IDE stage file button', () => {
   });
 
   it('calls store with discard button', () => {
-    vm.$el.querySelectorAll('.btn')[1].click();
+    vm.$el.querySelector('.dropdown-menu button').click();
 
     expect(vm.discardFileChanges).toHaveBeenCalledWith(f.path);
   });
diff --git a/spec/javascripts/ide/components/repo_commit_section_spec.js b/spec/javascripts/ide/components/repo_commit_section_spec.js
index 531bcd6e540..6bf309fb4bf 100644
--- a/spec/javascripts/ide/components/repo_commit_section_spec.js
+++ b/spec/javascripts/ide/components/repo_commit_section_spec.js
@@ -111,7 +111,7 @@ describe('RepoCommitSection', () => {
   });
 
   it('renders a commit section', () => {
-    const changedFileElements = [...vm.$el.querySelectorAll('.multi-file-commit-list li')];
+    const changedFileElements = [...vm.$el.querySelectorAll('.multi-file-commit-list > li')];
     const allFiles = vm.$store.state.changedFiles.concat(vm.$store.state.stagedFiles);
 
     expect(changedFileElements.length).toEqual(4);
@@ -140,22 +140,26 @@ describe('RepoCommitSection', () => {
     vm.$el.querySelector('.multi-file-discard-btn .btn').click();
 
     Vue.nextTick(() => {
-      expect(vm.$el.querySelector('.ide-commit-list-container').querySelectorAll('li').length).toBe(
-        1,
-      );
+      expect(
+        vm.$el
+          .querySelector('.ide-commit-list-container')
+          .querySelectorAll('.multi-file-commit-list > li').length,
+      ).toBe(1);
 
       done();
     });
   });
 
   it('discards a single file', done => {
-    vm.$el.querySelectorAll('.multi-file-discard-btn .btn')[1].click();
+    vm.$el.querySelector('.multi-file-discard-btn .dropdown-menu button').click();
 
     Vue.nextTick(() => {
       expect(vm.$el.querySelector('.ide-commit-list-container').textContent).not.toContain('file1');
-      expect(vm.$el.querySelector('.ide-commit-list-container').querySelectorAll('li').length).toBe(
-        1,
-      );
+      expect(
+        vm.$el
+          .querySelector('.ide-commit-list-container')
+          .querySelectorAll('.multi-file-commit-list > li').length,
+      ).toBe(1);
 
       done();
     });