Group-level new issue & MR using previously selected project

4 files changed, 125 insertions, 5 deletions

diff --git a/spec/features/dashboard/issues_spec.rb b/spec/features/dashboard/issues_spec.rb
index be6f78ee607..795335aa106 100644
--- a/spec/features/dashboard/issues_spec.rb
+++ b/spec/features/dashboard/issues_spec.rb
@@ -79,12 +79,21 @@ RSpec.describe 'Dashboard Issues' do
       end
     end
 
-    it 'shows the new issue page', :js do
+    it 'shows the new issue page', js: true do
       find('.new-project-item-select-button').trigger('click')
+
       wait_for_requests
-      find('.select2-results li').click
 
-      expect(page).to have_current_path("/#{project.path_with_namespace}/issues/new")
+      project_path = "/#{project.path_with_namespace}"
+      project_json = { name: project.name_with_namespace, url: project_path }.to_json
+
+      # similate selection, and prevent overlap by dropdown menu
+      execute_script("$('.project-item-select').val('#{project_json}').trigger('change');")
+      execute_script("$('#select2-drop-mask').remove();")
+
+      find('.new-project-item-link').trigger('click')
+
+      expect(page).to have_current_path("#{project_path}/issues/new")
 
       page.within('#content-body') do
         expect(page).to have_selector('.issue-form')
diff --git a/spec/features/groups/empty_states_spec.rb b/spec/features/groups/empty_states_spec.rb
index 7f28553c44e..243e8536168 100644
--- a/spec/features/groups/empty_states_spec.rb
+++ b/spec/features/groups/empty_states_spec.rb
@@ -38,7 +38,7 @@ feature 'Groups Merge Requests Empty States' do
 
       it 'should show a new merge request button' do
         within '.empty-state' do
-          expect(page).to have_content('New merge request')
+          expect(page).to have_content('create merge request')
         end
       end
 
@@ -63,7 +63,7 @@ feature 'Groups Merge Requests Empty States' do
 
     it 'should not show a new merge request button' do
       within '.empty-state' do
-        expect(page).not_to have_link('New merge request')
+        expect(page).not_to have_link('create merge request')
       end
     end
   end
diff --git a/spec/javascripts/fixtures/project_select_combo_button.html.haml b/spec/javascripts/fixtures/project_select_combo_button.html.haml
new file mode 100644
index 00000000000..54bc1a59279
--- /dev/null
+++ b/spec/javascripts/fixtures/project_select_combo_button.html.haml
@@ -0,0 +1,6 @@
+.project-item-select-holder
+  %input.project-item-select{ data: { group_id: '12345' , relative_path: 'issues/new' } }
+  %a.new-project-item-link{ data: { label: 'New issue' }, href: ''}
+    %i.fa.fa-spinner.spin
+  %a.new-project-item-select-button
+    %i.fa.fa-caret-down
diff --git a/spec/javascripts/project_select_combo_button_spec.js b/spec/javascripts/project_select_combo_button_spec.js
new file mode 100644
index 00000000000..e10a5a3bef6
--- /dev/null
+++ b/spec/javascripts/project_select_combo_button_spec.js
@@ -0,0 +1,105 @@
+import ProjectSelectComboButton from '~/project_select_combo_button';
+
+const fixturePath = 'static/project_select_combo_button.html.raw';
+
+describe('Project Select Combo Button', function () {
+  preloadFixtures(fixturePath);
+
+  beforeEach(function () {
+    this.defaults = {
+      label: 'Select project to create issue',
+      groupId: 12345,
+      projectMeta: {
+        name: 'My Cool Project',
+        url: 'http://mycoolproject.com',
+      },
+      newProjectMeta: {
+        name: 'My Other Cool Project',
+        url: 'http://myothercoolproject.com',
+      },
+      localStorageKey: 'group-12345-new-issue-recent-project',
+      relativePath: 'issues/new',
+    };
+
+    loadFixtures(fixturePath);
+
+    this.newItemBtn = document.querySelector('.new-project-item-link');
+    this.projectSelectInput = document.querySelector('.project-item-select');
+  });
+
+  describe('on page load when localStorage is empty', function () {
+    beforeEach(function () {
+      this.comboButton = new ProjectSelectComboButton(this.projectSelectInput);
+    });
+
+    it('newItemBtn is disabled', function () {
+      expect(this.newItemBtn.hasAttribute('disabled')).toBe(true);
+      expect(this.newItemBtn.classList.contains('disabled')).toBe(true);
+    });
+
+    it('newItemBtn href is null', function () {
+      expect(this.newItemBtn.getAttribute('href')).toBe('');
+    });
+
+    it('newItemBtn text is the plain default label', function () {
+      expect(this.newItemBtn.textContent).toBe(this.defaults.label);
+    });
+  });
+
+  describe('on page load when localStorage is filled', function () {
+    beforeEach(function () {
+      window.localStorage
+        .setItem(this.defaults.localStorageKey, JSON.stringify(this.defaults.projectMeta));
+      this.comboButton = new ProjectSelectComboButton(this.projectSelectInput);
+    });
+
+    it('newItemBtn is not disabled', function () {
+      expect(this.newItemBtn.hasAttribute('disabled')).toBe(false);
+      expect(this.newItemBtn.classList.contains('disabled')).toBe(false);
+    });
+
+    it('newItemBtn href is correctly set', function () {
+      expect(this.newItemBtn.getAttribute('href')).toBe(this.defaults.projectMeta.url);
+    });
+
+    it('newItemBtn text is the cached label', function () {
+      expect(this.newItemBtn.textContent)
+        .toBe(`New issue in ${this.defaults.projectMeta.name}`);
+    });
+
+    afterEach(function () {
+      window.localStorage.clear();
+    });
+  });
+
+  describe('after selecting a new project', function () {
+    beforeEach(function () {
+      this.comboButton = new ProjectSelectComboButton(this.projectSelectInput);
+
+      // mock the effect of selecting an item from the projects dropdown (select2)
+      $('.project-item-select')
+        .val(JSON.stringify(this.defaults.newProjectMeta))
+        .trigger('change');
+    });
+
+    it('newItemBtn is not disabled', function () {
+      expect(this.newItemBtn.hasAttribute('disabled')).toBe(false);
+      expect(this.newItemBtn.classList.contains('disabled')).toBe(false);
+    });
+
+    it('newItemBtn href is correctly set', function () {
+      expect(this.newItemBtn.getAttribute('href'))
+        .toBe('http://myothercoolproject.com/issues/new');
+    });
+
+    it('newItemBtn text is the selected project label', function () {
+      expect(this.newItemBtn.textContent)
+        .toBe(`New issue in ${this.defaults.newProjectMeta.name}`);
+    });
+
+    afterEach(function () {
+      window.localStorage.clear();
+    });
+  });
+});
+