Merge request reviews have terrible UX on self-hosted GitLab-CE
Summary
When adding review comments (at least one), the buttons for "Discard review" and "Finish review" are stuck at the very bottom of the page, while GitLab.com has them sticky at the bottom of the window (always in sight).
When clicking "Finish review", the popup opens towards the bottom (which is outside the scrolled page region), while GitLab.com has it expanding to the top.
The opened popup has two scrollbars; one outside that scrolls the "Submit review" button out of view and another that scrolls the individual entries. On GitLab.com, individual entries are more compact and don't require a scrollbar with the steps to reproduce below.
I was hoping this was only a temporary thing as GitLab.com already had better UX with 13.2, but even after upgrading to 13.3 the behavior still stuck around; so I'm thinking something isn't quite right there.
Steps to reproduce
- Open a Merge Request (either on self-hosted GitLab-CE or on GitLab.com) and switch to the "Changes" tab to review code.
- Click a changed line (so the comment box appears), add a semi-long text (for example the first paragraph of Lorem Ipsum) and click "Start a review".
- Click another changed line and add another semi-long text, then click "Add to review".
- Repeat step 3 a bunch of times to get a semi-useful review that isn't just a few words.
- Click "Finish review" on one of the comments
- On self-hosted GitLab-CE, this scrolls to the bottom of the page and expands the "Finish review" popup; which is out of view
- On GitLab.com, this simply opens the already stickied "Finish review" popup, expanding towards the top.
Example Project
Any project seems to work on GitLab.com, I've used the current project. My self-hosted GitLab-CE is not publicly available, so I can't really link to it.
What is the current bug behavior?
On self-hosted GitLab-CE, the review is stuck at the bottom of the page, and goes even further down when expanded:
What is the expected correct behavior?
On GitLab.com, the reviews are stickied at the bottom of the window, regardless of scroll position, and expand to the top:
Relevant logs and/or screenshots
(Paste any relevant logs - please use code blocks (```) to format console output, logs, and code as it's tough to read otherwise.)
Output of checks
(If you are reporting a bug on GitLab.com, write: This bug happens on GitLab.com)
Results of GitLab environment info
Expand for output related to GitLab environment info
root@gitlab:~# gitlab-rake gitlab:env:info System information System: Debian 10 Current User: git Using RVM: no Ruby Version: 2.6.6p146 Gem Version: 2.7.10 Bundler Version:1.17.3 Rake Version: 12.3.3 Redis Version: 5.0.9 Git Version: 2.28.0 Sidekiq Version:5.2.9 Go Version: unknown GitLab information Version: 13.3.0 Revision: 9119206b6e8 Directory: /opt/gitlab/embedded/service/gitlab-rails DB Adapter: PostgreSQL DB Version: 11.7 URL: https://gitlab HTTP Clone URL: https://gitlab/some-group/some-project.git SSH Clone URL: git@gitlab:some-group/some-project.git Using LDAP: yes Using Omniauth: yes Omniauth Providers: GitLab Shell Version: 13.6.0 Repository storage paths: - default: /var/opt/gitlab/git-data/repositories GitLab Shell path: /opt/gitlab/embedded/service/gitlab-shell Git: /opt/gitlab/embedded/bin/git
Results of GitLab application Check
Expand for output related to the GitLab application check
root@gitlab:~# gitlab-rake gitlab:check SANITIZE=true Checking GitLab subtasks ...Checking GitLab Shell ...
GitLab Shell: ... GitLab Shell version >= 13.6.0 ? ... OK (13.6.0) Running /opt/gitlab/embedded/service/gitlab-shell/bin/check Internal API available: OK Redis available via internal API: OK gitlab-shell self-check successful
Checking GitLab Shell ... Finished
Checking Gitaly ...
Gitaly: ... default ... OK
Checking Gitaly ... Finished
Checking Sidekiq ...
Sidekiq: ... Running? ... yes Number of Sidekiq processes ... 1
Checking Sidekiq ... Finished
Checking Incoming Email ...
Incoming Email: ... Reply by email is disabled in config/gitlab.yml
Checking Incoming Email ... Finished
Checking LDAP ...
LDAP: ... Server: ldapmain not verifying SSL hostname of LDAPS server 'dc-01.domain.tld:389' LDAP authentication... Success LDAP users with access to your GitLab server (only showing the first 100 results) User output sanitized. Found 100 users of 100 limit.
Checking LDAP ... Finished
Checking GitLab App ...
Git configured correctly? ... yes Database config exists? ... yes All migrations up? ... yes Database contains orphaned GroupMembers? ... no GitLab config exists? ... yes GitLab config up to date? ... yes Log directory writable? ... yes Tmp directory writable? ... yes Uploads directory exists? ... yes Uploads directory has correct permissions? ... yes Uploads directory tmp has correct permissions? ... yes Init script exists? ... skipped (omnibus-gitlab has no init script) Init script up-to-date? ... skipped (omnibus-gitlab has no init script) Projects have namespace: ... 3/2 ... yes 4/3 ... yes 4/4 ... yes 5/5 ... yes 8/6 ... yes 8/7 ... yes 8/8 ... yes 5/9 ... yes 12/10 ... yes 8/11 ... yes 17/12 ... yes 19/13 ... yes 8/15 ... yes 31/16 ... yes 31/18 ... yes 31/19 ... yes 31/20 ... yes 4/21 ... yes 8/23 ... yes 34/24 ... yes 34/25 ... yes 34/26 ... yes 34/27 ... yes 34/28 ... yes 8/29 ... yes 35/30 ... yes 35/31 ... yes 35/32 ... yes 35/33 ... yes 34/34 ... yes 34/35 ... yes Redis version >= 4.0.0? ... yes Ruby version >= 2.5.3 ? ... yes (2.6.6) Git version >= 2.24.0 ? ... yes (2.28.0) Git user has default SSH configuration? ... yes Active users: ... 22 Is authorized keys file accessible? ... yes GitLab configured to store new projects in hashed storage? ... yes All projects are in hashed storage? ... yes
Checking GitLab App ... Finished
Checking GitLab subtasks ... Finished
Possible fixes
(If you can, link to the line of code that might be responsible for the problem)