Fix custom protected branch pattern jumping scroll position to top

Fixes https://gitlab.com/gitlab-org/gitlab-ce/issues/30149

Use more semantic `<button>` element and prevent the form from
submitting.

1 files changed, 5 insertions, 3 deletions

diff --git a/app/assets/javascripts/protected_branches/protected_branch_dropdown.js b/app/assets/javascripts/protected_branches/protected_branch_dropdown.js
index 5cf28aa7a73..1d4bb8a13d6 100644
--- a/app/assets/javascripts/protected_branches/protected_branch_dropdown.js
+++ b/app/assets/javascripts/protected_branches/protected_branch_dropdown.js
@@ -6,7 +6,7 @@ class ProtectedBranchDropdown {
     this.$dropdown = options.$dropdown;
     this.$dropdownContainer = this.$dropdown.parent();
     this.$dropdownFooter = this.$dropdownContainer.find('.dropdown-footer');
-    this.$protectedBranch = this.$dropdownContainer.find('.create-new-protected-branch');
+    this.$protectedBranch = this.$dropdownContainer.find('.js-create-new-protected-branch');
 
     this.buildDropdown();
     this.bindEvents();
@@ -46,7 +46,9 @@ class ProtectedBranchDropdown {
     this.$protectedBranch.on('click', this.onClickCreateWildcard.bind(this));
   }
 
-  onClickCreateWildcard() {
+  onClickCreateWildcard(e) {
+    e.preventDefault();
+
     // Refresh the dropdown's data, which ends up calling `getProtectedBranches`
     this.$dropdown.data('glDropdown').remote.execute();
     this.$dropdown.data('glDropdown').selectRowAtIndex();
@@ -69,7 +71,7 @@ class ProtectedBranchDropdown {
 
     if (branchName) {
       this.$dropdownContainer
-        .find('.create-new-protected-branch code')
+        .find('.js-create-new-protected-branch code')
         .text(branchName);
     }