"Resolve conflicts" button popover does not show
Summary
There is a Bootstrap popover used with disabled gl-button
and it does not work. Implementation does not follow https://getbootstrap.com/docs/4.4/components/popovers/#disabled-elements - pointer-events: none;
is missing from the button. Adding this style causes another issue - cursor no longer changes to not-allowed
. Probably this could be resolved by changing the UX - use another way (than a popover) of informing the user about the reason of button being disabled.
Steps to reproduce
- Create merge request with conflict and protected source branch.
- Mouse enter disabled "Resolve conflicts" button.
Example Project
https://gitlab.com/marcinmajkowski/gitlab/-/merge_requests/1
What is the current bug behavior?
Popover does not show. User is not informed why "Resolve conflicts" is disabled.
What is the expected correct behavior?
User is informed why "Resolve conflicts" is disabled.
Relevant logs and/or screenshots
The popover and the button with pointer-events
workaround applied.
Output of checks
This bug happens on GitLab.com.
Results of GitLab environment info
Expand for output related to GitLab environment info
(For installations with omnibus-gitlab package run and paste the output of: `sudo gitlab-rake gitlab:env:info`) (For installations from source run and paste the output of: `sudo -u git -H bundle exec rake gitlab:env:info RAILS_ENV=production`)
Results of GitLab application Check
Expand for output related to the GitLab application check
(For installations with omnibus-gitlab package run and paste the output of:
sudo gitlab-rake gitlab:check SANITIZE=true
)(For installations from source run and paste the output of:
sudo -u git -H bundle exec rake gitlab:check RAILS_ENV=production SANITIZE=true
)(we will only investigate if the tests are passing)
Possible fixes
The file is app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_conflicts.vue
. UX can be changed to present same information differently. Pajamas popover could be used instead of Bootstraps (see https://gitlab.com/gitlab-org/gitlab/-/issues/227257) but only if it already works with disabled gl-button
.