Recover test lost due to rebase

This recovers the test added in 139e730a
that was lost due a bad rebase of this branch.

spec/frontend/vue_shared/security_reports/components/manage_via_mr_spec.js

@@ -15,6 +15,8 @@ jest.mock('~/lib/utils/url_utility');
 
 Vue.use(VueApollo);
 
+const projectPath = 'namespace/project';
+
 describe('ManageViaMr component', () => {
   let wrapper;
 
@@ -37,7 +39,7 @@ describe('ManageViaMr component', () => {
     wrapper = extendedWrapper(
       mount(ManageViaMr, {
         provide: {
-          projectPath: 'testProjectPath',
+          projectPath,
         },
         propsData: {
           feature: {
@@ -62,98 +64,110 @@ describe('ManageViaMr component', () => {
   // the ones available in the current test context.
   const supportedReportTypes = Object.entries(featureToMutationMap).map(
     ([featureType, { getMutationPayload, mutationId }]) => {
-      const { mutation } = getMutationPayload();
-      return [humanize(featureType), featureType, mutation, mutationId];
+      const { mutation, variables: mutationVariables } = getMutationPayload(projectPath);
+      return [humanize(featureType), featureType, mutation, mutationId, mutationVariables];
     },
   );
 
-  describe.each(supportedReportTypes)('%s', (featureName, featureType, mutation, mutationId) => {
-    const buildConfigureSecurityFeatureMock = buildConfigureSecurityFeatureMockFactory(mutationId);
-    const successHandler = async () => buildConfigureSecurityFeatureMock();
-    const noSuccessPathHandler = async () =>
-      buildConfigureSecurityFeatureMock({
-        successPath: '',
-      });
-    const errorHandler = async () =>
-      buildConfigureSecurityFeatureMock({
-        errors: ['foo'],
+  describe.each(supportedReportTypes)(
+    '%s',
+    (featureName, featureType, mutation, mutationId, mutationVariables) => {
+      const buildConfigureSecurityFeatureMock = buildConfigureSecurityFeatureMockFactory(
+        mutationId,
+      );
+      const successHandler = jest.fn(async () => buildConfigureSecurityFeatureMock());
+      const noSuccessPathHandler = async () =>
+        buildConfigureSecurityFeatureMock({
+          successPath: '',
+        });
+      const errorHandler = async () =>
+        buildConfigureSecurityFeatureMock({
+          errors: ['foo'],
+        });
+      const pendingHandler = () => new Promise(() => {});
+
+      describe('when feature is configured', () => {
+        beforeEach(() => {
+          const apolloProvider = createMockApolloProvider(mutation, successHandler);
+          createComponent({ apolloProvider, featureName, featureType, isFeatureConfigured: true });
+        });
+
+        it('it does not render a button', () => {
+          expect(findButton().exists()).toBe(false);
+        });
       });
-    const pendingHandler = () => new Promise(() => {});
 
-    describe('when feature is configured', () => {
-      beforeEach(() => {
-        const apolloProvider = createMockApolloProvider(mutation, successHandler);
-        createComponent({ apolloProvider, featureName, featureType, isFeatureConfigured: true });
-      });
-
-      it('it does not render a button', () => {
-        expect(findButton().exists()).toBe(false);
-      });
-    });
+      describe('when feature is not configured', () => {
+        beforeEach(() => {
+          const apolloProvider = createMockApolloProvider(mutation, successHandler);
+          createComponent({ apolloProvider, featureName, featureType, isFeatureConfigured: false });
+        });
 
-    describe('when feature is not configured', () => {
-      beforeEach(() => {
-        const apolloProvider = createMockApolloProvider(mutation, successHandler);
-        createComponent({ apolloProvider, featureName, featureType, isFeatureConfigured: false });
-      });
+        it('it does render a button', () => {
+          expect(findButton().exists()).toBe(true);
+        });
 
-      it('it does render a button', () => {
-        expect(findButton().exists()).toBe(true);
-      });
-    });
+        it('clicking on the button triggers the configure mutation', () => {
+          findButton().trigger('click');
 
-    describe('given a pending response', () => {
-      beforeEach(() => {
-        const apolloProvider = createMockApolloProvider(mutation, pendingHandler);
-        createComponent({ apolloProvider, featureName, featureType });
+          expect(successHandler).toHaveBeenCalledTimes(1);
+          expect(successHandler).toHaveBeenCalledWith(mutationVariables);
+        });
       });
 
-      it('renders spinner correctly', async () => {
-        const button = findButton();
-        expect(button.props('loading')).toBe(false);
-        await button.trigger('click');
-        expect(button.props('loading')).toBe(true);
+      describe('given a pending response', () => {
+        beforeEach(() => {
+          const apolloProvider = createMockApolloProvider(mutation, pendingHandler);
+          createComponent({ apolloProvider, featureName, featureType });
+        });
+
+        it('renders spinner correctly', async () => {
+          const button = findButton();
+          expect(button.props('loading')).toBe(false);
+          await button.trigger('click');
+          expect(button.props('loading')).toBe(true);
+        });
       });
-    });
 
-    describe('given a successful response', () => {
-      beforeEach(() => {
-        const apolloProvider = createMockApolloProvider(mutation, successHandler);
-        createComponent({ apolloProvider, featureName, featureType });
+      describe('given a successful response', () => {
+        beforeEach(() => {
+          const apolloProvider = createMockApolloProvider(mutation, successHandler);
+          createComponent({ apolloProvider, featureName, featureType });
+        });
+
+        it('should call redirect helper with correct value', async () => {
+          await wrapper.trigger('click');
+          await waitForPromises();
+          expect(redirectTo).toHaveBeenCalledTimes(1);
+          expect(redirectTo).toHaveBeenCalledWith('testSuccessPath');
+          // This is done for UX reasons. If the loading prop is set to false
+          // on success, then there's a period where the button is clickable
+          // again. Instead, we want the button to display a loading indicator
+          // for the remainder of the lifetime of the page (i.e., until the
+          // browser can start painting the new page it's been redirected to).
+          expect(findButton().props().loading).toBe(true);
+        });
       });
 
-      it('should call redirect helper with correct value', async () => {
-        await wrapper.trigger('click');
-        await waitForPromises();
-        expect(redirectTo).toHaveBeenCalledTimes(1);
-        expect(redirectTo).toHaveBeenCalledWith('testSuccessPath');
-        // This is done for UX reasons. If the loading prop is set to false
-        // on success, then there's a period where the button is clickable
-        // again. Instead, we want the button to display a loading indicator
-        // for the remainder of the lifetime of the page (i.e., until the
-        // browser can start painting the new page it's been redirected to).
-        expect(findButton().props().loading).toBe(true);
+      describe.each`
+        handler                 | message
+        ${noSuccessPathHandler} | ${`${featureName} merge request creation mutation failed`}
+        ${errorHandler}         | ${'foo'}
+      `('given an error response', ({ handler, message }) => {
+        beforeEach(() => {
+          const apolloProvider = createMockApolloProvider(mutation, handler);
+          createComponent({ apolloProvider, featureName, featureType });
+        });
+
+        it('should catch and emit error', async () => {
+          await wrapper.trigger('click');
+          await waitForPromises();
+          expect(wrapper.emitted('error')).toEqual([[message]]);
+          expect(findButton().props('loading')).toBe(false);
+        });
       });
-    });
-
-    describe.each`
-      handler                 | message
-      ${noSuccessPathHandler} | ${`${featureName} merge request creation mutation failed`}
-      ${errorHandler}         | ${'foo'}
-    `('given an error response', ({ handler, message }) => {
-      beforeEach(() => {
-        const apolloProvider = createMockApolloProvider(mutation, handler);
-        createComponent({ apolloProvider, featureName, featureType });
-      });
-
-      it('should catch and emit error', async () => {
-        await wrapper.trigger('click');
-        await waitForPromises();
-        expect(wrapper.emitted('error')).toEqual([[message]]);
-        expect(findButton().props('loading')).toBe(false);
-      });
-    });
-  });
+    },
+  );
 
   describe('button props', () => {
     it('passes the variant and category props to the GlButton', () => {