migrate context and context_list features. Drag and drop is still WIP

features/context_edit.feature

@@ -12,7 +12,7 @@ Feature: Edit a context
     And I have a project called "test project"
     And I have 2 todos in project "test project" in context "@pc" with tags "starred"
 
-  @selenium
+  @javascript
   Scenario: In place edit of context name
     Given I have a context called "Errands"
     When I go to the context page for "Errands"
@@ -22,7 +22,7 @@ Feature: Edit a context
     Then he should see that a context named "Errands" is not present
     And he should see that a context named "OutAndAbout" is present
 
-  @selenium
+  @javascript
   Scenario: Editing the context of a todo will remove the todo
     When I go to the the context page for "@pc"
     Then the badge should show 2
@@ -30,14 +30,14 @@ Feature: Edit a context
     Then I should not see "todo 1"
     And the badge should show 1
 
-  @selenium
+  @javascript
   Scenario: Editing the description of a a todo will update that todo
     When I go to the the context page for "@pc"
     And I edit the description of "todo 1" to "changed"
     Then I should not see "todo 1"
     And I should see "changed"
 
-  @selenium
+  @javascript
   Scenario: Editing the context of the last todo will remove the todo and show empty message
     When I go to the the context page for "@pc"
     And I edit the context of "todo 1" to "@laptop"
@@ -48,7 +48,7 @@ Feature: Edit a context
     And the badge should show 0
     And I should see "Currently there are no incomplete actions in this context"
 
-  @selenium
+  @javascript
   Scenario: Adding a todo to a hidden project will not show the todo
     Given I have a hidden project called "hidden project"
     When I go to the the context page for "@pc"
@@ -61,7 +61,7 @@ Feature: Edit a context
     And I should see "todo X"
     And the badge should show 2
 
-  @selenium
+  @javascript
   Scenario: Adding a todo to a hidden context will show that todo
     Given I have a hidden context called "@personal"
     When I go to the the context page for "@pc"

features/context_list.feature

@@ -36,7 +36,7 @@ Feature: Manage the list of contexts
     Then I should be on the context page for "@bar"
     And the badge should show 3
 
-  @selenium
+  @javascript
   Scenario: Delete context from context page should update badge
     Given I have a context called "@computer"
     And I have a context called "@ipad"
@@ -48,7 +48,7 @@ Feature: Manage the list of contexts
     And the badge should show 1
     And the context list badge for active contexts should show 1
 
-  @selenium
+  @javascript
   Scenario: Delete last context from context page should remove the contexts container for hidden or active contexts
     Given I have a context called "@computer"
     And I have a hidden context called "@ipad"
@@ -62,7 +62,7 @@ Feature: Manage the list of contexts
     Then I should see that a context named "@ipad" is not present
     And I should see that the context container for hidden contexts is not present
 
-  @selenium
+  @javascript
   Scenario: Delete context from context page right after an edit
     Given I have a context called "@computer"
     When I go to the contexts page
@@ -71,7 +71,7 @@ Feature: Manage the list of contexts
     Then he should see that a context named "@laptop" is not present
     And the badge should show 0
 
-  @selenium
+  @javascript
   Scenario: Edit context from context twice
     Given I have a context called "@computer"
     When I go to the contexts page
@@ -82,7 +82,7 @@ Feature: Manage the list of contexts
     And he should see that a context named "@ipad" is present
     And the badge should show 1
 
-  @selenium
+  @javascript
   Scenario Outline: Add a new context with state
     Given I have the following contexts
       | context  | hide  |
@@ -97,13 +97,13 @@ Feature: Manage the list of contexts
       | active | @phone  |
       | hidden | @hidden |
 
-  @selenium
+  @javascript
   Scenario: Cannot add a context with comma in the name
     When I go to the contexts page
     And I add a new active context "foo, bar"
     Then I should see "Name cannot contain the comma"
 
-  @selenium
+  @javascript @wip
   Scenario: I can drag and drop to order the contexts
     Given I have the following contexts
       | context |
@@ -112,10 +112,10 @@ Feature: Manage the list of contexts
       | @boss   |
     When I go to the contexts page
     Then context "@ipad" should be above context "@home"
-    When I drag context "@ipad" below context "@home"
+    When I drag context "@home" above context "@ipad"
     Then context "@home" should be above context "@ipad"
 
-  @selenium
+  @javascript
   Scenario: Hiding and unhiding the new context form
     When I go to the contexts page
     Then the new context form should be visible

features/step_definitions/context_list_steps.rb

@@ -1,29 +1,27 @@
 When /^I delete the context "([^\"]*)"$/ do |context_name|
   context = @current_user.contexts.find_by_name(context_name)
   context.should_not be_nil
-  click_link "delete_context_#{context.id}"
-  selenium.get_confirmation.should == "Are you sure that you want to delete the context '#{context_name}'? Be aware that this will also delete all (repeating) actions in this context!"
-  wait_for do
-    !selenium.is_element_present("delete_context_#{context.id}")
+  
+  handle_js_confirm do
+    click_link "delete_context_#{context.id}"
   end
+  get_confirm_text.should == "Are you sure that you want to delete the context '#{context_name}'? Be aware that this will also delete all (repeating) actions in this context!"
+  wait_for_animations_to_end
 end
 
 When /^I edit the context to rename it to "([^\"]*)"$/ do |new_name|
-  click_link "edit_context_#{@context.id}"
-
-  wait_for do
-    selenium.is_element_present("submit_context_#{@context.id}")
+  find("a#link_edit_context_#{@context.id}").click
+  
+  wait_until do
+    page.has_css?("button#submit_context_#{@context.id}")
   end
-
+  
   fill_in "context_name", :with => new_name
 
-  selenium.click "submit_context_#{@context.id}",
-    :wait_for => :text,
-    :text => "Context saved",
-    :timeout => 5
-
-  wait_for do
-    !selenium.is_element_present("submit_context_#{@context.id}")
+  click_button "submit_context_#{@context.id}"
+  
+  wait_until do
+    !page.has_css?("button#submit_context_#{@context.id}", :visible=>true)
   end
 end
 
@@ -42,57 +40,70 @@ When /^I add a new hidden context "([^"]*)"$/ do |context_name|
   submit_new_context_form
 end
 
-When /^I drag context "([^"]*)" below context "([^"]*)"$/ do |context_drag, context_drop|
+When /^I drag context "([^"]*)" above context "([^"]*)"$/ do |context_drag, context_drop|
   drag_id = @current_user.contexts.find_by_name(context_drag).id
   drop_id = @current_user.contexts.find_by_name(context_drop).id
 
-  container_height = selenium.get_element_height("//div[@id='container_context_#{drag_id}']").to_i
-  vertical_offset = container_height*2
-  coord_string = "10,#{vertical_offset}"
+  # container_height = page.driver.get_element_height("//div[@id='container_context_#{drag_id}']").to_i
+  # vertical_offset = container_height*2
+  # coord_string = "10,#{vertical_offset}"
 
-  drag_context_handle_xpath = "//div[@id='context_#{drag_id}']//span[@class='handle']"
-  drop_context_container_xpath = "//div[@id='container_context_#{drop_id}']"
+  drag_context_handle = find("div#context_#{drag_id} span.handle")
+  drag_context_handle.text.should == "DRAG"
+  
+  drop_context_container = find("div#container_context_#{drop_id}")
 
-  selenium.mouse_down_at(drag_context_handle_xpath,"2,2")
-  selenium.mouse_move_at(drop_context_container_xpath,coord_string)
-  # no need to simulate mouse_over for this test
-  selenium.mouse_up_at(drop_context_container_xpath,coord_string)
+  drag_context_handle.drag_to(drop_context_container)
+
+  # TODO: omzetten naar volgende script
+  page.execute_script %Q{
+  	$('.sortable-books li:last').simulateDragSortable({move: -4});
+  }
+  
+  sleep(5)
+  
+  # page.driver.mouse_down_at(drag_context_handle_xpath,"2,2")
+  # page.driver.mouse_move_at(drop_context_container_xpath,coord_string)
+  # # no need to simulate mouse_over for this test
+  # page.driver.mouse_up_at(drop_context_container_xpath,coord_string)
 end
 
 Then /^context "([^"]*)" should be above context "([^"]*)"$/ do |context_high, context_low|
-  high_id = @current_user.contexts.find_by_name(context_high).id
-  low_id = @current_user.contexts.find_by_name(context_low).id
-  high_pos = selenium.get_element_position_top("//div[@id='context_#{high_id}']").to_i
-  low_pos = selenium.get_element_position_top("//div[@id='context_#{low_id}']").to_i
-  (high_pos < low_pos).should be_true
+  high_id = "context_#{@current_user.contexts.find_by_name(context_high).id}"
+  low_id = "context_#{@current_user.contexts.find_by_name(context_low).id}"
+  contexts = page.all("div.context").map { |x| x[:id] }
+  contexts.find_index(high_id).should < contexts.find_index(low_id)
 end
 
 Then /^I should see that a context named "([^"]*)" is not present$/ do |context_name|
-  Then "I should not see \"#{context_name}\""
+  within "div#display_box" do
+    Then "I should not see \"#{context_name}\""
+  end
 end
 
 Then /^I should see that the context container for (.*) contexts is not present$/ do |state|
-  selenium.is_visible("list-#{state}-contexts-container").should_not be_true
+  page.has_css?("div#list-#{state}-contexts-container", :visible => true).should be_false
 end
 
 Then /^I should see that the context container for (.*) contexts is present$/ do |state|
-  selenium.is_visible("list-#{state}-contexts-container").should be_true
+  find("div#list-#{state}-contexts-container", :visible => true).should_not be_nil
 end
 
 Then /^I should see the context "([^"]*)" under "([^"]*)"$/ do |context_name, state|
   context = Context.find_by_name(context_name)
   context.should_not be_nil
-  response.should have_xpath("//div[@id='list-contexts-#{state}']//div[@id='context_#{context.id}']")
+  
+  page.has_css?("div#list-contexts-#{state} div#context_#{context.id}").should be_true
 end
 
 Then /^the new context form should be visible$/ do
-  selenium.is_visible("context_new").should be_true
+  page.has_css?("div#context_new", :visible => true).should be_true
 end
 
 Then /^the new context form should not be visible$/ do
-  selenium.is_visible("context_new").should be_false
+  page.has_css?("div#context_new", :visible => true).should be_false
 end
 
 Then /^the context list badge for ([^"]*) contexts should show (\d+)$/ do |state_name, count|
-  selenium.get_text("xpath=//span[@id='#{state_name}-contexts-count']").should == count
+  find("span##{state_name}-contexts-count").text.should == count
 end

features/step_definitions/context_steps.rb

@@ -54,7 +54,7 @@ Given /^I have a context "([^\"]*)" with (.*) actions$/ do |context_name, number
 end
 
 When /^I edit the context name in place to be "([^\"]*)"$/ do |new_context_name|
-  selenium.click "context_name"
+  page.find("span#context_name").click
   fill_in "value", :with => new_context_name
   click_button "Ok"
 end

features/step_definitions/todo_edit_steps.rb

@@ -65,7 +65,9 @@ When /I change the (.*) field of "([^\"]*)" to "([^\"]*)"$/ do |field_name, todo
   todo.should_not be_nil
 
   open_edit_form_for(todo)
-  selenium.type("css=form.edit_todo_form input[name=#{field_name}]", new_value)
+  within "form.edit_todo_form" do
+    fill_in "#{field_name}", :with => new_value
+  end
   submit_edit_todo_form(todo)
 end
 

features/support/env.rb

@@ -19,6 +19,11 @@ require 'capybara/session'
 # BUG in this version of cucumber/capybara: require 'cucumber/rails/capybara_javascript_emulation' # Lets you click links with onclick javascript handlers without using @culerity or @javascript
 
 Capybara.default_wait_time = 5
+Capybara.javascript_driver = :selenium
+
+if Capybara.javascript_driver == :webkit
+  require 'capybara/webkit'
+end
 
 # Capybara defaults to XPath selectors rather than Webrat's default of CSS3. In
 # order to ease the transition to Capybara we set the default here. If you'd

features/support/world.rb

@@ -11,7 +11,10 @@ module TracksStepHelper
   end
 
   def submit_new_context_form
-    selenium.click("xpath=//form[@id='context-form']//button[@id='context_new_submit']", :wait_for => :ajax, :javascript_framework => :jquery)
+    within "form#context-form" do
+      find("button#context_new_submit").click
+    end
+    wait_for_animations_to_end
   end
 
   def submit_new_project_form