Better section actions speccing

app/assets/javascripts/supplier/app/templates/section.emblem

@@ -21,14 +21,14 @@
           a href="{{route 'qr_codes_suppliers_tables_path' section_id=id}}" {{t 'tables.qr_codes.link'}}
         li
           a href="{{route 'suppliers_section_path' id}}" data-method="delete" data-confirm="{{t 'helpers.links.are_you_sure' bare=true}}" {{t 'helpers.links.destroy'}}
-    view Ember.TextField valueBinding="title"
-    view Ember.TextField valueBinding="width" classNames="dimension"
+    view Ember.TextField valueBinding="title" class="section-edit-title-field"
+    view Ember.TextField valueBinding="width" class="dimension section-edit-width-field"
     span x
-    view Ember.TextField valueBinding="height" classNames="dimension"
-    a.btn.btn-mini{ action finishEditable }
+    view Ember.TextField valueBinding="height" class="dimension section-edit-height-field"
+    a.btn.btn-mini.section-normal-mode-button{ action finishEditable }
       span.icon-ok
   else
-    a.btn.btn-mini{ action makeEditable }
+    a.btn.btn-mini.section-edit-mode-button{ action makeEditable }
       span.icon-pencil
 each table in tables
   view 'Qsupplier.App.SectionTableView' contentBinding="table"

app/assets/javascripts/supplier/app/views/section_tab_header_view.js.coffee

@@ -2,6 +2,9 @@ Qsupplier.App.SectionTabHeaderView = Ember.View.extend DragNDrop.Droppable,
   template: Ember.Handlebars.compile('{{view.content.title}}')
   tagName: 'a'
   attributeBindings: ['href']
+  classNameBindings: ['section_header_class']
+
+  section_header_class: (-> "section-tab-header-#{@get('content.id')}").property()
   href: (-> Routes.suppliers_section_path(@content.id)).property()
   dragEntered: (view)->
     return false

spec/acceptance/suppliers/section_view.feature

@@ -46,3 +46,30 @@ Feature: Supplier section view
     When I reset the section selector in the supplier dashboard
     Then I should see the list and the new list
     And I should see the order and the new order
+
+
+  @javascript
+  Scenario: Going to edit mode and change section properties
+    Given there is an active list and order
+    And there are 2 supplier sections
+    And the last supplier section has a table with known coordinates
+    And I am signed in as supplier
+    When I visit the supplier last section path
+    And I click the supplier section edit mode button
+    And I fill in the supplier edit section form with new values
+    Then the last section tab header should have the newly filled in name
+    When I click the supplier section normal mode button
+    Then the supplier last section properties should be updated to the new values
+
+  # capybara-webkit 1.1.0 drag to is not yet supported it seems
+  @javascript @broken
+  Scenario: Dragging a table to another section
+    Given there is an active list and order
+    And there are 2 supplier sections
+    And the last supplier section has a table with known coordinates
+    And I am signed in as supplier
+    When I visit the supplier last section path
+    And I click the supplier section edit mode button
+    And I drag the table from the last section to the first section tab header
+    And I wait 1 second
+    Then the supplier table should have been linked to the first section

spec/acceptance_steps/suppliers/navigation_steps.rb

@@ -10,6 +10,9 @@ step "I visit the supplier section path" do
   visit "/supplier/sections/#{@section.id}"
 end
 
+step "I visit the supplier last section path" do
+  visit "/supplier/sections/#{@sections.last.id}"
+end
 
 step "I should be redirected to the supplier settings page" do
   #page.current_path.should == supplier_settings_path

spec/acceptance_steps/suppliers/section_view_steps.rb

@@ -70,3 +70,45 @@ step "I should be redirected to the supplier section view" do
   #page.current_path.should == "/supplier/sections/#{@section.id}"
   page.evaluate_script('window.location.pathname').should == "/supplier/sections/#{@section.id}"
 end
+
+step "the last supplier section has a table with known coordinates" do
+  @table = create :table, position_x: 4, position_y: 5, number: 74, supplier: @supplier, section: @sections.last
+end
+
+step "I click the supplier section edit mode button" do
+  find('.section-edit-mode-button').click
+end
+
+step "I click the supplier section normal mode button" do
+  find('.section-normal-mode-button').click
+end
+
+step "I fill in the supplier edit section form with new values" do
+  find('.section-edit-title-field').set 'RenamedSection'
+  find('.section-edit-width-field').set '40'
+  find('.section-edit-height-field').set '52.7'
+end
+
+step "the last section tab header should have the newly filled in name" do
+  find(".section-tab-header-#{@sections.last.id}").text.should == 'RenamedSection'
+end
+
+step "the supplier last section properties should be updated to the new values" do
+  sleep 1
+  section = @sections.last
+  section.reload
+  section.title.should == 'RenamedSection'
+  section.width.should == 40.0
+  section.height.should == 52.7
+end
+
+step "I drag the table from the last section to the first section tab header" do
+  first_section_tab_header = find(".section-tab-header-#{@sections.first.id}")
+  table_view = find(".section-table-#{@table.id}")
+  table_view.drag_to first_section_tab_header
+end
+
+step "the supplier table should have been linked to the first section" do
+  @table.reload
+  @table.section_id.should == @sections.first.id
+end

spec/spec_helper.rb

@@ -15,6 +15,7 @@ Dir.glob("spec/acceptance_steps/**/*steps.rb") { |f| load f, true }
 I18n.locale =I18n.default_locale
 Devise.stretches = 1
 Capybara.javascript_driver = :webkit
+Capybara.default_wait_time = 4 # ember needs more time than the default of 2
 #Capybara.javascript_driver = :selenium
 
 module FactoryAttributesFor