Fetch all available groups in approval rules

**Note:**
- It resolves this by passing `all_available` to the groups request
- Also adds feature spec

ee/app/assets/javascripts/approvals/components/approvers_select.vue

@@ -128,6 +128,7 @@ export default {
     fetchGroups(term) {
       return Api.groups(term, {
         skip_groups: this.skipGroupIds,
+        all_available: true,
       });
     },
     fetchUsers(term) {

ee/changelogs/unreleased/11194-fix-approvals-groups-all-available.yml

+---
+title: Fetch all available groups when creating MR approval rule
+merge_request: 12096
+author:
+type: changed

ee/spec/features/merge_request/user_edits_approval_rules_mr_spec.rb

@@ -3,7 +3,10 @@
 require 'spec_helper'
 
 describe 'Merge request > User edits MR with approval rules', :js do
+  include Select2Helper
+
   include_context 'project with approval rules'
+
   let(:merge_request) { create(:merge_request, source_project: project) }
   let(:mr_rule_names) { %w[foo lorem ipsum] }
 
@@ -30,4 +33,33 @@ describe 'Merge request > User edits MR with approval rules', :js do
 
     expect(names).to eq(mr_rule_names)
   end
+
+  context "with public group" do
+    let!(:group) { create(:group, :public) }
+
+    before do
+      group.add_developer create(:user)
+    end
+
+    it "can be added by non member" do
+      members_selector = '#mr-edit-approvals-create-modal input[name=members]'
+      rule_name = "Custom Approval Rule"
+
+      click_button "Add approvers"
+
+      fill_in "Name", with: rule_name
+
+      open_select2 members_selector
+      find('.select2-result-label .group-result', text: group.name).click
+      close_select2 members_selector
+
+      find('#mr-edit-approvals-create-modal button', text: 'Add', exact_text: true).click
+
+      find('#mr-edit-approvals-create-modal button', text: 'Add approvers').click
+
+      wait_for_requests
+
+      expect(page_rule_names.last).to have_text(rule_name)
+    end
+  end
 end

ee/spec/javascripts/approvals/components/approvers_select_spec.js

@@ -116,7 +116,7 @@ describe('Approvals ApproversSelect', () => {
 
     waitForEvent($input, 'select2-loaded')
       .then(() => {
-        expect(Api.groups).toHaveBeenCalledWith(term, { skip_groups: [] });
+        expect(Api.groups).toHaveBeenCalledWith(term, { skip_groups: [], all_available: true });
         expect(Api.approverUsers).toHaveBeenCalledWith(term, {
           skip_users: [],
           project_id: TEST_PROJECT_ID,
@@ -141,7 +141,11 @@ describe('Approvals ApproversSelect', () => {
 
     waitForEvent($input, 'select2-loaded')
       .then(() => {
-        expect(Api.groups).toHaveBeenCalledWith('', { skip_groups: skipGroupIds });
+        expect(Api.groups).toHaveBeenCalledWith('', {
+          skip_groups: skipGroupIds,
+          all_available: true,
+        });
+
         expect(Api.approverUsers).toHaveBeenCalledWith('', {
           skip_users: skipUserIds,
           project_id: TEST_PROJECT_ID,