Prevent Download For Failed Vulnerability Export Jobs

ee/app/assets/javascripts/security_dashboard/components/csv_export_button.vue

@@ -57,6 +57,9 @@ export default {
         .post(this.vulnerabilitiesExportEndpoint)
         .then(({ data }) => pollUntilComplete(data._links.self))
         .then(({ data }) => {
+          if (data.status !== 'finished') {
+            throw new Error();
+          }
           download({
             fileName: `csv-export-${formatDate(new Date(), 'isoDateTime')}.csv`,
             url: data._links.download,

ee/changelogs/unreleased/220601-Prevent-Download-For-Failed-Vuln-Export-Jobs.yml

+---
+title: Prevent Download For Failed Vulnerability Export Jobs
+merge_request: 40656
+author: Kev @KevSlashNull
+type: fixed

ee/spec/frontend/security_dashboard/components/csv_export_button_spec.js

@@ -19,6 +19,7 @@ const vulnerabilitiesExportEndpoint = `${TEST_HOST}/vulnerability_findings.csv`;
 describe('Csv Button Export', () => {
   let mock;
   let wrapper;
+  let spy;
 
   const issueUrl = 'https://gitlab.com/gitlab-org/gitlab/issues/197111';
   const findPopoverExternalLink = () => wrapper.find({ ref: 'popoverExternalLink' });
@@ -38,6 +39,23 @@ describe('Csv Button Export', () => {
     });
   };
 
+  const setupMocksAndSpy = (statusLink, downloadLink, downloadAnchor, status = 'finished') => {
+    mock
+      .onPost(vulnerabilitiesExportEndpoint)
+      .reply(statusCodes.ACCEPTED, { _links: { self: statusLink } });
+    mock.onGet(statusLink).reply(() => {
+      // We need to mock it at this stage because vue internally uses
+      // document.createElement to mount the elements.
+      spy = jest.spyOn(document, 'createElement').mockImplementationOnce(() => {
+        // eslint-disable-next-line no-param-reassign
+        downloadAnchor.click = jest.fn();
+        return downloadAnchor;
+      });
+
+      return [statusCodes.OK, { _links: { download: downloadLink }, status }];
+    });
+  };
+
   afterEach(() => {
     wrapper.destroy();
     localStorage.removeItem(STORAGE_KEY);
@@ -61,21 +79,8 @@ describe('Csv Button Export', () => {
       const downloadAnchor = document.createElement('a');
       const statusLink = '/poll/until/complete';
       const downloadLink = '/link/to/download';
-      let spy;
-
-      mock
-        .onPost(vulnerabilitiesExportEndpoint)
-        .reply(statusCodes.ACCEPTED, { _links: { self: statusLink } });
-      mock.onGet(statusLink).reply(() => {
-        // We need to mock it at this stage because vue internally uses
-        // document.createElement to mount the elements.
-        spy = jest.spyOn(document, 'createElement').mockImplementationOnce(() => {
-          downloadAnchor.click = jest.fn();
-          return downloadAnchor;
-        });
-
-        return [statusCodes.OK, { _links: { download: downloadLink } }];
-      });
+
+      setupMocksAndSpy(statusLink, downloadLink, downloadAnchor);
 
       findCsvExportButton().vm.$emit('click');
 
@@ -89,6 +94,22 @@ describe('Csv Button Export', () => {
       });
     });
 
+    it(`shows the flash error when the export job status is 'failed'`, () => {
+      setupMocksAndSpy(
+        '/poll/until/complete',
+        '/link/to/download',
+        document.createElement('a'),
+        'failed',
+      );
+
+      findCsvExportButton().vm.$emit('click');
+
+      return axios.waitForAll().then(() => {
+        expect(spy).not.toHaveBeenCalled();
+        expect(createFlash).toHaveBeenCalledWith('There was an error while generating the report.');
+      });
+    });
+
     it('shows the flash error when backend fails to generate the export', () => {
       mock.onPost(vulnerabilitiesExportEndpoint).reply(statusCodes.NOT_FOUND, {});