1 files changed, 8 insertions, 4 deletions
diff --git a/app/assets/javascripts/new_commit_form.js b/app/assets/javascripts/new_commit_form.js
index 747f693726e..ad36f08840d 100644
--- a/app/assets/javascripts/new_commit_form.js
+++ b/app/assets/javascripts/new_commit_form.js
@@ -3,19 +3,23 @@
   var bind = function(fn, me) { return function() { return fn.apply(me, arguments); }; };
 
   this.NewCommitForm = (function() {
-    function NewCommitForm(form) {
+    function NewCommitForm(form, targetBranchName = 'target_branch') {
+      this.form = form;
+      this.targetBranchName = targetBranchName;
       this.renderDestination = bind(this.renderDestination, this);
-      this.newBranch = form.find('.js-target-branch');
+      this.targetBranchDropdown = form.find('button.js-target-branch');
       this.originalBranch = form.find('.js-original-branch');
       this.createMergeRequest = form.find('.js-create-merge-request');
       this.createMergeRequestContainer = form.find('.js-create-merge-request-container');
+      this.targetBranchDropdown.on('change.branch', this.renderDestination);
       this.renderDestination();
-      this.newBranch.keyup(this.renderDestination);
     }
 
     NewCommitForm.prototype.renderDestination = function() {
       var different;
-      different = this.newBranch.val() !== this.originalBranch.val();
+      var targetBranch = this.form.find(`input[name="${this.targetBranchName}"]`);
+
+      different = targetBranch.val() !== this.originalBranch.val();
       if (different) {
         this.createMergeRequestContainer.show();
         if (!this.wasDifferent) {