From cee318e2cd03ea08562dce6bf868fe707a7f270b Mon Sep 17 00:00:00 2001
From: samdbeckham <sbeckham@gitlab.com>
Date: Thu, 29 Aug 2019 11:31:07 +0100
Subject: [PATCH 1/2] Ports the MR DAST reports logic to the backend

- Copies over all the changes from the similar MRs for dependency and
container scanning.
- Everything is behind an inactive feature flag
---
 .../grouped_security_reports_app.vue          |  16 +-
 .../security_reports/store/actions.js         |  27 ++++
 .../security_reports/store/mutation_types.js  |   2 +
 .../security_reports/store/mutations.js       |  13 ++
 .../security_reports/store/state.js           |   1 +
 .../security_reports/store/mutations_spec.js  |  58 +++++++
 .../grouped_security_reports_app_spec.js      |  46 ++++++
 .../security_reports/store/actions_spec.js    | 143 ++++++++++++++++++
 8 files changed, 304 insertions(+), 2 deletions(-)

diff --git a/ee/app/assets/javascripts/vue_shared/security_reports/grouped_security_reports_app.vue b/ee/app/assets/javascripts/vue_shared/security_reports/grouped_security_reports_app.vue
index 83fd2ccf7dd035..eb355437a8f83c 100644
--- a/ee/app/assets/javascripts/vue_shared/security_reports/grouped_security_reports_app.vue
+++ b/ee/app/assets/javascripts/vue_shared/security_reports/grouped_security_reports_app.vue
@@ -176,6 +176,11 @@ export default {
     shouldRenderDependencyScanning() {
       const { head, diffEndpoint } = this.dependencyScanning.paths;
 
+      return head || diffEndpoint;
+    },
+    shouldRenderDast() {
+      const { head, diffEndpoint } = this.dast.paths;
+
       return head || diffEndpoint;
     },
   },
@@ -225,7 +230,12 @@ export default {
       this.fetchSastContainerReports();
     }
 
-    if (this.dastHeadPath) {
+    const dastDiffEndpoint = gl && gl.mrWidgetData && gl.mrWidgetData.dast_comparison_path;
+
+    if (gon.features && gon.features.dastMergeRequestReportApi && dastDiffEndpoint) {
+      this.setDastDiffEndpoint(dastDiffEndpoint);
+      this.fetchDastDiff();
+    } else if (this.dastHeadPath) {
       this.setDastHeadPath(this.dastHeadPath);
 
       if (this.dastBasePath) {
@@ -291,6 +301,8 @@ export default {
       'setSastContainerDiffEndpoint',
       'fetchDependencyScanningDiff',
       'setDependencyScanningDiffEndpoint',
+      'fetchDastDiff',
+      'setDastDiffEndpoint',
     ]),
     ...mapActions('sast', {
       setSastHeadPath: 'setHeadPath',
@@ -373,7 +385,7 @@ export default {
         />
       </template>
 
-      <template v-if="dastHeadPath">
+      <template v-if="shouldRenderDast">
         <summary-row
           :summary="groupedDastText"
           :status-icon="dastStatusIcon"
diff --git a/ee/app/assets/javascripts/vue_shared/security_reports/store/actions.js b/ee/app/assets/javascripts/vue_shared/security_reports/store/actions.js
index 9a2cd6836d6c7e..49fb2aa78e1327 100644
--- a/ee/app/assets/javascripts/vue_shared/security_reports/store/actions.js
+++ b/ee/app/assets/javascripts/vue_shared/security_reports/store/actions.js
@@ -151,6 +151,8 @@ export const setDastHeadPath = ({ commit }, path) => commit(types.SET_DAST_HEAD_
 
 export const setDastBasePath = ({ commit }, path) => commit(types.SET_DAST_BASE_PATH, path);
 
+export const setDastDiffEndpoint = ({ commit }, path) => commit(types.SET_DAST_DIFF_ENDPOINT, path);
+
 export const requestDastReports = ({ commit }) => commit(types.REQUEST_DAST_REPORTS);
 
 export const receiveDastReports = ({ commit }, response) =>
@@ -186,6 +188,31 @@ export const fetchDastReports = ({ state, dispatch }) => {
 
 export const updateDastIssue = ({ commit }, issue) => commit(types.UPDATE_DAST_ISSUE, issue);
 
+export const receiveDastDiffSuccess = ({ commit }, response) =>
+  commit(types.RECEIVE_DAST_DIFF_SUCCESS, response);
+
+export const fetchDastDiff = ({ state, dispatch }) => {
+  dispatch('requestDastReports');
+
+  return Promise.all([
+    pollUntilComplete(state.dast.paths.diffEndpoint),
+    axios.get(state.vulnerabilityFeedbackPath, {
+      params: {
+        category: 'dast',
+      },
+    }),
+  ])
+    .then(values => {
+      dispatch('receiveDastDiffSuccess', {
+        diff: values[0].data,
+        enrichData: values[1].data,
+      });
+    })
+    .catch(() => {
+      dispatch('receiveDastError');
+    });
+};
+
 /**
  * DEPENDENCY SCANNING
  */
diff --git a/ee/app/assets/javascripts/vue_shared/security_reports/store/mutation_types.js b/ee/app/assets/javascripts/vue_shared/security_reports/store/mutation_types.js
index 93e98dbc5cec66..792d11276a11fa 100644
--- a/ee/app/assets/javascripts/vue_shared/security_reports/store/mutation_types.js
+++ b/ee/app/assets/javascripts/vue_shared/security_reports/store/mutation_types.js
@@ -24,10 +24,12 @@ export const RECEIVE_SAST_CONTAINER_DIFF_SUCCESS = 'RECEIVE_SAST_CONTAINER_DIFF_
 
 // DAST
 export const SET_DAST_HEAD_PATH = 'SET_DAST_HEAD_PATH';
+export const SET_DAST_DIFF_ENDPOINT = 'SET_DAST_DIFF_ENDPOINT';
 export const SET_DAST_BASE_PATH = 'SET_DAST_BASE_PATH';
 export const REQUEST_DAST_REPORTS = 'REQUEST_DAST_REPORTS';
 export const RECEIVE_DAST_REPORTS = 'RECEIVE_DAST_REPORTS';
 export const RECEIVE_DAST_ERROR = 'RECEIVE_DAST_ERROR';
+export const RECEIVE_DAST_DIFF_SUCCESS = 'RECEIVE_DAST_DIFF_SUCCESS';
 
 // DEPENDENCY_SCANNING
 export const SET_DEPENDENCY_SCANNING_HEAD_PATH = 'SET_DEPENDENCY_SCANNING_HEAD_PATH';
diff --git a/ee/app/assets/javascripts/vue_shared/security_reports/store/mutations.js b/ee/app/assets/javascripts/vue_shared/security_reports/store/mutations.js
index 621de3895e644a..b47f36f4597999 100644
--- a/ee/app/assets/javascripts/vue_shared/security_reports/store/mutations.js
+++ b/ee/app/assets/javascripts/vue_shared/security_reports/store/mutations.js
@@ -129,6 +129,10 @@ export default {
     Vue.set(state.dast.paths, 'base', path);
   },
 
+  [types.SET_DAST_DIFF_ENDPOINT](state, path) {
+    Vue.set(state.dast.paths, 'diffEndpoint', path);
+  },
+
   [types.REQUEST_DAST_REPORTS](state) {
     Vue.set(state.dast, 'isLoading', true);
   },
@@ -152,6 +156,15 @@ export default {
     }
   },
 
+  [types.RECEIVE_DAST_DIFF_SUCCESS](state, { diff, enrichData }) {
+    const { added, fixed, existing } = parseDiff(diff, enrichData);
+
+    Vue.set(state.dast, 'isLoading', false);
+    Vue.set(state.dast, 'newIssues', added);
+    Vue.set(state.dast, 'resolvedIssues', fixed);
+    Vue.set(state.dast, 'allIssues', existing);
+  },
+
   [types.RECEIVE_DAST_ERROR](state) {
     Vue.set(state.dast, 'isLoading', false);
     Vue.set(state.dast, 'hasError', true);
diff --git a/ee/app/assets/javascripts/vue_shared/security_reports/store/state.js b/ee/app/assets/javascripts/vue_shared/security_reports/store/state.js
index 7d1cd8927f4a85..ffbd2e1d792653 100644
--- a/ee/app/assets/javascripts/vue_shared/security_reports/store/state.js
+++ b/ee/app/assets/javascripts/vue_shared/security_reports/store/state.js
@@ -33,6 +33,7 @@ export default () => ({
     paths: {
       head: null,
       base: null,
+      diffEndpoint: null,
     },
 
     isLoading: false,
diff --git a/ee/spec/frontend/vue_shared/security_reports/store/mutations_spec.js b/ee/spec/frontend/vue_shared/security_reports/store/mutations_spec.js
index 6dd4696824fe0f..e0c9f26d22160a 100644
--- a/ee/spec/frontend/vue_shared/security_reports/store/mutations_spec.js
+++ b/ee/spec/frontend/vue_shared/security_reports/store/mutations_spec.js
@@ -898,4 +898,62 @@ describe('security reports mutations', () => {
       });
     });
   });
+
+  describe('SET_DAST_DIFF_ENDPOINT', () => {
+    const endpoint = 'dast_diff_endpoint.json';
+
+    beforeEach(() => {
+      mutations[types.SET_DAST_DIFF_ENDPOINT](stateCopy, endpoint);
+    });
+
+    it('should set the correct endpoint', () => {
+      expect(stateCopy.dast.paths.diffEndpoint).toEqual(endpoint);
+    });
+  });
+
+  describe('RECEIVE_DAST_DIFF_SUCCESS', () => {
+    let reports = {};
+
+    beforeEach(() => {
+      reports = {
+        diff: {
+          added: [
+            { name: 'added vuln 1', report_type: 'dast' },
+            { name: 'added vuln 2', report_type: 'dast' },
+          ],
+          fixed: [{ name: 'fixed vuln 1', report_type: 'dast' }],
+          existing: [{ name: 'existing vuln 1', report_type: 'dast' }],
+        },
+      };
+      mutations[types.RECEIVE_DAST_DIFF_SUCCESS](stateCopy, reports);
+    });
+
+    it('should set isLoading to false', () => {
+      expect(stateCopy.dast.isLoading).toBe(false);
+    });
+
+    it('should parse and set the added vulnerabilities', () => {
+      reports.diff.added.forEach((vuln, i) => {
+        expect(stateCopy.dast.newIssues[i]).toEqual(
+          expect.objectContaining({
+            name: vuln.name,
+            title: vuln.name,
+            category: vuln.report_type,
+          }),
+        );
+      });
+    });
+
+    it('should parse and set the fixed vulnerabilities', () => {
+      reports.diff.fixed.forEach((vuln, i) => {
+        expect(stateCopy.dast.resolvedIssues[i]).toEqual(
+          expect.objectContaining({
+            name: vuln.name,
+            title: vuln.name,
+            category: vuln.report_type,
+          }),
+        );
+      });
+    });
+  });
 });
diff --git a/ee/spec/javascripts/vue_shared/security_reports/grouped_security_reports_app_spec.js b/ee/spec/javascripts/vue_shared/security_reports/grouped_security_reports_app_spec.js
index 38813a0b2271a5..6aea0c34a7d6bd 100644
--- a/ee/spec/javascripts/vue_shared/security_reports/grouped_security_reports_app_spec.js
+++ b/ee/spec/javascripts/vue_shared/security_reports/grouped_security_reports_app_spec.js
@@ -368,5 +368,51 @@ describe('Grouped security reports app', () => {
         );
       });
     });
+
+    describe('dast reports', () => {
+      const dastEndpoint = 'dast.json';
+
+      beforeEach(done => {
+        gon.features = gon.features || {};
+        gon.features.dastMergeRequestReportApi = true;
+
+        gl.mrWidgetData = gl.mrWidgetData || {};
+        gl.mrWidgetData.dast_comparison_path = dastEndpoint;
+
+        mock.onGet(dastEndpoint).reply(200, {
+          added: [dockerReport.vulnerabilities[0]],
+          fixed: [dockerReport.vulnerabilities[1], dockerReport.vulnerabilities[2]],
+        });
+
+        mock.onGet('vulnerability_feedback_path.json').reply(200, []);
+
+        vm = mountComponent(Component, {
+          headBlobPath: 'path',
+          baseBlobPath: 'path',
+          sastHelpPath: 'path',
+          sastContainerHelpPath: 'path',
+          dastHelpPath: 'path',
+          dependencyScanningHelpPath: 'path',
+          vulnerabilityFeedbackPath: 'vulnerability_feedback_path.json',
+          vulnerabilityFeedbackHelpPath: 'path',
+          pipelineId: 123,
+          canCreateIssue: true,
+          canCreateMergeRequest: true,
+          canDismissVulnerability: true,
+        });
+
+        waitForMutation(vm.$store, types.RECEIVE_DAST_DIFF_SUCCESS)
+          .then(done)
+          .catch(done.fail);
+      });
+
+      it('should set setDastDiffEndpoint', () => {
+        expect(vm.dast.paths.diffEndpoint).toEqual(dastEndpoint);
+      });
+
+      it('should call `fetchDastDiff`', () => {
+        expect(vm.$el.textContent).toContain('DAST detected 1 new, and 2 fixed vulnerabilities');
+      });
+    });
   });
 });
diff --git a/ee/spec/javascripts/vue_shared/security_reports/store/actions_spec.js b/ee/spec/javascripts/vue_shared/security_reports/store/actions_spec.js
index e18057ca72675a..d4b70bc8f9bcf4 100644
--- a/ee/spec/javascripts/vue_shared/security_reports/store/actions_spec.js
+++ b/ee/spec/javascripts/vue_shared/security_reports/store/actions_spec.js
@@ -61,6 +61,9 @@ import actions, {
   setDependencyScanningDiffEndpoint,
   receiveDependencyScanningDiffSuccess,
   fetchDependencyScanningDiff,
+  setDastDiffEndpoint,
+  receiveDastDiffSuccess,
+  fetchDastDiff,
 } from 'ee/vue_shared/security_reports/store/actions';
 import * as types from 'ee/vue_shared/security_reports/store/mutation_types';
 import state from 'ee/vue_shared/security_reports/store/state';
@@ -1872,4 +1875,144 @@ describe('security reports actions', () => {
       });
     });
   });
+
+  describe('setDastDiffEndpoint', () => {
+    it('should pass down the endpoint to the mutation', done => {
+      const payload = '/dast_endpoint.json';
+
+      testAction(
+        setDastDiffEndpoint,
+        payload,
+        mockedState,
+        [
+          {
+            type: types.SET_DAST_DIFF_ENDPOINT,
+            payload,
+          },
+        ],
+        [],
+        done,
+      );
+    });
+  });
+
+  describe('receiveDastDiffSuccess', () => {
+    it('should pass down the response to the mutation', done => {
+      const payload = { data: 'Effort yields its own rewards.' };
+
+      testAction(
+        receiveDastDiffSuccess,
+        payload,
+        mockedState,
+        [
+          {
+            type: types.RECEIVE_DAST_DIFF_SUCCESS,
+            payload,
+          },
+        ],
+        [],
+        done,
+      );
+    });
+  });
+
+  describe('fetchDastDiff', () => {
+    const diff = { foo: {} };
+
+    beforeEach(() => {
+      mockedState.vulnerabilityFeedbackPath = 'vulnerabilities_feedback';
+      mockedState.dast.paths.diffEndpoint = 'dast_diff.json';
+    });
+
+    describe('on success', () => {
+      it('should dispatch `receiveDastDiffSuccess`', done => {
+        mock.onGet('dast_diff.json').reply(200, diff);
+        mock
+          .onGet('vulnerabilities_feedback', {
+            params: {
+              category: 'dast',
+            },
+          })
+          .reply(200, dastFeedbacks);
+
+        testAction(
+          fetchDastDiff,
+          null,
+          mockedState,
+          [],
+          [
+            {
+              type: 'requestDastReports',
+            },
+            {
+              type: 'receiveDastDiffSuccess',
+              payload: {
+                diff,
+                enrichData: dastFeedbacks,
+              },
+            },
+          ],
+          done,
+        );
+      });
+    });
+
+    describe('when vulnerabilities path errors', () => {
+      it('should dispatch `receiveDastError`', done => {
+        mock.onGet('dast_diff.json').reply(500);
+        mock
+          .onGet('vulnerabilities_feedback', {
+            params: {
+              category: 'dast',
+            },
+          })
+          .reply(200, dastFeedbacks);
+
+        testAction(
+          fetchDastDiff,
+          null,
+          mockedState,
+          [],
+          [
+            {
+              type: 'requestDastReports',
+            },
+            {
+              type: 'receiveDastError',
+            },
+          ],
+          done,
+        );
+      });
+    });
+
+    describe('when feedback path errors', () => {
+      it('should dispatch `receiveDastError`', done => {
+        mock.onGet('dast_diff.json').reply(200, diff);
+        mock
+          .onGet('vulnerabilities_feedback', {
+            params: {
+              category: 'dast',
+            },
+          })
+          .reply(500);
+
+        testAction(
+          fetchDastDiff,
+          null,
+          mockedState,
+          [],
+          [
+            {
+              type: 'requestDastReports',
+            },
+            {
+              type: 'receiveDastError',
+            },
+          ],
+          done,
+        );
+      });
+    });
+  });
 });
-- 
GitLab


From 2ad16498615e3ff1452b165ead4b23cb6e7fbec8 Mon Sep 17 00:00:00 2001
From: Mark Florian <mflorian@gitlab.com>
Date: Tue, 3 Sep 2019 11:34:35 +0100
Subject: [PATCH 2/2] Apply review suggestion from @filipa

This adds `RECEIVE_.*_DIFF_ERROR` mutations and associated actions to
the security reports store, to be more consistent with the Vuex
guidelines.
---
 .../security_reports/store/actions.js         | 14 +++-
 .../security_reports/store/mutation_types.js  |  3 +
 .../security_reports/store/mutations.js       | 15 +++++
 .../security_reports/store/mutations_spec.js  | 27 ++++++++
 .../security_reports/store/actions_spec.js    | 66 +++++++++++++++++--
 5 files changed, 116 insertions(+), 9 deletions(-)

diff --git a/ee/app/assets/javascripts/vue_shared/security_reports/store/actions.js b/ee/app/assets/javascripts/vue_shared/security_reports/store/actions.js
index 49fb2aa78e1327..c10c31b6a68bba 100644
--- a/ee/app/assets/javascripts/vue_shared/security_reports/store/actions.js
+++ b/ee/app/assets/javascripts/vue_shared/security_reports/store/actions.js
@@ -93,6 +93,9 @@ export const receiveSastContainerError = ({ commit }, error) =>
 export const receiveSastContainerDiffSuccess = ({ commit }, response) =>
   commit(types.RECEIVE_SAST_CONTAINER_DIFF_SUCCESS, response);
 
+export const receiveSastContainerDiffError = ({ commit }) =>
+  commit(types.RECEIVE_SAST_CONTAINER_DIFF_ERROR);
+
 export const fetchSastContainerDiff = ({ state, dispatch }) => {
   dispatch('requestSastContainerReports');
 
@@ -111,7 +114,7 @@ export const fetchSastContainerDiff = ({ state, dispatch }) => {
       });
     })
     .catch(() => {
-      dispatch('receiveSastContainerError');
+      dispatch('receiveSastContainerDiffError');
     });
 };
 
@@ -191,6 +194,8 @@ export const updateDastIssue = ({ commit }, issue) => commit(types.UPDATE_DAST_I
 export const receiveDastDiffSuccess = ({ commit }, response) =>
   commit(types.RECEIVE_DAST_DIFF_SUCCESS, response);
 
+export const receiveDastDiffError = ({ commit }) => commit(types.RECEIVE_DAST_DIFF_ERROR);
+
 export const fetchDastDiff = ({ state, dispatch }) => {
   dispatch('requestDastReports');
 
@@ -209,7 +214,7 @@ export const fetchDastDiff = ({ state, dispatch }) => {
       });
     })
     .catch(() => {
-      dispatch('receiveDastError');
+      dispatch('receiveDastDiffError');
     });
 };
 
@@ -237,6 +242,9 @@ export const receiveDependencyScanningError = ({ commit }, error) =>
 export const receiveDependencyScanningDiffSuccess = ({ commit }, response) =>
   commit(types.RECEIVE_DEPENDENCY_SCANNING_DIFF_SUCCESS, response);
 
+export const receiveDependencyScanningDiffError = ({ commit }) =>
+  commit(types.RECEIVE_DEPENDENCY_SCANNING_DIFF_ERROR);
+
 export const fetchDependencyScanningDiff = ({ state, dispatch }) => {
   dispatch('requestDependencyScanningReports');
 
@@ -255,7 +263,7 @@ export const fetchDependencyScanningDiff = ({ state, dispatch }) => {
       });
     })
     .catch(() => {
-      dispatch('receiveDependencyScanningError');
+      dispatch('receiveDependencyScanningDiffError');
     });
 };
 
diff --git a/ee/app/assets/javascripts/vue_shared/security_reports/store/mutation_types.js b/ee/app/assets/javascripts/vue_shared/security_reports/store/mutation_types.js
index 792d11276a11fa..2beb68a847c549 100644
--- a/ee/app/assets/javascripts/vue_shared/security_reports/store/mutation_types.js
+++ b/ee/app/assets/javascripts/vue_shared/security_reports/store/mutation_types.js
@@ -21,6 +21,7 @@ export const REQUEST_SAST_CONTAINER_REPORTS = 'REQUEST_SAST_CONTAINER_REPORTS';
 export const RECEIVE_SAST_CONTAINER_REPORTS = 'RECEIVE_SAST_CONTAINER_REPORTS';
 export const RECEIVE_SAST_CONTAINER_ERROR = 'RECEIVE_SAST_CONTAINER_ERROR';
 export const RECEIVE_SAST_CONTAINER_DIFF_SUCCESS = 'RECEIVE_SAST_CONTAINER_DIFF_SUCCESS';
+export const RECEIVE_SAST_CONTAINER_DIFF_ERROR = 'RECEIVE_SAST_CONTAINER_DIFF_ERROR';
 
 // DAST
 export const SET_DAST_HEAD_PATH = 'SET_DAST_HEAD_PATH';
@@ -30,6 +31,7 @@ export const REQUEST_DAST_REPORTS = 'REQUEST_DAST_REPORTS';
 export const RECEIVE_DAST_REPORTS = 'RECEIVE_DAST_REPORTS';
 export const RECEIVE_DAST_ERROR = 'RECEIVE_DAST_ERROR';
 export const RECEIVE_DAST_DIFF_SUCCESS = 'RECEIVE_DAST_DIFF_SUCCESS';
+export const RECEIVE_DAST_DIFF_ERROR = 'RECEIVE_DAST_DIFF_ERROR';
 
 // DEPENDENCY_SCANNING
 export const SET_DEPENDENCY_SCANNING_HEAD_PATH = 'SET_DEPENDENCY_SCANNING_HEAD_PATH';
@@ -39,6 +41,7 @@ export const REQUEST_DEPENDENCY_SCANNING_REPORTS = 'REQUEST_DEPENDENCY_SCANNING_
 export const RECEIVE_DEPENDENCY_SCANNING_REPORTS = 'RECEIVE_DEPENDENCY_SCANNING_REPORTS';
 export const RECEIVE_DEPENDENCY_SCANNING_ERROR = 'RECEIVE_DEPENDENCY_SCANNING_ERROR';
 export const RECEIVE_DEPENDENCY_SCANNING_DIFF_SUCCESS = 'RECEIVE_DEPENDENCY_SCANNING_DIFF_SUCCESS';
+export const RECEIVE_DEPENDENCY_SCANNING_DIFF_ERROR = 'RECEIVE_DEPENDENCY_SCANNING_DIFF_ERROR';
 
 // Dismiss security issue
 export const SET_ISSUE_MODAL_DATA = 'SET_ISSUE_MODAL_DATA';
diff --git a/ee/app/assets/javascripts/vue_shared/security_reports/store/mutations.js b/ee/app/assets/javascripts/vue_shared/security_reports/store/mutations.js
index b47f36f4597999..e4c1ec9466570f 100644
--- a/ee/app/assets/javascripts/vue_shared/security_reports/store/mutations.js
+++ b/ee/app/assets/javascripts/vue_shared/security_reports/store/mutations.js
@@ -114,6 +114,11 @@ export default {
     Vue.set(state.sastContainer, 'allIssues', existing);
   },
 
+  [types.RECEIVE_SAST_CONTAINER_DIFF_ERROR](state) {
+    Vue.set(state.sastContainer, 'isLoading', false);
+    Vue.set(state.sastContainer, 'hasError', true);
+  },
+
   [types.RECEIVE_SAST_CONTAINER_ERROR](state) {
     Vue.set(state.sastContainer, 'isLoading', false);
     Vue.set(state.sastContainer, 'hasError', true);
@@ -165,6 +170,11 @@ export default {
     Vue.set(state.dast, 'allIssues', existing);
   },
 
+  [types.RECEIVE_DAST_DIFF_ERROR](state) {
+    Vue.set(state.dast, 'isLoading', false);
+    Vue.set(state.dast, 'hasError', true);
+  },
+
   [types.RECEIVE_DAST_ERROR](state) {
     Vue.set(state.dast, 'isLoading', false);
     Vue.set(state.dast, 'hasError', true);
@@ -247,6 +257,11 @@ export default {
     Vue.set(state.dependencyScanning, 'allIssues', existing);
   },
 
+  [types.RECEIVE_DEPENDENCY_SCANNING_DIFF_ERROR](state) {
+    Vue.set(state.dependencyScanning, 'isLoading', false);
+    Vue.set(state.dependencyScanning, 'hasError', true);
+  },
+
   [types.RECEIVE_DEPENDENCY_SCANNING_ERROR](state) {
     Vue.set(state.dependencyScanning, 'isLoading', false);
     Vue.set(state.dependencyScanning, 'hasError', true);
diff --git a/ee/spec/frontend/vue_shared/security_reports/store/mutations_spec.js b/ee/spec/frontend/vue_shared/security_reports/store/mutations_spec.js
index e0c9f26d22160a..01cfe1e635b092 100644
--- a/ee/spec/frontend/vue_shared/security_reports/store/mutations_spec.js
+++ b/ee/spec/frontend/vue_shared/security_reports/store/mutations_spec.js
@@ -841,6 +841,15 @@ describe('security reports mutations', () => {
     });
   });
 
+  describe('RECEIVE_SAST_CONTAINER_DIFF_ERROR', () => {
+    it('should set sast container loading flag to false and error flag to true', () => {
+      mutations[types.RECEIVE_SAST_CONTAINER_DIFF_ERROR](stateCopy);
+
+      expect(stateCopy.sastContainer.isLoading).toEqual(false);
+      expect(stateCopy.sastContainer.hasError).toEqual(true);
+    });
+  });
+
   describe('SET_DEPENDENCY_SCANNING_DIFF_ENDPOINT', () => {
     const endpoint = 'dependency_scannning_diff_endpoint.json';
 
@@ -899,6 +908,15 @@ describe('security reports mutations', () => {
     });
   });
 
+  describe('RECEIVE_DEPENDENCY_SCANNING_DIFF_ERROR', () => {
+    it('should set dependency scanning loading flag to false and error flag to true', () => {
+      mutations[types.RECEIVE_DEPENDENCY_SCANNING_DIFF_ERROR](stateCopy);
+
+      expect(stateCopy.dependencyScanning.isLoading).toEqual(false);
+      expect(stateCopy.dependencyScanning.hasError).toEqual(true);
+    });
+  });
+
   describe('SET_DAST_DIFF_ENDPOINT', () => {
     const endpoint = 'dast_diff_endpoint.json';
 
@@ -956,4 +974,13 @@ describe('security reports mutations', () => {
       });
     });
   });
+
+  describe('RECEIVE_DAST_DIFF_ERROR', () => {
+    it('should set dast loading flag to false and error flag to true', () => {
+      mutations[types.RECEIVE_DAST_DIFF_ERROR](stateCopy);
+
+      expect(stateCopy.dast.isLoading).toEqual(false);
+      expect(stateCopy.dast.hasError).toEqual(true);
+    });
+  });
 });
diff --git a/ee/spec/javascripts/vue_shared/security_reports/store/actions_spec.js b/ee/spec/javascripts/vue_shared/security_reports/store/actions_spec.js
index d4b70bc8f9bcf4..fc588694b4aa10 100644
--- a/ee/spec/javascripts/vue_shared/security_reports/store/actions_spec.js
+++ b/ee/spec/javascripts/vue_shared/security_reports/store/actions_spec.js
@@ -57,12 +57,15 @@ import actions, {
   hideDismissalDeleteButtons,
   setSastContainerDiffEndpoint,
   receiveSastContainerDiffSuccess,
+  receiveSastContainerDiffError,
   fetchSastContainerDiff,
   setDependencyScanningDiffEndpoint,
   receiveDependencyScanningDiffSuccess,
+  receiveDependencyScanningDiffError,
   fetchDependencyScanningDiff,
   setDastDiffEndpoint,
   receiveDastDiffSuccess,
+  receiveDastDiffError,
   fetchDastDiff,
 } from 'ee/vue_shared/security_reports/store/actions';
 import * as types from 'ee/vue_shared/security_reports/store/mutation_types';
@@ -1636,6 +1639,23 @@ describe('security reports actions', () => {
     });
   });
 
+  describe('receiveSastContainerDiffError', () => {
+    it('should commit container diff error mutation', done => {
+      testAction(
+        receiveSastContainerDiffError,
+        undefined,
+        mockedState,
+        [
+          {
+            type: types.RECEIVE_SAST_CONTAINER_DIFF_ERROR,
+          },
+        ],
+        [],
+        done,
+      );
+    });
+  });
+
   describe('fetchSastContainerDiff', () => {
     const diff = { vulnerabilities: [] };
 
@@ -1698,7 +1718,7 @@ describe('security reports actions', () => {
               type: 'requestSastContainerReports',
             },
             {
-              type: 'receiveSastContainerError',
+              type: 'receiveSastContainerDiffError',
             },
           ],
           done,
@@ -1727,7 +1747,7 @@ describe('security reports actions', () => {
               type: 'requestSastContainerReports',
             },
             {
-              type: 'receiveSastContainerError',
+              type: 'receiveSastContainerDiffError',
             },
           ],
           done,
@@ -1776,6 +1796,23 @@ describe('security reports actions', () => {
     });
   });
 
+  describe('receiveDependencyScanningDiffError', () => {
+    it('should commit dependency scanning diff error mutation', done => {
+      testAction(
+        receiveDependencyScanningDiffError,
+        undefined,
+        mockedState,
+        [
+          {
+            type: types.RECEIVE_DEPENDENCY_SCANNING_DIFF_ERROR,
+          },
+        ],
+        [],
+        done,
+      );
+    });
+  });
+
   describe('fetchDependencyScanningDiff', () => {
     const diff = { foo: {} };
 
@@ -1838,7 +1875,7 @@ describe('security reports actions', () => {
               type: 'requestDependencyScanningReports',
             },
             {
-              type: 'receiveDependencyScanningError',
+              type: 'receiveDependencyScanningDiffError',
             },
           ],
           done,
@@ -1867,7 +1904,7 @@ describe('security reports actions', () => {
               type: 'requestDependencyScanningReports',
             },
             {
-              type: 'receiveDependencyScanningError',
+              type: 'receiveDependencyScanningDiffError',
             },
           ],
           done,
@@ -1916,6 +1953,23 @@ describe('security reports actions', () => {
     });
   });
 
+  describe('receiveDastDiffError', () => {
+    it('should commit dast diff error mutation', done => {
+      testAction(
+        receiveDastDiffError,
+        undefined,
+        mockedState,
+        [
+          {
+            type: types.RECEIVE_DAST_DIFF_ERROR,
+          },
+        ],
+        [],
+        done,
+      );
+    });
+  });
+
   describe('fetchDastDiff', () => {
     const diff = { foo: {} };
 
@@ -1978,7 +2032,7 @@ describe('security reports actions', () => {
               type: 'requestDastReports',
             },
             {
-              type: 'receiveDastError',
+              type: 'receiveDastDiffError',
             },
           ],
           done,
@@ -2007,7 +2061,7 @@ describe('security reports actions', () => {
               type: 'requestDastReports',
             },
             {
-              type: 'receiveDastError',
+              type: 'receiveDastDiffError',
             },
           ],
           done,
-- 
GitLab