Fix invite project members modal closing on error

- keep modal open if the request failed

Changelog: fixed

app/assets/javascripts/invite_members/components/import_project_members_modal.vue

@@ -2,7 +2,7 @@
 import { GlFormGroup, GlModal, GlSprintf } from '@gitlab/ui';
 import { uniqueId } from 'lodash';
 import { importProjectMembers } from '~/api/projects_api';
-import { BV_SHOW_MODAL } from '~/lib/utils/constants';
+import { BV_SHOW_MODAL, BV_HIDE_MODAL } from '~/lib/utils/constants';
 import { s__, __, sprintf } from '~/locale';
 import eventHub from '../event_hub';
 import {
@@ -80,11 +80,17 @@ export default {
     openModal() {
       this.$root.$emit(BV_SHOW_MODAL, this.$options.modalId);
     },
+    closeModal() {
+      this.$root.$emit(BV_HIDE_MODAL, this.$options.modalId);
+    },
     resetFields() {
       this.invalidFeedbackMessage = '';
       this.projectToBeImported = {};
     },
-    submitImport() {
+    submitImport(e) {
+      // We never want to hide when submitting
+      e.preventDefault();
+
       this.isLoading = true;
       return importProjectMembers(this.projectId, this.projectToBeImported.id)
         .then(this.onInviteSuccess)

spec/frontend/invite_members/components/import_project_members_modal_spec.js

 import { GlFormGroup, GlSprintf, GlModal } from '@gitlab/ui';
 import MockAdapter from 'axios-mock-adapter';
 import { nextTick } from 'vue';
+import { createWrapper } from '@vue/test-utils';
+import { BV_HIDE_MODAL } from '~/lib/utils/constants';
 import { stubComponent } from 'helpers/stub_component';
 import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
 import waitForPromises from 'helpers/wait_for_promises';
@@ -107,6 +109,15 @@ describe('ImportProjectMembersModal', () => {
   });
 
   describe('submitting the import', () => {
+    it('prevents closing', () => {
+      const evt = { preventDefault: jest.fn() };
+      createComponent();
+
+      findGlModal().vm.$emit('primary', evt);
+
+      expect(evt.preventDefault).toHaveBeenCalledTimes(1);
+    });
+
     describe('when the import is successful with reloadPageOnSubmit', () => {
       beforeEach(() => {
         createComponent({
@@ -161,6 +172,12 @@ describe('ImportProjectMembersModal', () => {
         );
       });
 
+      it('hides the modal', () => {
+        const rootWrapper = createWrapper(wrapper.vm.$root);
+
+        expect(rootWrapper.emitted(BV_HIDE_MODAL)).toHaveLength(1);
+      });
+
       it('does not call displaySuccessfulInvitationAlert on mount', () => {
         expect(displaySuccessfulInvitationAlert).not.toHaveBeenCalled();
       });