Skip to content

Add inline Drawer to inline findings popover

What does this MR do and why?

This MR refactors the inline-findings Drawer from the inline-findings components to the inline-findings dropdown components. It removes the code_quality_inline_drawer flag and ties the behaviour to the sast_reports_in_inline_diff flag.

Rollout Issue to close once this MR is merged: #397037 (closed)

Screenshots or screen recordings

After

with sast_reports_in_inline_diff false
both_flags_false_after
with sast_reports_in_inline_diff true
both_flags_true_after

Before

with code_quality_inline_drawer false and sast_reports_in_inline_diff false
salst_false_drawer_false_before
with code_quality_inline_drawer true and sast_reports_in_inline_diff true
sast_true_drawer_true_before
with code_quality_inline_drawer true and sast_reports_in_inline_diff false
sast_false_drawer_true_before
with code_quality_inline_drawer false and sast_reports_in_inline_diff true
sast_true_drawer_false_before

How to set up and validate locally

  1. Clone this repo: https://gitlab.com/jannik_lehmann/sast-inline-findings-example
  2. Recreate this MR: jannik_lehmann/sast-inline-findings-example!1 (merged)
  3. Let the Pipeline finish and see the Security findings in action
  4. Clone this repo: https://gitlab.com/jannik_lehmann/code-quality-test
  5. Recreate this MR: jannik_lehmann/code-quality-test!4 (diffs)
  6. Let the pipeline finish and see that the CodeQuality Findings are still working.
  7. Enable this flag: sast_reports_in_inline_diff
  8. Apply the patch below
  9. Go to recreated MR, see CQ and (mocked)-Security finding on same line
diff --git a/app/assets/javascripts/diffs/index.js b/app/assets/javascripts/diffs/index.js
index b9cf26827f26..f487574edcf9 100644
--- a/app/assets/javascripts/diffs/index.js
+++ b/app/assets/javascripts/diffs/index.js
@@ -32,7 +32,8 @@ export default function initDiffsApp(store = notesStore) {
       return {
         endpointCoverage: dataset.endpointCoverage || '',
         endpointCodequality: dataset.endpointCodequality || '',
-        endpointSast: dataset.endpointSast || '',
+        // endpointSast: dataset.endpointSast || '',
+        endpointSast: 'mockedEndpoint',
         helpPagePath: dataset.helpPagePath,
         currentUser: JSON.parse(dataset.currentUserData) || {},
         changesEmptyStateIllustration: dataset.changesEmptyStateIllustration,
diff --git a/ee/app/assets/javascripts/diffs/store/actions.js b/ee/app/assets/javascripts/diffs/store/actions.js
index 3c91c1fc3482..b70aac7b3976 100644
--- a/ee/app/assets/javascripts/diffs/store/actions.js
+++ b/ee/app/assets/javascripts/diffs/store/actions.js
@@ -100,6 +100,23 @@ export const setGenerateTestFilePath = ({ commit }, path) =>
   commit(types.SET_GENERATE_TEST_FILE_PATH, path);
 
 export const fetchSast = ({ commit, state, dispatch }) => {
+  commit(types.SET_SAST_DATA, {
+    added: [
+      {
+        severity: "medium",
+        description:
+          "Markup escaping disabled. This can be used with some template engines to escape\ndisabling of HTML entities, which can lead to XSS attacks.\n",
+        location: {
+          file: "noise.rb",
+          start_line: 7,
+        },
+      },
+    ],
+    fixed: [],
+  });
+
+  return;
+
   let retryCount = 0;
   sastPoll = new Poll({
     resource: {

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Jannik Lehmann

Merge request reports