From 1834146d470d9b1ca26afa9d98c719f742334c0c Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Tue, 17 May 2016 14:03:00 +0100
Subject: [PATCH 1/4] Added dropdown on branches list

---
 .../stylesheets/framework/dropdowns.scss      |  4 +-
 app/assets/stylesheets/framework/lists.scss   |  4 ++
 app/assets/stylesheets/pages/projects.scss    |  4 ++
 .../projects/branches_controller.rb           | 13 +++++
 app/views/projects/branches/_branch.html.haml | 32 +++++++++--
 app/views/projects/branches/index.html.haml   | 57 +++++++++----------
 config/routes.rb                              |  4 +-
 7 files changed, 80 insertions(+), 38 deletions(-)

diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss
index d4d579a083d6..d61f6c91d8db 100644
--- a/app/assets/stylesheets/framework/dropdowns.scss
+++ b/app/assets/stylesheets/framework/dropdowns.scss
@@ -119,7 +119,7 @@
     background-color: $dropdown-divider-color;
   }
 
-  a {
+  a:not(.btn) {
     display: block;
     position: relative;
     padding: 5px 10px;
@@ -238,7 +238,7 @@
 }
 
 .dropdown-menu-selectable {
-  a {
+  a:not(.btn) {
     padding-left: 25px;
 
     &.is-indeterminate, &.is-active {
diff --git a/app/assets/stylesheets/framework/lists.scss b/app/assets/stylesheets/framework/lists.scss
index b34ec16cdbab..6c9547119f9d 100644
--- a/app/assets/stylesheets/framework/lists.scss
+++ b/app/assets/stylesheets/framework/lists.scss
@@ -148,6 +148,10 @@ ul.content-list {
           margin-right: 0;
         }
       }
+
+      .btn:not(.branch-delete-button) {
+        padding: 10px 14px;
+      }
     }
 
     // When dragging a list item
diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss
index bb2509042557..d4ebe38aac97 100644
--- a/app/assets/stylesheets/pages/projects.scss
+++ b/app/assets/stylesheets/pages/projects.scss
@@ -604,3 +604,7 @@ pre.light-well {
     }
   }
 }
+
+.branch-delete-button {
+  display: block;
+}
diff --git a/app/controllers/projects/branches_controller.rb b/app/controllers/projects/branches_controller.rb
index dd9508da0491..8109531b149e 100644
--- a/app/controllers/projects/branches_controller.rb
+++ b/app/controllers/projects/branches_controller.rb
@@ -54,6 +54,19 @@ def destroy
     end
   end
 
+  def update_status
+    if params[:protected_branch]
+      branch = @project.protected_branches.new
+      branch.name = params[:id]
+      branch.save
+    else
+      @project.protected_branches.find(params[:id]).destroy
+    end
+
+    redirect_to namespace_project_branches_path(@project.namespace,
+                                                          @project)
+  end
+
   private
 
   def ref
diff --git a/app/views/projects/branches/_branch.html.haml b/app/views/projects/branches/_branch.html.haml
index 87c732626a67..7f9d13e60272 100644
--- a/app/views/projects/branches/_branch.html.haml
+++ b/app/views/projects/branches/_branch.html.haml
@@ -20,16 +20,38 @@
         protected
     .controls.hidden-xs
       - if create_mr_button?(@repository.root_ref, branch.name)
-        = link_to create_mr_path(@repository.root_ref, branch.name), class: 'btn btn-grouped btn-xs' do
+        = link_to create_mr_path(@repository.root_ref, branch.name), class: 'btn btn-default btn-grouped btn-xs' do
+          = icon('plus')
           Merge Request
 
       - if branch.name != @repository.root_ref
-        = link_to namespace_project_compare_index_path(@project.namespace, @project, from: @repository.root_ref, to: branch.name), class: 'btn btn-grouped btn-xs', method: :post, title: "Compare" do
+        = link_to namespace_project_compare_index_path(@project.namespace, @project, from: @repository.root_ref, to: branch.name), class: 'btn btn-default btn-grouped btn-xs', method: :post, title: "Compare" do
+          = icon("exchange")
           Compare
 
-      - if can_remove_branch?(@project, branch.name)
-        = link_to namespace_project_branch_path(@project.namespace, @project, branch.name), class: 'btn btn-grouped btn-xs btn-remove remove-row has-tooltip', title: "Delete branch", method: :delete, data: { confirm: "Deleting the '#{branch.name}' branch cannot be undone. Are you sure?", container: 'body' }, remote: true do
-          = icon("trash-o")
+      - if can? current_user, :admin_project, @project
+        .dropdown.inline
+          %button.btn.btn-default.btn-xs{ type: "button", data: { toggle: "dropdown" } }
+            %span.sr-only Settings
+            = icon("gear")
+            %span.caret
+          .dropdown-menu.dropdown-menu-selectable.dropdown-menu-align-right
+            %ul
+              %li.dropdown-header Settings
+              %li
+                = link_to "Protected", namespace_project_branch_update_status_path(@project.namespace, @project, branch.name, protected_branch: true), method: :post, class: ("is-active" if @project.protected_branch? branch.name)
+              %li
+                = link_to "Unprotected", namespace_project_branch_update_status_path(@project.namespace, @project, branch.name), method: :post, class: ("is-active" if !@project.protected_branch? branch.name)
+              - if can_remove_branch?(@project, branch.name)
+                %li.divider
+                %li
+                  = link_to namespace_project_branch_path(@project.namespace, @project, branch.name), class: "btn btn-warning branch-delete-button block", title: "Delete branch", method: :delete, data: { confirm: "Deleting the '#{branch.name}' branch cannot be undone. Are you sure?" }, remote: true do
+                    Delete branch
+              - else
+                %li.divider
+                %li
+                  %a{ href: "#", class: ("is-active" if @project.developers_can_push_to_protected_branch?(branch.name)) }
+                    Developers can push
 
     - if branch.name != @repository.root_ref
       .divergence-graph{ title: "#{number_commits_ahead} commits ahead, #{number_commits_behind} commits behind #{@repository.root_ref}" }
diff --git a/app/views/projects/branches/index.html.haml b/app/views/projects/branches/index.html.haml
index e0367c40272b..8a14be93b26b 100644
--- a/app/views/projects/branches/index.html.haml
+++ b/app/views/projects/branches/index.html.haml
@@ -1,34 +1,31 @@
 - @no_container = true
 - page_title "Branches"
-= render "projects/commits/head"
-
-%div{ class: (container_class) }
-  .top-area
-    .nav-text
-      Protected branches can be managed in project settings
 
+.top-area
+  = render "projects/commits/head"
+  .nav-controls
+    .dropdown.inline
+      %button.dropdown-toggle.btn{type: 'button', 'data-toggle' => 'dropdown'}
+        %span.light
+        - if @sort.present?
+          = @sort.humanize
+        - else
+          Name
+        %b.caret
+      %ul.dropdown-menu.dropdown-menu-align-right
+        %li
+          = link_to namespace_project_branches_path(sort: nil) do
+            Name
+          = link_to namespace_project_branches_path(sort: 'recently_updated') do
+            = sort_title_recently_updated
+          = link_to namespace_project_branches_path(sort: 'last_updated') do
+            = sort_title_oldest_updated
     - if can? current_user, :push_code, @project
-      .nav-controls
-        = link_to new_namespace_project_branch_path(@project.namespace, @project), class: 'btn btn-create' do
-          New branch
-        .dropdown.inline
-          %button.dropdown-toggle.btn{type: 'button', 'data-toggle' => 'dropdown'}
-            %span.light
-            - if @sort.present?
-              = @sort.humanize
-            - else
-              Name
-            %b.caret
-          %ul.dropdown-menu.dropdown-menu-align-right
-            %li
-              = link_to namespace_project_branches_path(sort: nil) do
-                Name
-              = link_to namespace_project_branches_path(sort: 'recently_updated') do
-                = sort_title_recently_updated
-              = link_to namespace_project_branches_path(sort: 'last_updated') do
-                = sort_title_oldest_updated
-  - unless @branches.empty?
-    %ul.content-list.all-branches
-      - @branches.each do |branch|
-        = render "projects/branches/branch", branch: branch
-    = paginate @branches, theme: 'gitlab'
+      = link_to new_namespace_project_branch_path(@project.namespace, @project), class: 'btn btn-create' do
+        = icon('plus')
+        New branch
+- unless @branches.empty?
+  %ul.content-list.all-branches
+    - @branches.each do |branch|
+      = render "projects/branches/branch", branch: branch
+  = paginate @branches, theme: 'gitlab'
diff --git a/config/routes.rb b/config/routes.rb
index 95fbe7dd9df9..8695402370d9 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -688,7 +688,9 @@
           end
         end
 
-        resources :branches, only: [:index, :new, :create, :destroy], constraints: { id: Gitlab::Regex.git_reference_regex }
+        resources :branches, only: [:index, :new, :create, :destroy], constraints: { id: Gitlab::Regex.git_reference_regex } do
+          post :update_status
+        end
         resources :tags, only: [:index, :show, :new, :create, :destroy], constraints: { id: Gitlab::Regex.git_reference_regex } do
           resource :release, only: [:edit, :update]
         end
-- 
GitLab


From b9f2027d12d63da8d268ff90ee80641b67c4dd98 Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Tue, 17 May 2016 14:22:35 +0100
Subject: [PATCH 2/4] Updates branch data on post

---
 app/controllers/projects/branches_controller.rb | 10 +++++++---
 app/views/projects/branches/_branch.html.haml   |  5 +++--
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/app/controllers/projects/branches_controller.rb b/app/controllers/projects/branches_controller.rb
index 8109531b149e..df5b986aba66 100644
--- a/app/controllers/projects/branches_controller.rb
+++ b/app/controllers/projects/branches_controller.rb
@@ -55,12 +55,16 @@ def destroy
   end
 
   def update_status
-    if params[:protected_branch]
+    branch = @project.protected_branches.find(params[:branch_id])
+
+    if branch.nil?
       branch = @project.protected_branches.new
-      branch.name = params[:id]
+      branch.name = params[:branch_id]
       branch.save
     else
-      @project.protected_branches.find(params[:id]).destroy
+      if params[:protected_branch] == 'false'
+        branch.destroy
+      end
     end
 
     redirect_to namespace_project_branches_path(@project.namespace,
diff --git a/app/views/projects/branches/_branch.html.haml b/app/views/projects/branches/_branch.html.haml
index 7f9d13e60272..8d4c19104646 100644
--- a/app/views/projects/branches/_branch.html.haml
+++ b/app/views/projects/branches/_branch.html.haml
@@ -3,6 +3,7 @@
 - diverging_commit_counts = @repository.diverging_commit_counts(branch)
 - number_commits_behind = diverging_commit_counts[:behind]
 - number_commits_ahead = diverging_commit_counts[:ahead]
+- protected_branch = @project.protected_branches.find_by_name(branch.name)
 %li(class="js-branch-#{branch.name}")
   %div
     = link_to namespace_project_tree_path(@project.namespace, @project, branch.name) do
@@ -39,9 +40,9 @@
             %ul
               %li.dropdown-header Settings
               %li
-                = link_to "Protected", namespace_project_branch_update_status_path(@project.namespace, @project, branch.name, protected_branch: true), method: :post, class: ("is-active" if @project.protected_branch? branch.name)
+                = link_to "Protected", namespace_project_branch_update_status_path(@project.namespace, @project, protected_branch || branch.name, protected_branch: true), method: :post, class: ("is-active" if @project.protected_branch? branch.name)
               %li
-                = link_to "Unprotected", namespace_project_branch_update_status_path(@project.namespace, @project, branch.name), method: :post, class: ("is-active" if !@project.protected_branch? branch.name)
+                = link_to "Unprotected", namespace_project_branch_update_status_path(@project.namespace, @project, protected_branch || branch.name, protected_branch: false), method: :post, class: ("is-active" if !@project.protected_branch? branch.name)
               - if can_remove_branch?(@project, branch.name)
                 %li.divider
                 %li
-- 
GitLab


From 6259deb84f6a69338f789de93117f339c8ee43ba Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Wed, 18 May 2016 10:19:24 +0100
Subject: [PATCH 3/4] Updated to use protected branches methods

---
 app/assets/javascripts/branches.js.coffee     | 18 +++++++++++++++++
 .../stylesheets/framework/dropdowns.scss      | 10 ++++++++--
 app/assets/stylesheets/framework/nav.scss     |  3 ---
 .../projects/branches_controller.rb           | 17 ----------------
 .../projects/protected_branches_controller.rb | 20 ++++++++++++++++---
 app/views/projects/branches/_branch.html.haml | 10 +++++++---
 config/routes.rb                              |  4 +---
 features/steps/project/commits/branches.rb    |  2 +-
 8 files changed, 52 insertions(+), 32 deletions(-)
 create mode 100644 app/assets/javascripts/branches.js.coffee

diff --git a/app/assets/javascripts/branches.js.coffee b/app/assets/javascripts/branches.js.coffee
new file mode 100644
index 000000000000..1bbbdb3443af
--- /dev/null
+++ b/app/assets/javascripts/branches.js.coffee
@@ -0,0 +1,18 @@
+$ ->
+  $('.js-branch-dev-push').on 'click', (e) ->
+    e.preventDefault()
+
+    id = $(this).data('value')
+    checked = $(this).is(':not(.is-active)')
+    url = $(this).data('url')
+    $.ajax
+      type: 'PUT'
+      url: url
+      dataType: 'json'
+      data:
+        id: id
+        developers_can_push: checked
+      success: =>
+        $(this).toggleClass 'is-active'
+      error: ->
+        new Flash('Failed to update branch!', 'alert')
diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss
index d61f6c91d8db..3d38931f97d2 100644
--- a/app/assets/stylesheets/framework/dropdowns.scss
+++ b/app/assets/stylesheets/framework/dropdowns.scss
@@ -119,13 +119,18 @@
     background-color: $dropdown-divider-color;
   }
 
-  a:not(.btn) {
+  a:not(.btn),
+  .dropdown-link {
     display: block;
     position: relative;
     padding: 5px 10px;
+    width: 100%;
     color: $dropdown-link-color;
+    background-color: transparent;
     line-height: initial;
+    text-align: left;
     text-overflow: ellipsis;
+    border: 0;
     border-radius: 2px;
     white-space: nowrap;
     overflow: hidden;
@@ -238,7 +243,8 @@
 }
 
 .dropdown-menu-selectable {
-  a:not(.btn) {
+  a:not(.btn),
+  .dropdown-link {
     padding-left: 25px;
 
     &.is-indeterminate, &.is-active {
diff --git a/app/assets/stylesheets/framework/nav.scss b/app/assets/stylesheets/framework/nav.scss
index 4de89daeb36e..9e9473c67dd3 100644
--- a/app/assets/stylesheets/framework/nav.scss
+++ b/app/assets/stylesheets/framework/nav.scss
@@ -126,7 +126,6 @@
 
   .nav-links {
     display: inline-block;
-    width: 50%;
     margin-bottom: 0;
     border-bottom: none;
 
@@ -141,8 +140,6 @@
   }
 
   .nav-controls {
-    width: 50%;
-    display: inline-block;
     float: right;
     text-align: right;
     padding: 11px 0;
diff --git a/app/controllers/projects/branches_controller.rb b/app/controllers/projects/branches_controller.rb
index df5b986aba66..dd9508da0491 100644
--- a/app/controllers/projects/branches_controller.rb
+++ b/app/controllers/projects/branches_controller.rb
@@ -54,23 +54,6 @@ def destroy
     end
   end
 
-  def update_status
-    branch = @project.protected_branches.find(params[:branch_id])
-
-    if branch.nil?
-      branch = @project.protected_branches.new
-      branch.name = params[:branch_id]
-      branch.save
-    else
-      if params[:protected_branch] == 'false'
-        branch.destroy
-      end
-    end
-
-    redirect_to namespace_project_branches_path(@project.namespace,
-                                                          @project)
-  end
-
   private
 
   def ref
diff --git a/app/controllers/projects/protected_branches_controller.rb b/app/controllers/projects/protected_branches_controller.rb
index efa7bf14d0f5..ed170bb5595d 100644
--- a/app/controllers/projects/protected_branches_controller.rb
+++ b/app/controllers/projects/protected_branches_controller.rb
@@ -11,9 +11,16 @@ def index
   end
 
   def create
+    branch_params = protected_branch_params
     @project.protected_branches.create(protected_branch_params)
-    redirect_to namespace_project_protected_branches_path(@project.namespace,
-                                                          @project)
+
+    if params[:protected_branch][:branch_index].nil?
+      redirect_to namespace_project_protected_branches_path(@project.namespace,
+                                                            @project)
+    else
+      redirect_to namespace_project_branches_path(@project.namespace,
+                                                  @project)
+    end
   end
 
   def update
@@ -38,7 +45,14 @@ def destroy
     @project.protected_branches.find(params[:id]).destroy
 
     respond_to do |format|
-      format.html { redirect_to namespace_project_protected_branches_path }
+      format.html do
+        if params[:branch_index].nil?
+          redirect_to namespace_project_protected_branches_path
+        else
+          redirect_to namespace_project_branches_path(@project.namespace,
+                                                      @project)
+        end
+      end
       format.js { head :ok }
     end
   end
diff --git a/app/views/projects/branches/_branch.html.haml b/app/views/projects/branches/_branch.html.haml
index 8d4c19104646..3e122a3f1b17 100644
--- a/app/views/projects/branches/_branch.html.haml
+++ b/app/views/projects/branches/_branch.html.haml
@@ -40,9 +40,13 @@
             %ul
               %li.dropdown-header Settings
               %li
-                = link_to "Protected", namespace_project_branch_update_status_path(@project.namespace, @project, protected_branch || branch.name, protected_branch: true), method: :post, class: ("is-active" if @project.protected_branch? branch.name)
+                = form_for [@project.namespace.becomes(Namespace), @project, @project.protected_branches.new] do |f|
+                  = f.hidden_field :branch_index, value: "true"
+                  = f.hidden_field :name, value: branch.name
+                  = button_tag type: "submit", class: "dropdown-link #{"is-active" if @project.protected_branch? branch.name}", disabled: @project.protected_branch?(branch.name) do
+                    Protected
               %li
-                = link_to "Unprotected", namespace_project_branch_update_status_path(@project.namespace, @project, protected_branch || branch.name, protected_branch: false), method: :post, class: ("is-active" if !@project.protected_branch? branch.name)
+                = link_to "Unprotect", [@project.namespace.becomes(Namespace), @project, protected_branch, branch_index: true], data: { confirm: 'Branch will be writable for developers. Are you sure?' }, method: :delete, class: ("is-active" if !@project.protected_branch? branch.name)
               - if can_remove_branch?(@project, branch.name)
                 %li.divider
                 %li
@@ -51,7 +55,7 @@
               - else
                 %li.divider
                 %li
-                  %a{ href: "#", class: ("is-active" if @project.developers_can_push_to_protected_branch?(branch.name)) }
+                  %a.js-branch-dev-push{ href: "#", class: ("is-active" if @project.developers_can_push_to_protected_branch?(branch.name)), data: { value: protected_branch.id, url: namespace_project_protected_branch_path(@project.namespace, @project, protected_branch) } }
                     Developers can push
 
     - if branch.name != @repository.root_ref
diff --git a/config/routes.rb b/config/routes.rb
index 8695402370d9..95fbe7dd9df9 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -688,9 +688,7 @@
           end
         end
 
-        resources :branches, only: [:index, :new, :create, :destroy], constraints: { id: Gitlab::Regex.git_reference_regex } do
-          post :update_status
-        end
+        resources :branches, only: [:index, :new, :create, :destroy], constraints: { id: Gitlab::Regex.git_reference_regex }
         resources :tags, only: [:index, :show, :new, :create, :destroy], constraints: { id: Gitlab::Regex.git_reference_regex } do
           resource :release, only: [:edit, :update]
         end
diff --git a/features/steps/project/commits/branches.rb b/features/steps/project/commits/branches.rb
index 0a42931147dc..94ad4ceabcae 100644
--- a/features/steps/project/commits/branches.rb
+++ b/features/steps/project/commits/branches.rb
@@ -75,7 +75,7 @@ class Spinach::Features::ProjectCommitsBranches < Spinach::FeatureSteps
 
   step "I click branch 'improve/awesome' delete link" do
     page.within '.js-branch-improve\/awesome' do
-      find('.btn-remove').click
+      find('.branch-delete-button', visible: false).click
       sleep 0.05
     end
   end
-- 
GitLab


From f46c25cd0a189807386e491eae4afc2d3819e24d Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Wed, 18 May 2016 11:06:33 +0100
Subject: [PATCH 4/4] Added tests

---
 .../projects/branches_controller.rb           |  3 +
 .../projects/protected_branches_controller.rb |  1 -
 app/views/projects/branches/_branch.html.haml | 10 +--
 features/steps/project/commits/branches.rb    |  4 +-
 spec/features/projects/branches_spec.rb       | 75 +++++++++++++++++++
 5 files changed, 85 insertions(+), 8 deletions(-)
 create mode 100644 spec/features/projects/branches_spec.rb

diff --git a/app/controllers/projects/branches_controller.rb b/app/controllers/projects/branches_controller.rb
index dd9508da0491..1f7a114fc3d9 100644
--- a/app/controllers/projects/branches_controller.rb
+++ b/app/controllers/projects/branches_controller.rb
@@ -8,6 +8,9 @@ class Projects::BranchesController < Projects::ApplicationController
   def index
     @sort = params[:sort] || 'name'
     @branches = @repository.branches_sorted_by(@sort)
+    branch_names = @branches.map(&:name)
+    @protected_branches = @project.protected_branches.where(name: branch_names)
+
     @branches = Kaminari.paginate_array(@branches).page(params[:page])
 
     @max_commits = @branches.reduce(0) do |memo, branch|
diff --git a/app/controllers/projects/protected_branches_controller.rb b/app/controllers/projects/protected_branches_controller.rb
index ed170bb5595d..3f541fe18dc5 100644
--- a/app/controllers/projects/protected_branches_controller.rb
+++ b/app/controllers/projects/protected_branches_controller.rb
@@ -11,7 +11,6 @@ def index
   end
 
   def create
-    branch_params = protected_branch_params
     @project.protected_branches.create(protected_branch_params)
 
     if params[:protected_branch][:branch_index].nil?
diff --git a/app/views/projects/branches/_branch.html.haml b/app/views/projects/branches/_branch.html.haml
index 3e122a3f1b17..11b61f3020ff 100644
--- a/app/views/projects/branches/_branch.html.haml
+++ b/app/views/projects/branches/_branch.html.haml
@@ -3,7 +3,7 @@
 - diverging_commit_counts = @repository.diverging_commit_counts(branch)
 - number_commits_behind = diverging_commit_counts[:behind]
 - number_commits_ahead = diverging_commit_counts[:ahead]
-- protected_branch = @project.protected_branches.find_by_name(branch.name)
+- protected_branch = @protected_branches.find_by_name(branch.name)
 %li(class="js-branch-#{branch.name}")
   %div
     = link_to namespace_project_tree_path(@project.namespace, @project, branch.name) do
@@ -32,7 +32,7 @@
 
       - if can? current_user, :admin_project, @project
         .dropdown.inline
-          %button.btn.btn-default.btn-xs{ type: "button", data: { toggle: "dropdown" } }
+          %button.btn.btn-default.btn-xs.js-branch-settings-toggle{ type: "button", data: { toggle: "dropdown" } }
             %span.sr-only Settings
             = icon("gear")
             %span.caret
@@ -46,13 +46,13 @@
                   = button_tag type: "submit", class: "dropdown-link #{"is-active" if @project.protected_branch? branch.name}", disabled: @project.protected_branch?(branch.name) do
                     Protected
               %li
-                = link_to "Unprotect", [@project.namespace.becomes(Namespace), @project, protected_branch, branch_index: true], data: { confirm: 'Branch will be writable for developers. Are you sure?' }, method: :delete, class: ("is-active" if !@project.protected_branch? branch.name)
+                = link_to "Unprotected", [@project.namespace.becomes(Namespace), @project, protected_branch, branch_index: true], data: { confirm: 'Branch will be writable for developers. Are you sure?' }, method: :delete, class: ("is-active" if !@project.protected_branch? branch.name)
               - if can_remove_branch?(@project, branch.name)
                 %li.divider
                 %li
-                  = link_to namespace_project_branch_path(@project.namespace, @project, branch.name), class: "btn btn-warning branch-delete-button block", title: "Delete branch", method: :delete, data: { confirm: "Deleting the '#{branch.name}' branch cannot be undone. Are you sure?" }, remote: true do
+                  = link_to namespace_project_branch_path(@project.namespace, @project, branch.name), class: "btn btn-warning branch-delete-button block", title: "Delete branch", method: :delete, data: { confirm: "Deleting the '#{branch.name}' branch cannot be undone. Are you sure?" } do
                     Delete branch
-              - else
+              - elsif !protected_branch.nil?
                 %li.divider
                 %li
                   %a.js-branch-dev-push{ href: "#", class: ("is-active" if @project.developers_can_push_to_protected_branch?(branch.name)), data: { value: protected_branch.id, url: namespace_project_protected_branch_path(@project.namespace, @project, protected_branch) } }
diff --git a/features/steps/project/commits/branches.rb b/features/steps/project/commits/branches.rb
index 94ad4ceabcae..ce0c9cde1164 100644
--- a/features/steps/project/commits/branches.rb
+++ b/features/steps/project/commits/branches.rb
@@ -75,8 +75,8 @@ class Spinach::Features::ProjectCommitsBranches < Spinach::FeatureSteps
 
   step "I click branch 'improve/awesome' delete link" do
     page.within '.js-branch-improve\/awesome' do
-      find('.branch-delete-button', visible: false).click
-      sleep 0.05
+      first('.js-branch-settings-toggle').click
+      find('.branch-delete-button').click
     end
   end
 
diff --git a/spec/features/projects/branches_spec.rb b/spec/features/projects/branches_spec.rb
new file mode 100644
index 000000000000..7ac58b4dd02b
--- /dev/null
+++ b/spec/features/projects/branches_spec.rb
@@ -0,0 +1,75 @@
+require 'rails_helper'
+
+feature 'Branches', feature: true, js: true do
+  let(:project) { create(:project) }
+  let(:user) { create(:user) }
+
+  before do
+    project.team << [user, :master]
+    login_as user
+
+    visit namespace_project_branches_path(project.namespace, project)
+  end
+
+  it 'should show list of branches' do
+    page.within '.all-branches' do
+      expect(page).to have_content project.repository.branches.first.name
+    end
+  end
+
+  it 'should protect a branch' do
+    branch_el = first('.all-branches li')
+    first('.js-branch-settings-toggle').click
+
+    page.within branch_el do
+      click_button 'Protected'
+    end
+
+    expect(page).to have_content 'protected'
+  end
+
+  it 'should unprotect branch' do
+    branch_el = first('.all-branches li')
+    first('.js-branch-settings-toggle').click
+
+    page.within branch_el do
+      click_button 'Protected'
+    end
+
+    expect(page).to have_content 'protected'
+
+    first('.js-branch-settings-toggle').click
+    click_link 'Unprotected'
+
+    expect(page).to have_no_content 'protected'
+  end
+
+  it 'should allow developers to push' do
+    branch_el = first('.all-branches li')
+    first('.js-branch-settings-toggle').click
+    page.within branch_el do
+      click_button 'Protected'
+    end
+    expect(page).to have_content 'protected'
+
+    first('.js-branch-settings-toggle').click
+
+    branch_el = first('.all-branches li')
+    page.within branch_el do
+      click_link 'Developers can push'
+    end
+
+    expect(page).to have_selector('.js-branch-dev-push.is-active', visible: false)
+  end
+
+  it 'should allow branch to be deleted' do
+    branch_el = first('.all-branches li')
+    branch_name = project.repository.branches.first.name
+    first('.js-branch-settings-toggle').click
+
+    page.within branch_el do
+      click_link 'Delete branch'
+    end
+    expect(page).to have_no_content branch_name
+  end
+end
-- 
GitLab