Use the `GLDropdown` component to select protected branches.

1. Modify the component to support a callback for every key press in the
   filter. We need this so we can update the "Create: <branch_name"
   label.

2. Modify the component to use `$(<selector>).first().click()` instead
   of `$(selector)[0].click()`, because the latter is non-standard, and
   doesn't work in PhantomJS.

1 files changed, 3 insertions, 1 deletions

diff --git a/spec/features/protected_branches_spec.rb b/spec/features/protected_branches_spec.rb
index 9a552e93c24..d94dee0c797 100644
--- a/spec/features/protected_branches_spec.rb
+++ b/spec/features/protected_branches_spec.rb
@@ -7,7 +7,9 @@ feature 'Projected Branches', feature: true, js: true do
   before { login_as(user) }
 
   def set_protected_branch_name(branch_name)
-    page.execute_script("$('#protected_branch_name').val('#{branch_name}')")
+    find(".js-protected-branch-select").click
+    find(".dropdown-input-field").set(branch_name)
+    click_on "Create Protected Branch: #{branch_name}"
   end
 
   describe "explicit protected branches" do