Fix createAlert not showing as sticky
The following discussion from !163612 (merged) should be addressed:
-
@justin_ho started a discussion: (+4 comments) I stumbled upon this change while testing a feature and looking at the history around flash messages.
I think this change caused an issue with
createAlertto not applyposition: stickyproperly. WhencreateAlertis called and the user is not on the top of the page (they scrolled down), the alert should show on the top of the page below the header. This isn't the case now as alerts only show when you scroll to the top of the page (see video).Screen_Recording_2024-09-26_at_16.55.11
For the alert (flash message) to be sticky again, it needs to be a sibling of the main content (like the before change here).
Since @seggenberger is on PTO, maybe @aregnery can you have a look (or tag someone who can)?
How to replicate
- Go to Admin > Overview > Groups. For example,
http://127.0.0.1:3000/admin/groups. - Find any group and select Edit. For example,
http://127.0.0.1:3000/admin/groups/Commit451/gitlab-instance-cef261fc11/edit. - Apply the following diff to force show alerts:
diff --git a/app/assets/javascripts/groups/components/group_name_and_path.vue b/app/assets/javascripts/groups/components/group_name_and_path.vue
index 06eaaa4eb50c..144171ad44db 100644
--- a/app/assets/javascripts/groups/components/group_name_and_path.vue
+++ b/app/assets/javascripts/groups/components/group_name_and_path.vue
@@ -192,7 +192,7 @@ export default {
this.apiLoading = false;
- if (exists) {
+ if (true) {
if (suggests.length) {
return Promise.resolve({ exists, suggests });
}
-
(IMPORTANT) Scroll down so you are not at the very top but can still see the
Group URLfield, then change the fieldGroup URLand add any characters. - Scroll up to observe that there is an error (alert) created but it doesn't stick on top of content.