Scrolling behavior needs improvement

[Markieta]

Some issues/enhancement requests regarding the scrolling behavior:

• Smooth scrolling is choppy in Chrome (works in Firefox).
• Left navbar buttons should scroll to the top of div instead of the middle.
• Left navbar sometimes incorrectly highlighting (e.g., Item 2 when at the top).
• Left navbar should follow as you scroll and have a separate scrolling section.

Chrome: Version 120.0.6099.71 (Official Build) (64-bit)

Screencast.from.2023-12-13.15-02-46.webm

[ralgozino]

Hi Christopher! thanks for the detailed feedback!

Smooth scrolling is choppy in Chrome (works in Firefox).

I can't reproduce this on the Chrome Version 120.0.6099.199 (Official Build) (x86_64) and macos, nor have noticed it on previous versions. Is there anything particular about your setup that we should consider?

Left navbar buttons should scroll to the top of div instead of the middle.

This is a known issue that we completely forgot about. When the content is small it is acceptable, but when the content to be shown is large (like in your case) this is a bug.

Left navbar sometimes incorrectly highlighting (e.g., Item 2 when at the top).

We'll try to reproduce this, if you have some examples at hand that would be great.

Left navbar should follow as you scroll and have a separate scrolling section.

This is a nice feature, I think we've discussed this in the past but I can't remember why we did not do it.

cc @Al-Pragliola

[Markieta]

I can't reproduce this on the Chrome Version 120.0.6099.199 (Official Build) (x86_64) and macos, nor have noticed it on previous versions. Is there anything particular about your setup that we should consider?

I'm seeing this in Chrome on Fedora 38, Android 13, (Windows I think I tested before), and colleagues on macOS are experiencing the same hiccuping.

Was wondering if this was happening due to the number of constraints we have added or having constraintViolationsLimit: 200, but I also noticed this behavior on /constrainttemplates/ which may be similar to your setup if you're loading in all of the Gatekeeper library templates.

If it helps, I am loading in various, if not all constraints from the following:

• general
• cis-k8s-v1.5.1
• psp-v2022
• pss-baseline-v2022
• pss-restricted-v2022

We'll try to reproduce this, if you have some examples at hand that would be great.

You can see at the beginning of the video (top of page) it is still highlighting constraint #2 (psp-automount-se...), but if I'm at the top I'd expect it to highlight the first constraint. I suspect this could be related to the div centering issue.