Merge pull request #7581 from Fensterbank/improved-profile-picture-editor

Profile photo upload with cropping function

3 files changed, 27 insertions, 1 deletions

diff --git a/features/desktop/edits_profile.feature b/features/desktop/edits_profile.feature
index bf68ed972..90e7b06bb 100644
--- a/features/desktop/edits_profile.feature
+++ b/features/desktop/edits_profile.feature
@@ -44,12 +44,31 @@ Feature: editing your profile
     And I press "update_profile"
     Then I should see "#kamino" within "ul#as-selections-tags"
     And I should see "#starwars" within "ul#as-selections-tags"
+    And I should see a ".crop-container" within "#profile_photo_upload"
     And the "#profile_public_details" bootstrap-switch should be on
 
     When I attach the file "spec/fixtures/bad_urls.txt" to "qqfile" within "#file-upload"
     Then I should see a flash message indicating failure
 
     When I attach the file "spec/fixtures/button.png" to hidden "qqfile" within "#file-upload"
+    Then I should see a ".cropper-container" within ".crop-container"
+    And I should see a ".controls" within ".crop-container"
+    And I should see a ".preview" within ".controls"
+    And I should see 2 ".btn" within ".buttons-left"
+    And I should see 3 ".btn" within ".buttons-right"
+
+    When I press the 2nd ".btn" within ".buttons-right"
+    Then I should see a ".avatar" within ".crop-container"
+    But I should not see a ".cropper-container" within ".crop-container"
+
+    When I attach the file "spec/fixtures/button.png" to hidden "qqfile" within "#file-upload"
+    Then I should see a ".cropper-container" within ".crop-container"
+    And I should see a ".controls" within ".crop-container"
+    And I should see a ".preview" within ".controls"
+    And I should see 2 ".btn" within ".buttons-left"
+    And I should see 3 ".btn" within ".buttons-right"
+
+    When I press the 3rd ".btn" within ".buttons-right"
     Then I should see "button.png completed"
     And I should see a "img" within "#profile_photo_upload"
 
diff --git a/features/step_definitions/custom_web_steps.rb b/features/step_definitions/custom_web_steps.rb
index 041afe439..c5caf120c 100644
--- a/features/step_definitions/custom_web_steps.rb
+++ b/features/step_definitions/custom_web_steps.rb
@@ -182,6 +182,12 @@ Then /^(?:|I )should see a "([^\"]*)"(?: within "([^\"]*)")?$/ do |selector, sco
   end
 end
 
+Then /^I should see (\d+) "([^\"]*)"(?: within "([^\"]*)")?$/ do |count, selector, scope_selector|
+  with_scope(scope_selector) do
+    expect(current_scope).to have_selector(selector, count: count)
+  end
+end
+
 Then /^(?:|I )should not see a "([^\"]*)"(?: within "([^\"]*)")?$/ do |selector, scope_selector|
   with_scope(scope_selector) do
     current_scope.should have_no_css(selector, :visible => true)
diff --git a/features/step_definitions/web_steps.rb b/features/step_definitions/web_steps.rb
index 38f7d0ab4..3cb2a75fb 100644
--- a/features/step_definitions/web_steps.rb
+++ b/features/step_definitions/web_steps.rb
@@ -96,7 +96,8 @@ When /^(?:|I )attach the file "([^"]*)" to (?:hidden )?"([^"]*)"(?: within "([^"
     attach_file(field, Rails.root.join(path).to_s)
   end
   # wait for the image to be ready
-  page.assert_selector(".loading", count: 0)
+  page.assert_no_selector(".loading")
+  page.assert_no_selector("#file-upload-spinner")
 end
 
 Then /^(?:|I )should see (\".+?\"[\s]*)(?:[\s]+within[\s]* "([^"]*)")?$/ do |vars, selector|