Repository: woylie/flop_phoenix (elixir)

Issue:
Pagination: links are not wrapped in `li`
I'm getting Flop pagination setup with my Tailwind theming. I noticed an issue that when I had an ellipsis showing up, my horizontal list broke.

Looking into the HTML generated by Flop, I noticed something odd: inside the `ul` for the pagination items, only the ellipsis element is wrapped in an `li` and the rest are `a` tags directly under the `ul`. This means the resulting HTML looks like:

```html
<ul class="pagination-list">
  <a>1</a>
  <a>2</a>
  <li>
    <span>...</span>
  </ii>
  <a>99</a>
</ul>
```

https://github.com/woylie/flop_phoenix/blob/12e6c15d5d44243c9959f40774b242f7cdc419f7/lib/flop_phoenix.ex#L502-L504

Part of my problem is not being able to apply classes to the `li` that I need to get it to render properly.
Aside from this, it seems not complaint with the [HTML standard for `ul`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ul#technical_summary) to have non-`li` elements as children.

Pull request:
fix/missing li
- fix: wrap pagination links in li
- chore: bump version

resolves #278 

Patch:
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 36ded47..7a0950b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,12 @@
 
 ## Unreleased
 
+## [0.22.2] - 2023-10-19
+
+### Fixed
+
+- Numbered pagination links were not wrapped in `li` elements.
+
 ## [0.22.1] - 2023-09-28
 
 ### Changed
diff --git a/README.md b/README.md
index 654c887..99102be 100644
--- a/README.md
+++ b/README.md
@@ -17,7 +17,7 @@ application.
 ```elixir
 def deps do
   [
-    {:flop_phoenix, "~> 0.22.1"}
+    {:flop_phoenix, "~> 0.22.2"}
   ]
 end
 ```
diff --git a/lib/flop_phoenix.ex b/lib/flop_phoenix.ex
index 276d31d..633b7fd 100644
--- a/lib/flop_phoenix.ex
+++ b/lib/flop_phoenix.ex
@@ -503,17 +503,18 @@ defmodule Flop.Phoenix do
         <span {@opts[:ellipsis_attrs]}><%= @opts[:ellipsis_content] %></span>
       </li>
 
-      <.pagination_link
-        :for={page <- @range}
-        event={@event}
-        target={@target}
-        page={page}
-        path={@page_link_helper.(page)}
-        on_paginate={@on_paginate}
-        {Pagination.attrs_for_page_link(page, @meta, @opts)}
-      >
-        <%= page %>
-      </.pagination_link>
+      <li :for={page <- @range}>
+        <.pagination_link
+          event={@event}
+          target={@target}
+          page={page}
+          path={@page_link_helper.(page)}
+          on_paginate={@on_paginate}
+          {Pagination.attrs_for_page_link(page, @meta, @opts)}
+        >
+          <%= page %>
+        </.pagination_link>
+      </li>
 
       <li :if={@last < @meta.total_pages - 1}>
         <span {@opts[:ellipsis_attrs]}><%= @opts[:ellipsis_content] %></span>
diff --git a/mix.exs b/mix.exs
index 39b7a91..d17863b 100644
--- a/mix.exs
+++ b/mix.exs
@@ -2,7 +2,7 @@ defmodule FlopPhoenix.MixProject do
   use Mix.Project
 
   @source_url "https://github.com/woylie/flop_phoenix"
-  @version "0.22.1"
+  @version "0.22.2"
 
   def project do
     [


Test patch:
diff --git a/test/flop_phoenix_test.exs b/test/flop_phoenix_test.exs
index 8b593ea..2254566 100644
--- a/test/flop_phoenix_test.exs
+++ b/test/flop_phoenix_test.exs
@@ -512,14 +512,14 @@ defmodule Flop.PhoenixTest do
 
       assert [_] = Floki.find(html, "ul[class='pagination-links']")
 
-      assert [link] = Floki.find(html, "a[aria-label='Go to page 1']")
+      assert [link] = Floki.find(html, "li a[aria-label='Go to page 1']")
       assert Floki.attribute(link, "class") == ["pagination-link"]
       assert Floki.attribute(link, "data-phx-link") == ["patch"]
       assert Floki.attribute(link, "data-phx-link-state") == ["push"]
       assert Floki.attribute(link, "href") == ["/pets?page_size=10"]
       assert String.trim(Floki.text(link)) == "1"
 
-      assert [link] = Floki.find(html, "a[aria-label='Go to page 2']")
+      assert [link] = Floki.find(html, "li a[aria-label='Go to page 2']")
       assert Floki.attribute(link, "class") == ["pagination-link is-current"]
       assert Floki.attribute(link, "data-phx-link") == ["patch"]
       assert Floki.attribute(link, "data-phx-link-state") == ["push"]
@@ -527,7 +527,7 @@ defmodule Flop.PhoenixTest do
       assert_urls_match(href, "/pets?page=2&page_size=10")
       assert String.trim(Floki.text(link)) == "2"
 
-      assert [link] = Floki.find(html, "a[aria-label='Go to page 3']")
+      assert [link] = Floki.find(html, "li a[aria-label='Go to page 3']")
       assert Floki.attribute(link, "class") == ["pagination-link"]
       assert Floki.attribute(link, "data-phx-link") == ["patch"]
       assert Floki.attribute(link, "data-phx-link-state") == ["push"]