Added profile integration test for sorting gems in profile page alpha…

…betically

app/assets/stylesheets/modules/org.css

@@ -194,21 +194,25 @@
     text-align: right; } }
 @media (min-width: 780px) {
   .profile__downloads-wrap {
-    padding-top: 32px; } }
+    padding-top: 32px;
+  }
+  .profile__downloads-wrap form {
+    align-items: flex-end;
+  }
+}
 
-.sorting form {
+.profile__downloads-wrap form {
   display: flex;
   flex-direction: column;
-  align-items: flex-end;
 }
 
-.sorting form label:first-child,
-.sorting form select{
+.profile__downloads-wrap form label:first-child,
+.profile__downloads-wrap form select{
   margin-bottom: 0.5rem;
 }
 
-.sorting form select,
-.sorting form button {
+.profile__downloads-wrap form select,
+.profile__downloads-wrap form button {
   width: fit-content;
 }
 

app/views/profiles/_sort_form.html.erb

@@ -1,25 +1,23 @@
-<div class="sorting">
+<%=
+  form_with(
+    data: {
+      "controller": "gem-sort",
+      "gem-sort-target": "form",
+    },
+    method: :get,
+    url: profile_path(@user&.handle)
+  ) do |f|
+%>
+  <%= f.label :sort_by, class: "t-text--s"%>
   <%=
-    form_with(
-      data: {
-        "controller": "gem-sort",
-        "gem-sort-target": "form",
-      },
-      method: :get,
-      url: profile_path(@user&.handle)
-    ) do |f|
+    select_tag :sort_by,
+               options_for_select(
+                 [
+                   ["Name", "name"],
+                   ["Downloads", "downloads"]
+                 ],
+                 params[:sort_by] || "downloads"
+               ),
+               data: { "gem-sort-target" => "select" }
   %>
-    <%= f.label :sort_by, class: "t-text--s"%>
-    <%=
-      select_tag :sort_by,
-                 options_for_select(
-                   [
-                     ["Name", "name"],
-                     ["Downloads", "downloads"]
-                   ],
-                   params[:sort_by] || "downloads"
-                 ),
-                 data: { "gem-sort-target" => "select" }
-    %>
-  <% end %>
-</div>
+<% end %>

test/integration/profile_test.rb

@@ -177,4 +177,19 @@ def sign_out
     assert page.has_content? "special note"
     assert page.has_content? "request note"
   end
+
+  test "sort gems alphabetically in profile" do
+    alphabetical_first = FactoryBot.create(:rubygem, name: "AGem", owners: [@user], downloads: 1)
+    alphabetical_last = FactoryBot.create(:rubygem, name: "ZGem", owners: [@user], downloads: 999)
+
+    visit profile_path(@user.handle)
+    dropdown = find(:element, "data-gem-sort-target": "select")
+    form = find(:element, "data-gem-sort-target": "form")
+    dropdown.select("Name")
+    # Submit form without button
+    Capybara::RackTest::Form.new(form.base.driver, form.native).submit({})
+    rubygem_links = page.all(:element, "a", class: "gems__gem__name")
+    assert rubygem_links.first.text == alphabetical_first.name
+    assert rubygem_links.last.text == alphabetical_last.name
+  end
 end