Skip to content

Refactor jQuery dropdown implementation to GitLab UI GlDropdown in issue_status_select.js

What does this MR do?

As per title! To achieve this, we do a few things:

  • create a new directory app/assets/javascripts/issuable_bulk_update_sidebar/, and move related files to this directory
  • replace drop-related HAML with .js-issue-status. Our new Vue component mounts on this element.
  • create a new Vue component issue_select.vue (and delete the old app/assets/javascripts/issue_status_select.js)
  • update specs as necessary (to use :js and use click_button instead of click_link)

Screenshots (strongly suggested)

Video demonstrates that functionality is unaffected:

issue_update

State Before After
Default Screen_Shot_2021-06-15_at_2.33.28_pm Screen_Shot_2021-06-15_at_2.59.01_pm
Dropdown open Screen_Shot_2021-06-15_at_2.33.13_pm Screen_Shot_2021-06-15_at_2.59.16_pm
Value Selected Screen_Shot_2021-06-15_at_2.33.37_pm Screen_Shot_2021-06-15_at_2.59.25_pm

Does this MR meet the acceptance criteria?

Conformity

Availability and Testing

Security

Does this MR contain changes to processing or storing of credentials or tokens, authorization and authentication methods or other items described in the security review guidelines? If not, then delete this Security section.

  • Label as security and @ mention @gitlab-com/gl-security/appsec
  • The MR includes necessary changes to maintain consistency between UI, API, email, or other methods
  • Security reports checked/validated by a reviewer from the AppSec team

Related to #284693 (closed)

Edited by Tom Quirk

Merge request reports