Skip to content
Snippets Groups Projects

Fix sticky header on vulnerability reports

What does this MR do and why?

Fix sticky th on pipeline and instance vuln report

This commit fixes the sticky positioning of the table hader on both the pipeline- and instance-level vulnerability reports.

Changelog: fixed EE: true

Screenshots or screen recordings

Pipeline

Before After
Screen_Recording_2023-12-11_at_8.46.52_am Screen_Recording_2023-12-11_at_8.45.28_am

Instance

Before After
Screen_Recording_2023-12-11_at_8.48.02_am Screen_Recording_2023-12-11_at_9.04.01_am

How to set up and validate locally

  1. Navigate to your instance's vulnerability report (e.g.: http://gdk.test:3000/-/security/vulnerabilities)
  2. Select one or more vulnerabilities via the checkbox
  3. Scroll down and verify that the sticky header is positioned correctly
  4. Enable FF: echo "Feature.enable(:pipeline_security_dashboard_graphql)" | rails c
  5. Navigate to a pipeline's vulnerability report
  6. Repeat steps 2 and 3

MR acceptance checklist

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

Related to #431951 (closed)

Edited by Lorenz van Herwaarden

Merge request reports

Loading
Loading

Activity

Filter activity
  • Approvals
  • Assignees & reviewers
  • Comments (from bots)
  • Comments (from users)
  • Commits & branches
  • Edits
  • Labels
  • Lock status
  • Mentions
  • Merge request status
  • Tracking
  • Bundle size analysis [beta]

    This compares changes in bundle size for entry points between the commits 3667fc4e and 5ffee589

    :sparkles: Special assets

    Entrypoint / Name Size before Size after Diff Diff in percent
    average 4.09 MB 4.09 MB - 0.0 %
    mainChunk 3.05 MB 3.05 MB - 0.0 %

    Note: We do not have exact data for 3667fc4e. So we have used data from: 9562ebbb.
    The intended commit has no webpack pipeline, so we chose the last commit with one before it.

    Please look at the full report for more details


    Read more about how this report works.

    Generated by :no_entry_sign: Danger

    Edited by Ghost User
  • 89 90 // The checkboxes use z-index: 1, so we need to place the headers higher so that the checkboxes
    90 91 // don't show on top of the headers when scrolling down.
    91 92 @include gl-z-index-2;
    92 top: calc(#{$calc-application-header-height} + var(--security-filter-height));
    93 top: calc(#{$calc-application-header-height} + var(--security-filter-height) + var(--group-by-selection-height));
    93 94 // Need to use an inset box-shadow here for the bottom border because position: sticky will hide
    94 95 // any borders once the table headers become sticky.
    95 96 box-shadow: inset 0 -1px $gray-100;
    96 97 }
    97 98
    98 99 thead.below-selection-summary th {
    99 top: calc(#{$calc-application-header-height} + var(--security-filter-height) + #{$selection-summary-height});
    100 top: calc(#{$calc-application-header-height} + var(--security-filter-height) + #{$selection-summary-height} + var(--group-by-selection-height) );
  • David Pisek added 1 commit

    added 1 commit

    Compare with previous version

  • David Pisek added 1 commit

    added 1 commit

    • 76cc28c0 - Fix sticky th on pipeline and instance vuln report

    Compare with previous version

  • David Pisek added 1 commit

    added 1 commit

    • cb52ff47 - Fix sticky th on pipeline and instance vuln report

    Compare with previous version

  • David Pisek
  • David Pisek
  • David Pisek
  • Allure report

    allure-report-publisher generated test report!

    e2e-test-on-gdk: :white_check_mark: test report for 5ffee589

    expand test summary
    +-----------------------------------------------------------------------+
    |                            suites summary                             |
    +------------------+--------+--------+---------+-------+-------+--------+
    |                  | passed | failed | skipped | flaky | total | result |
    +------------------+--------+--------+---------+-------+-------+--------+
    | Plan             | 55     | 0      | 0       | 0     | 55    | ✅     |
    | Data Stores      | 23     | 0      | 0       | 0     | 23    | ✅     |
    | Verify           | 31     | 0      | 0       | 0     | 31    | ✅     |
    | Govern           | 57     | 0      | 0       | 0     | 57    | ✅     |
    | Create           | 54     | 0      | 7       | 0     | 61    | ✅     |
    | Release          | 5      | 0      | 0       | 0     | 5     | ✅     |
    | Analytics        | 2      | 0      | 0       | 0     | 2     | ✅     |
    | Monitor          | 8      | 0      | 0       | 0     | 8     | ✅     |
    | Manage           | 0      | 0      | 1       | 0     | 1     | ➖     |
    | Package          | 0      | 0      | 1       | 0     | 1     | ➖     |
    | Framework sanity | 0      | 0      | 1       | 0     | 1     | ➖     |
    +------------------+--------+--------+---------+-------+-------+--------+
    | Total            | 235    | 0      | 10      | 0     | 245   | ✅     |
    +------------------+--------+--------+---------+-------+-------+--------+

    e2e-package-and-test: :x: test report for 5ffee589

    expand test summary
    +-----------------------------------------------------------------------+
    |                            suites summary                             |
    +------------------+--------+--------+---------+-------+-------+--------+
    |                  | passed | failed | skipped | flaky | total | result |
    +------------------+--------+--------+---------+-------+-------+--------+
    | Govern           | 292    | 0      | 23      | 3     | 315   | ❗     |
    | Create           | 140    | 1      | 14      | 0     | 155   | ❌     |
    | Plan             | 4      | 0      | 0       | 0     | 4     | ✅     |
    | Package          | 0      | 0      | 1       | 0     | 1     | ➖     |
    | Framework sanity | 0      | 0      | 1       | 0     | 1     | ➖     |
    | Monitor          | 4      | 0      | 0       | 0     | 4     | ✅     |
    | Data Stores      | 2      | 0      | 0       | 0     | 2     | ✅     |
    +------------------+--------+--------+---------+-------+-------+--------+
    | Total            | 442    | 1      | 39      | 3     | 482   | ❌     |
    +------------------+--------+--------+---------+-------+-------+--------+

    e2e-review-qa: :white_check_mark: test report for 5ffee589

    expand test summary
    +-----------------------------------------------------------------------+
    |                            suites summary                             |
    +------------------+--------+--------+---------+-------+-------+--------+
    |                  | passed | failed | skipped | flaky | total | result |
    +------------------+--------+--------+---------+-------+-------+--------+
    | Govern           | 51     | 0      | 2       | 0     | 53    | ✅     |
    | Create           | 6      | 0      | 4       | 0     | 10    | ✅     |
    | Plan             | 3      | 0      | 1       | 0     | 4     | ✅     |
    | Monitor          | 4      | 0      | 0       | 0     | 4     | ✅     |
    | Package          | 0      | 0      | 1       | 0     | 1     | ➖     |
    | Framework sanity | 0      | 0      | 1       | 0     | 1     | ➖     |
    | Data Stores      | 2      | 0      | 0       | 0     | 2     | ✅     |
    +------------------+--------+--------+---------+-------+-------+--------+
    | Total            | 66     | 0      | 9       | 0     | 75    | ✅     |
    +------------------+--------+--------+---------+-------+-------+--------+
    Edited by Ghost User
  • David Pisek added 489 commits

    added 489 commits

    Compare with previous version

  • David Pisek added 1 commit

    added 1 commit

    • 5ffee589 - Fix sticky header on vulnerability reports

    Compare with previous version

  • David Pisek changed title from Draft: Fix sticky th on pipeline and instance vuln report to Draft: Fix sticky header on vulnerability reports

    changed title from Draft: Fix sticky th on pipeline and instance vuln report to Draft: Fix sticky header on vulnerability reports

  • David Pisek changed the description

    changed the description

  • David Pisek changed the description

    changed the description

  • Loading
  • Loading
  • Loading
  • Loading
  • Loading
  • Loading
  • Loading
  • Loading
  • Loading
  • Loading
  • Please register or sign in to reply
    Loading