diff --git a/lib/pagy/extras/materialize.rb b/lib/pagy/extras/materialize.rb
index 7f9224d0d..fe5328afb 100644
--- a/lib/pagy/extras/materialize.rb
+++ b/lib/pagy/extras/materialize.rb
@@ -49,14 +49,14 @@ def pagy_materialize_combo_nav_js(pagy, deprecated_id=nil, pagy_id: nil, link_ex
       style   = ' style="vertical-align: middle"'
       input   = %(<input type="number" class="browser-default" min="1" max="#{p_pages}" value="#{p_page}" style="text-align: center; width: #{p_pages.to_s.length+1}rem;">)
 
-      %(<ul#{p_id} class="pagy-materialize-combo-nav-js pagination btn" role="navigation" aria-label="pager" style="padding-right: 0" #{
-      pagy_json_attr pagy, :combo_nav, p_page, pagy_marked_link(link)
+      %(<ul#{p_id} class="pagy-materialize-combo-nav-js pagination chip" role="navigation" aria-label="pager" style="padding-right: 0" #{
+          pagy_json_attr pagy, :combo_nav, p_page, pagy_marked_link(link)
       }>#{
-      pagy_materialize_prev_html pagy, link, style
+          pagy_materialize_prev_html pagy, link, style
       }<li class="pagy-combo-input">#{
-      pagy_t 'pagy.combo_nav_js', page_input: input, count: p_page, pages: p_pages
+          pagy_t 'pagy.combo_nav_js', page_input: input, count: p_page, pages: p_pages
       }</li>#{
-      pagy_materialize_next_html pagy, link, style
+          pagy_materialize_next_html pagy, link, style
       }</ul>)
     end
 
diff --git a/test/pagy/extras/materialize_test.rb.yml b/test/pagy/extras/materialize_test.rb.yml
index a58675ea7..8e02af2cd 100644
--- a/test/pagy/extras/materialize_test.rb.yml
+++ b/test/pagy/extras/materialize_test.rb.yml
@@ -1,23 +1,4 @@
 ---
-pagy/extras/materialize::#pagy_materialize_nav#test_0003_renders last page 1: <div
-  class="pagy-materialize-nav pagination" role="navigation" aria-label="pager"><ul
-  class="pagination"><li class="waves-effect prev"><a href="/foo?page=49"   rel="prev"
-  aria-label="previous"><i class="material-icons">chevron_left</i></a></li><li class="waves-effect"><a
-  href="/foo?page=1"   >1</a></li><li class="gap disabled"><a href="#">&hellip;</a></li><li
-  class="waves-effect"><a href="/foo?page=46"   >46</a></li><li class="waves-effect"><a
-  href="/foo?page=47"   >47</a></li><li class="waves-effect"><a href="/foo?page=48"   >48</a></li><li
-  class="waves-effect"><a href="/foo?page=49"   rel="prev" >49</a></li><li class="active"><a
-  href="/foo?page=50"   >50</a></li><li class="next disabled"><a href="#"><i class="material-icons">chevron_right</i></a></li></ul></div>
-pagy/extras/materialize::#pagy_materialize_nav#test_0003_renders last page 2: <div
-  id="test-nav-id" class="pagy-materialize-nav pagination" role="navigation" aria-label="pager"><ul
-  class="pagination"><li class="waves-effect prev"><a href="/foo?page=49"  link-extra
-  rel="prev" aria-label="previous"><i class="material-icons">chevron_left</i></a></li><li
-  class="waves-effect"><a href="/foo?page=1"  link-extra >1</a></li><li class="gap
-  disabled"><a href="#">&hellip;</a></li><li class="waves-effect"><a href="/foo?page=46"  link-extra
-  >46</a></li><li class="waves-effect"><a href="/foo?page=47"  link-extra >47</a></li><li
-  class="waves-effect"><a href="/foo?page=48"  link-extra >48</a></li><li class="waves-effect"><a
-  href="/foo?page=49"  link-extra rel="prev" >49</a></li><li class="active"><a href="/foo?page=50"  link-extra
-  >50</a></li><li class="next disabled"><a href="#"><i class="material-icons">chevron_right</i></a></li></ul></div>
 pagy/extras/materialize::#pagy_materialize_nav#test_0001_renders first page 1: <div
   class="pagy-materialize-nav pagination" role="navigation" aria-label="pager"><ul
   class="pagination"><li class="prev disabled"><a href="#"><i class="material-icons">chevron_left</i></a></li><li
@@ -37,6 +18,25 @@ pagy/extras/materialize::#pagy_materialize_nav#test_0001_renders first page 2: <
   class="gap disabled"><a href="#">&hellip;</a></li><li class="waves-effect"><a href="/foo?page=50"  link-extra
   >50</a></li><li class="waves-effect next"><a href="/foo?page=2"  link-extra rel="next"
   aria-label="next"><i class="material-icons">chevron_right</i></a></li></ul></div>
+pagy/extras/materialize::#pagy_materialize_nav#test_0003_renders last page 1: <div
+  class="pagy-materialize-nav pagination" role="navigation" aria-label="pager"><ul
+  class="pagination"><li class="waves-effect prev"><a href="/foo?page=49"   rel="prev"
+  aria-label="previous"><i class="material-icons">chevron_left</i></a></li><li class="waves-effect"><a
+  href="/foo?page=1"   >1</a></li><li class="gap disabled"><a href="#">&hellip;</a></li><li
+  class="waves-effect"><a href="/foo?page=46"   >46</a></li><li class="waves-effect"><a
+  href="/foo?page=47"   >47</a></li><li class="waves-effect"><a href="/foo?page=48"   >48</a></li><li
+  class="waves-effect"><a href="/foo?page=49"   rel="prev" >49</a></li><li class="active"><a
+  href="/foo?page=50"   >50</a></li><li class="next disabled"><a href="#"><i class="material-icons">chevron_right</i></a></li></ul></div>
+pagy/extras/materialize::#pagy_materialize_nav#test_0003_renders last page 2: <div
+  id="test-nav-id" class="pagy-materialize-nav pagination" role="navigation" aria-label="pager"><ul
+  class="pagination"><li class="waves-effect prev"><a href="/foo?page=49"  link-extra
+  rel="prev" aria-label="previous"><i class="material-icons">chevron_left</i></a></li><li
+  class="waves-effect"><a href="/foo?page=1"  link-extra >1</a></li><li class="gap
+  disabled"><a href="#">&hellip;</a></li><li class="waves-effect"><a href="/foo?page=46"  link-extra
+  >46</a></li><li class="waves-effect"><a href="/foo?page=47"  link-extra >47</a></li><li
+  class="waves-effect"><a href="/foo?page=48"  link-extra >48</a></li><li class="waves-effect"><a
+  href="/foo?page=49"  link-extra rel="prev" >49</a></li><li class="active"><a href="/foo?page=50"  link-extra
+  >50</a></li><li class="next disabled"><a href="#"><i class="material-icons">chevron_right</i></a></li></ul></div>
 pagy/extras/materialize::#pagy_materialize_nav#test_0002_renders intermediate page 1: <div
   class="pagy-materialize-nav pagination" role="navigation" aria-label="pager"><ul
   class="pagination"><li class="waves-effect prev"><a href="/foo?page=19"   rel="prev"
@@ -66,78 +66,6 @@ pagy/extras/materialize::#pagy_materialize_nav#test_0002_renders intermediate pa
   href="/foo?page=24"  link-extra >24</a></li><li class="gap disabled"><a href="#">&hellip;</a></li><li
   class="waves-effect"><a href="/foo?page=50"  link-extra >50</a></li><li class="waves-effect
   next"><a href="/foo?page=21"  link-extra rel="next" aria-label="next"><i class="material-icons">chevron_right</i></a></li></ul></div>
-pagy/extras/materialize::#pagy_materialize_combo_nav_js#test_0001_renders first page 1: '<ul
-  class="pagy-materialize-combo-nav-js pagination btn" role="navigation" aria-label="pager"
-  style="padding-right: 0" data-pagy-json="[&quot;combo_nav&quot;,1,&quot;<a href=\&quot;/foo?page=__pagy_page__\&quot;   style=\&quot;display:
-  none;\&quot;></a>&quot;]"><li class="prev disabled" style="vertical-align: middle"><a
-  href="#"><i class="material-icons">chevron_left</i></a></li><li class="pagy-combo-input"><label>Page
-  <input type="number" class="browser-default" min="1" max="6" value="1" style="text-align:
-  center; width: 2rem;"> of 6</label></li><li class="waves-effect next" style="vertical-align:
-  middle"><a href="/foo?page=2"   rel="next" aria-label="next"><i class="material-icons">chevron_right</i></a></li></ul>'
-pagy/extras/materialize::#pagy_materialize_combo_nav_js#test_0001_renders first page 2: '<ul
-  id="test-nav-id" class="pagy-materialize-combo-nav-js pagination btn" role="navigation"
-  aria-label="pager" style="padding-right: 0" data-pagy-json="[&quot;combo_nav&quot;,1,&quot;<a
-  href=\&quot;/foo?page=__pagy_page__\&quot;  link-extra style=\&quot;display: none;\&quot;></a>&quot;]"><li
-  class="prev disabled" style="vertical-align: middle"><a href="#"><i class="material-icons">chevron_left</i></a></li><li
-  class="pagy-combo-input"><label>Page <input type="number" class="browser-default"
-  min="1" max="6" value="1" style="text-align: center; width: 2rem;"> of 6</label></li><li
-  class="waves-effect next" style="vertical-align: middle"><a href="/foo?page=2"  link-extra
-  rel="next" aria-label="next"><i class="material-icons">chevron_right</i></a></li></ul>'
-pagy/extras/materialize::#pagy_materialize_combo_nav_js#test_0002_renders intermediate page 1: '<ul
-  class="pagy-materialize-combo-nav-js pagination btn" role="navigation" aria-label="pager"
-  style="padding-right: 0" data-pagy-json="[&quot;combo_nav&quot;,3,&quot;<a href=\&quot;/foo?page=__pagy_page__\&quot;   style=\&quot;display:
-  none;\&quot;></a>&quot;]"><li class="waves-effect prev" style="vertical-align: middle"><a
-  href="/foo?page=2"   rel="prev" aria-label="previous"><i class="material-icons">chevron_left</i></a></li><li
-  class="pagy-combo-input"><label>Page <input type="number" class="browser-default"
-  min="1" max="6" value="3" style="text-align: center; width: 2rem;"> of 6</label></li><li
-  class="waves-effect next" style="vertical-align: middle"><a href="/foo?page=4"   rel="next"
-  aria-label="next"><i class="material-icons">chevron_right</i></a></li></ul>'
-pagy/extras/materialize::#pagy_materialize_combo_nav_js#test_0002_renders intermediate page 2: '<ul
-  id="test-nav-id" class="pagy-materialize-combo-nav-js pagination btn" role="navigation"
-  aria-label="pager" style="padding-right: 0" data-pagy-json="[&quot;combo_nav&quot;,3,&quot;<a
-  href=\&quot;/foo?page=__pagy_page__\&quot;  link-extra style=\&quot;display: none;\&quot;></a>&quot;]"><li
-  class="waves-effect prev" style="vertical-align: middle"><a href="/foo?page=2"  link-extra
-  rel="prev" aria-label="previous"><i class="material-icons">chevron_left</i></a></li><li
-  class="pagy-combo-input"><label>Page <input type="number" class="browser-default"
-  min="1" max="6" value="3" style="text-align: center; width: 2rem;"> of 6</label></li><li
-  class="waves-effect next" style="vertical-align: middle"><a href="/foo?page=4"  link-extra
-  rel="next" aria-label="next"><i class="material-icons">chevron_right</i></a></li></ul>'
-pagy/extras/materialize::#pagy_materialize_combo_nav_js#test_0003_renders last page 1: '<ul
-  class="pagy-materialize-combo-nav-js pagination btn" role="navigation" aria-label="pager"
-  style="padding-right: 0" data-pagy-json="[&quot;combo_nav&quot;,6,&quot;<a href=\&quot;/foo?page=__pagy_page__\&quot;   style=\&quot;display:
-  none;\&quot;></a>&quot;]"><li class="waves-effect prev" style="vertical-align: middle"><a
-  href="/foo?page=5"   rel="prev" aria-label="previous"><i class="material-icons">chevron_left</i></a></li><li
-  class="pagy-combo-input"><label>Page <input type="number" class="browser-default"
-  min="1" max="6" value="6" style="text-align: center; width: 2rem;"> of 6</label></li><li
-  class="next disabled" style="vertical-align: middle"><a href="#"><i class="material-icons">chevron_right</i></a></li></ul>'
-pagy/extras/materialize::#pagy_materialize_combo_nav_js#test_0003_renders last page 2: '<ul
-  id="test-nav-id" class="pagy-materialize-combo-nav-js pagination btn" role="navigation"
-  aria-label="pager" style="padding-right: 0" data-pagy-json="[&quot;combo_nav&quot;,6,&quot;<a
-  href=\&quot;/foo?page=__pagy_page__\&quot;  link-extra style=\&quot;display: none;\&quot;></a>&quot;]"><li
-  class="waves-effect prev" style="vertical-align: middle"><a href="/foo?page=5"  link-extra
-  rel="prev" aria-label="previous"><i class="material-icons">chevron_left</i></a></li><li
-  class="pagy-combo-input"><label>Page <input type="number" class="browser-default"
-  min="1" max="6" value="6" style="text-align: center; width: 2rem;"> of 6</label></li><li
-  class="next disabled" style="vertical-align: middle"><a href="#"><i class="material-icons">chevron_right</i></a></li></ul>'
-pagy/extras/materialize::#pagy_materialize_nav_js#test_0001_renders first page 1: <div
-  class="pagy-njs pagy-materialize-nav-js" role="navigation" aria-label="pager" data-pagy-json="[&quot;nav&quot;,{&quot;before&quot;:&quot;<ul
-  class=\&quot;pagination\&quot;><li class=\&quot;prev disabled\&quot;><a href=\&quot;#\&quot;><i
-  class=\&quot;material-icons\&quot;>chevron_left</i></a></li>&quot;,&quot;link&quot;:&quot;<li
-  class=\&quot;waves-effect\&quot;><a href=\&quot;/foo?page=__pagy_page__\&quot;   >__pagy_page__</a></li>&quot;,&quot;active&quot;:&quot;<li
-  class=\&quot;active\&quot;><a href=\&quot;/foo?page=__pagy_page__\&quot;   >__pagy_page__</a></li>&quot;,&quot;gap&quot;:&quot;<li
-  class=\&quot;gap disabled\&quot;><a href=\&quot;#\&quot;>&hellip;</a></li>&quot;,&quot;after&quot;:&quot;<li
-  class=\&quot;waves-effect next\&quot;><a href=\&quot;/foo?page=2\&quot;   rel=\&quot;next\&quot;
-  aria-label=\&quot;next\&quot;><i class=\&quot;material-icons\&quot;>chevron_right</i></a></li></ul>&quot;},{&quot;0&quot;:[&quot;1&quot;,2,3,4,5,&quot;gap&quot;,50]}]"></div>
-pagy/extras/materialize::#pagy_materialize_nav_js#test_0001_renders first page 2: <div
-  id="test-nav-id" class="pagy-njs pagy-materialize-nav-js" role="navigation" aria-label="pager"
-  data-pagy-json="[&quot;nav&quot;,{&quot;before&quot;:&quot;<ul class=\&quot;pagination\&quot;><li
-  class=\&quot;prev disabled\&quot;><a href=\&quot;#\&quot;><i class=\&quot;material-icons\&quot;>chevron_left</i></a></li>&quot;,&quot;link&quot;:&quot;<li
-  class=\&quot;waves-effect\&quot;><a href=\&quot;/foo?page=__pagy_page__\&quot;  link-extra
-  >__pagy_page__</a></li>&quot;,&quot;active&quot;:&quot;<li class=\&quot;active\&quot;><a
-  href=\&quot;/foo?page=__pagy_page__\&quot;  link-extra >__pagy_page__</a></li>&quot;,&quot;gap&quot;:&quot;<li
-  class=\&quot;gap disabled\&quot;><a href=\&quot;#\&quot;>&hellip;</a></li>&quot;,&quot;after&quot;:&quot;<li
-  class=\&quot;waves-effect next\&quot;><a href=\&quot;/foo?page=2\&quot;  link-extra
-  rel=\&quot;next\&quot; aria-label=\&quot;next\&quot;><i class=\&quot;material-icons\&quot;>chevron_right</i></a></li></ul>&quot;},{&quot;0&quot;:[&quot;1&quot;,2,3,&quot;gap&quot;,50],&quot;600&quot;:[&quot;1&quot;,2,3,4,&quot;gap&quot;,50]}]"></div>
 pagy/extras/materialize::#pagy_materialize_nav_js#test_0002_renders intermediate page 1: <div
   class="pagy-njs pagy-materialize-nav-js" role="navigation" aria-label="pager" data-pagy-json="[&quot;nav&quot;,{&quot;before&quot;:&quot;<ul
   class=\&quot;pagination\&quot;><li class=\&quot;waves-effect prev\&quot;><a href=\&quot;/foo?page=19\&quot;   rel=\&quot;prev\&quot;
@@ -158,6 +86,25 @@ pagy/extras/materialize::#pagy_materialize_nav_js#test_0002_renders intermediate
   class=\&quot;gap disabled\&quot;><a href=\&quot;#\&quot;>&hellip;</a></li>&quot;,&quot;after&quot;:&quot;<li
   class=\&quot;waves-effect next\&quot;><a href=\&quot;/foo?page=21\&quot;  link-extra
   rel=\&quot;next\&quot; aria-label=\&quot;next\&quot;><i class=\&quot;material-icons\&quot;>chevron_right</i></a></li></ul>&quot;},{&quot;0&quot;:[1,&quot;gap&quot;,18,19,&quot;20&quot;,21,22,&quot;gap&quot;,50],&quot;600&quot;:[1,&quot;gap&quot;,17,18,19,&quot;20&quot;,21,22,23,&quot;gap&quot;,50]}]"></div>
+pagy/extras/materialize::#pagy_materialize_nav_js#test_0001_renders first page 1: <div
+  class="pagy-njs pagy-materialize-nav-js" role="navigation" aria-label="pager" data-pagy-json="[&quot;nav&quot;,{&quot;before&quot;:&quot;<ul
+  class=\&quot;pagination\&quot;><li class=\&quot;prev disabled\&quot;><a href=\&quot;#\&quot;><i
+  class=\&quot;material-icons\&quot;>chevron_left</i></a></li>&quot;,&quot;link&quot;:&quot;<li
+  class=\&quot;waves-effect\&quot;><a href=\&quot;/foo?page=__pagy_page__\&quot;   >__pagy_page__</a></li>&quot;,&quot;active&quot;:&quot;<li
+  class=\&quot;active\&quot;><a href=\&quot;/foo?page=__pagy_page__\&quot;   >__pagy_page__</a></li>&quot;,&quot;gap&quot;:&quot;<li
+  class=\&quot;gap disabled\&quot;><a href=\&quot;#\&quot;>&hellip;</a></li>&quot;,&quot;after&quot;:&quot;<li
+  class=\&quot;waves-effect next\&quot;><a href=\&quot;/foo?page=2\&quot;   rel=\&quot;next\&quot;
+  aria-label=\&quot;next\&quot;><i class=\&quot;material-icons\&quot;>chevron_right</i></a></li></ul>&quot;},{&quot;0&quot;:[&quot;1&quot;,2,3,4,5,&quot;gap&quot;,50]}]"></div>
+pagy/extras/materialize::#pagy_materialize_nav_js#test_0001_renders first page 2: <div
+  id="test-nav-id" class="pagy-njs pagy-materialize-nav-js" role="navigation" aria-label="pager"
+  data-pagy-json="[&quot;nav&quot;,{&quot;before&quot;:&quot;<ul class=\&quot;pagination\&quot;><li
+  class=\&quot;prev disabled\&quot;><a href=\&quot;#\&quot;><i class=\&quot;material-icons\&quot;>chevron_left</i></a></li>&quot;,&quot;link&quot;:&quot;<li
+  class=\&quot;waves-effect\&quot;><a href=\&quot;/foo?page=__pagy_page__\&quot;  link-extra
+  >__pagy_page__</a></li>&quot;,&quot;active&quot;:&quot;<li class=\&quot;active\&quot;><a
+  href=\&quot;/foo?page=__pagy_page__\&quot;  link-extra >__pagy_page__</a></li>&quot;,&quot;gap&quot;:&quot;<li
+  class=\&quot;gap disabled\&quot;><a href=\&quot;#\&quot;>&hellip;</a></li>&quot;,&quot;after&quot;:&quot;<li
+  class=\&quot;waves-effect next\&quot;><a href=\&quot;/foo?page=2\&quot;  link-extra
+  rel=\&quot;next\&quot; aria-label=\&quot;next\&quot;><i class=\&quot;material-icons\&quot;>chevron_right</i></a></li></ul>&quot;},{&quot;0&quot;:[&quot;1&quot;,2,3,&quot;gap&quot;,50],&quot;600&quot;:[&quot;1&quot;,2,3,4,&quot;gap&quot;,50]}]"></div>
 pagy/extras/materialize::#pagy_materialize_nav_js#test_0003_renders last page 1: <div
   class="pagy-njs pagy-materialize-nav-js" role="navigation" aria-label="pager" data-pagy-json="[&quot;nav&quot;,{&quot;before&quot;:&quot;<ul
   class=\&quot;pagination\&quot;><li class=\&quot;waves-effect prev\&quot;><a href=\&quot;/foo?page=49\&quot;   rel=\&quot;prev\&quot;
@@ -196,3 +143,56 @@ pagy/extras/materialize::#pagy_materialize_nav_js#test_0004_renders with :steps
   class=\&quot;gap disabled\&quot;><a href=\&quot;#\&quot;>&hellip;</a></li>&quot;,&quot;after&quot;:&quot;<li
   class=\&quot;waves-effect next\&quot;><a href=\&quot;/foo?page=21\&quot;  link-extra
   rel=\&quot;next\&quot; aria-label=\&quot;next\&quot;><i class=\&quot;material-icons\&quot;>chevron_right</i></a></li></ul>&quot;},{&quot;0&quot;:[1,&quot;gap&quot;,18,19,&quot;20&quot;,21,22,&quot;gap&quot;,50],&quot;600&quot;:[1,&quot;gap&quot;,17,18,19,&quot;20&quot;,21,22,23,&quot;gap&quot;,50]}]"></div>
+pagy/extras/materialize::#pagy_materialize_combo_nav_js#test_0003_renders last page 1: '<ul
+  class="pagy-materialize-combo-nav-js pagination chip" role="navigation" aria-label="pager"
+  style="padding-right: 0" data-pagy-json="[&quot;combo_nav&quot;,6,&quot;<a href=\&quot;/foo?page=__pagy_page__\&quot;   style=\&quot;display:
+  none;\&quot;></a>&quot;]"><li class="waves-effect prev" style="vertical-align: middle"><a
+  href="/foo?page=5"   rel="prev" aria-label="previous"><i class="material-icons">chevron_left</i></a></li><li
+  class="pagy-combo-input"><label>Page <input type="number" class="browser-default"
+  min="1" max="6" value="6" style="text-align: center; width: 2rem;"> of 6</label></li><li
+  class="next disabled" style="vertical-align: middle"><a href="#"><i class="material-icons">chevron_right</i></a></li></ul>'
+pagy/extras/materialize::#pagy_materialize_combo_nav_js#test_0003_renders last page 2: '<ul
+  id="test-nav-id" class="pagy-materialize-combo-nav-js pagination chip" role="navigation"
+  aria-label="pager" style="padding-right: 0" data-pagy-json="[&quot;combo_nav&quot;,6,&quot;<a
+  href=\&quot;/foo?page=__pagy_page__\&quot;  link-extra style=\&quot;display: none;\&quot;></a>&quot;]"><li
+  class="waves-effect prev" style="vertical-align: middle"><a href="/foo?page=5"  link-extra
+  rel="prev" aria-label="previous"><i class="material-icons">chevron_left</i></a></li><li
+  class="pagy-combo-input"><label>Page <input type="number" class="browser-default"
+  min="1" max="6" value="6" style="text-align: center; width: 2rem;"> of 6</label></li><li
+  class="next disabled" style="vertical-align: middle"><a href="#"><i class="material-icons">chevron_right</i></a></li></ul>'
+pagy/extras/materialize::#pagy_materialize_combo_nav_js#test_0001_renders first page 1: '<ul
+  class="pagy-materialize-combo-nav-js pagination chip" role="navigation" aria-label="pager"
+  style="padding-right: 0" data-pagy-json="[&quot;combo_nav&quot;,1,&quot;<a href=\&quot;/foo?page=__pagy_page__\&quot;   style=\&quot;display:
+  none;\&quot;></a>&quot;]"><li class="prev disabled" style="vertical-align: middle"><a
+  href="#"><i class="material-icons">chevron_left</i></a></li><li class="pagy-combo-input"><label>Page
+  <input type="number" class="browser-default" min="1" max="6" value="1" style="text-align:
+  center; width: 2rem;"> of 6</label></li><li class="waves-effect next" style="vertical-align:
+  middle"><a href="/foo?page=2"   rel="next" aria-label="next"><i class="material-icons">chevron_right</i></a></li></ul>'
+pagy/extras/materialize::#pagy_materialize_combo_nav_js#test_0001_renders first page 2: '<ul
+  id="test-nav-id" class="pagy-materialize-combo-nav-js pagination chip" role="navigation"
+  aria-label="pager" style="padding-right: 0" data-pagy-json="[&quot;combo_nav&quot;,1,&quot;<a
+  href=\&quot;/foo?page=__pagy_page__\&quot;  link-extra style=\&quot;display: none;\&quot;></a>&quot;]"><li
+  class="prev disabled" style="vertical-align: middle"><a href="#"><i class="material-icons">chevron_left</i></a></li><li
+  class="pagy-combo-input"><label>Page <input type="number" class="browser-default"
+  min="1" max="6" value="1" style="text-align: center; width: 2rem;"> of 6</label></li><li
+  class="waves-effect next" style="vertical-align: middle"><a href="/foo?page=2"  link-extra
+  rel="next" aria-label="next"><i class="material-icons">chevron_right</i></a></li></ul>'
+pagy/extras/materialize::#pagy_materialize_combo_nav_js#test_0002_renders intermediate page 1: '<ul
+  class="pagy-materialize-combo-nav-js pagination chip" role="navigation" aria-label="pager"
+  style="padding-right: 0" data-pagy-json="[&quot;combo_nav&quot;,3,&quot;<a href=\&quot;/foo?page=__pagy_page__\&quot;   style=\&quot;display:
+  none;\&quot;></a>&quot;]"><li class="waves-effect prev" style="vertical-align: middle"><a
+  href="/foo?page=2"   rel="prev" aria-label="previous"><i class="material-icons">chevron_left</i></a></li><li
+  class="pagy-combo-input"><label>Page <input type="number" class="browser-default"
+  min="1" max="6" value="3" style="text-align: center; width: 2rem;"> of 6</label></li><li
+  class="waves-effect next" style="vertical-align: middle"><a href="/foo?page=4"   rel="next"
+  aria-label="next"><i class="material-icons">chevron_right</i></a></li></ul>'
+pagy/extras/materialize::#pagy_materialize_combo_nav_js#test_0002_renders intermediate page 2: '<ul
+  id="test-nav-id" class="pagy-materialize-combo-nav-js pagination chip" role="navigation"
+  aria-label="pager" style="padding-right: 0" data-pagy-json="[&quot;combo_nav&quot;,3,&quot;<a
+  href=\&quot;/foo?page=__pagy_page__\&quot;  link-extra style=\&quot;display: none;\&quot;></a>&quot;]"><li
+  class="waves-effect prev" style="vertical-align: middle"><a href="/foo?page=2"  link-extra
+  rel="prev" aria-label="previous"><i class="material-icons">chevron_left</i></a></li><li
+  class="pagy-combo-input"><label>Page <input type="number" class="browser-default"
+  min="1" max="6" value="3" style="text-align: center; width: 2rem;"> of 6</label></li><li
+  class="waves-effect next" style="vertical-align: middle"><a href="/foo?page=4"  link-extra
+  rel="next" aria-label="next"><i class="material-icons">chevron_right</i></a></li></ul>'