1 files changed, 26 insertions, 12 deletions

diff --git a/spec/frontend/pages/admin/jobs/index/components/stop_jobs_modal_spec.js b/spec/frontend/pages/admin/jobs/index/components/stop_jobs_modal_spec.js
index ebf21c01324..17669331370 100644
--- a/spec/frontend/pages/admin/jobs/index/components/stop_jobs_modal_spec.js
+++ b/spec/frontend/pages/admin/jobs/index/components/stop_jobs_modal_spec.js
@@ -1,9 +1,10 @@
-import Vue from 'vue';
+import Vue, { nextTick } from 'vue';
+import { mount } from '@vue/test-utils';
+import { GlModal } from '@gitlab/ui';
 import { TEST_HOST } from 'helpers/test_constants';
-import mountComponent from 'helpers/vue_mount_component_helper';
 import axios from '~/lib/utils/axios_utils';
 import { redirectTo } from '~/lib/utils/url_utility';
-import stopJobsModal from '~/pages/admin/jobs/index/components/stop_jobs_modal.vue';
+import StopJobsModal from '~/pages/admin/jobs/index/components/stop_jobs_modal.vue';
 
 jest.mock('~/lib/utils/url_utility', () => ({
   ...jest.requireActual('~/lib/utils/url_utility'),
@@ -14,20 +15,23 @@ describe('stop_jobs_modal.vue', () => {
   const props = {
     url: `${TEST_HOST}/stop_jobs_modal.vue/stopAll`,
   };
-  let vm;
+  let wrapper;
 
-  afterEach(() => {
-    vm.$destroy();
+  beforeEach(() => {
+    wrapper = mount(StopJobsModal, { propsData: props });
   });
 
-  beforeEach(() => {
-    const Component = Vue.extend(stopJobsModal);
-    vm = mountComponent(Component, props);
+  afterEach(() => {
+    wrapper.destroy();
   });
 
-  describe('onSubmit', () => {
+  describe('on submit', () => {
     it('stops jobs and redirects to overview page', async () => {
       const responseURL = `${TEST_HOST}/stop_jobs_modal.vue/jobs`;
+      // TODO: We can't use axios-mock-adapter because our current version
+      // does not support responseURL
+      //
+      // see https://gitlab.com/gitlab-org/gitlab/-/issues/375308 for details
       jest.spyOn(axios, 'post').mockImplementation((url) => {
         expect(url).toBe(props.url);
         return Promise.resolve({
@@ -37,18 +41,28 @@ describe('stop_jobs_modal.vue', () => {
         });
       });
 
-      await vm.onSubmit();
+      wrapper.findComponent(GlModal).vm.$emit('primary');
+      await nextTick();
+
       expect(redirectTo).toHaveBeenCalledWith(responseURL);
     });
 
     it('displays error if stopping jobs failed', async () => {
+      Vue.config.errorHandler = () => {}; // silencing thrown error
+
       const dummyError = new Error('stopping jobs failed');
+      // TODO: We can't use axios-mock-adapter because our current version
+      // does not support responseURL
+      //
+      // see https://gitlab.com/gitlab-org/gitlab/-/issues/375308 for details
       jest.spyOn(axios, 'post').mockImplementation((url) => {
         expect(url).toBe(props.url);
         return Promise.reject(dummyError);
       });
 
-      await expect(vm.onSubmit()).rejects.toEqual(dummyError);
+      wrapper.findComponent(GlModal).vm.$emit('primary');
+      await nextTick();
+
       expect(redirectTo).not.toHaveBeenCalled();
     });
   });