Fix primefaces#13299: Paginator convert links to buttons

melloware · Feb 7, 2025 · d2963a1 · d2963a1
1 parent 081c590
commit d2963a1
Show file tree

Hide file tree

Showing 23 changed files with 31 additions and 34 deletions.
diff --git a/...ation-tests/src/test/java/org/primefaces/integrationtests/datatable/DataTable046Test.java b/...ation-tests/src/test/java/org/primefaces/integrationtests/datatable/DataTable046Test.java
@@ -51,7 +51,7 @@ void selectionMultipleWithPaging(Page page) throws InterruptedException {
         PrimeSelenium.waitGui().until(PrimeExpectedConditions.visibleAndAnimationComplete(dataTable));
 
         // Act
-        page.getWebDriver().findElement(By.className("ui-button")).click();
+        page.getWebDriver().findElement(By.className("ui-button-text-only")).click();
 
         // Assert
         assertMessage(page.messages, "Success", "Button Clicked!");

diff --git a/primefaces-themes/themes/primefaces-arya-blue/_variables.scss b/primefaces-themes/themes/primefaces-arya-blue/_variables.scss
@@ -451,7 +451,7 @@ $paginatorElementHoverIconColor:$shade000 !default;
 $paginatorElementMargin:0 .125em !default;
 $paginatorElementBorder:1px solid transparent !default;
 $paginatorElementHoverBorderColor:transparent !default;
-$paginatorElementBorderRadius:$borderRadius !default;
+$paginatorElementBorderRadius:50% !default;
 
 //datatable
 $datatableHeaderBorder:1px solid $shade600 !default;

diff --git a/primefaces-themes/themes/primefaces-arya-blue/theme.css b/primefaces-themes/themes/primefaces-arya-blue/theme.css
diff --git a/primefaces-themes/themes/primefaces-luna-amber/theme.css b/primefaces-themes/themes/primefaces-luna-amber/theme.css
diff --git a/primefaces-themes/themes/primefaces-luna-blue/theme.css b/primefaces-themes/themes/primefaces-luna-blue/theme.css
diff --git a/primefaces-themes/themes/primefaces-luna-common/_variables.scss b/primefaces-themes/themes/primefaces-luna-common/_variables.scss
@@ -427,7 +427,7 @@ $paginatorElementHoverIconColor:#dedede !default;
 $paginatorElementMargin:0 .125em !default;
 $paginatorElementBorder:1px solid transparent !default;
 $paginatorElementHoverBorderColor:transparent !default;
-$paginatorElementBorderRadius:$borderRadius !default;
+$paginatorElementBorderRadius:50% !default;
 
 //datatable
 $datatableHeaderBorder: $panelHeaderBorder !default;

diff --git a/primefaces-themes/themes/primefaces-luna-green/theme.css b/primefaces-themes/themes/primefaces-luna-green/theme.css
diff --git a/primefaces-themes/themes/primefaces-luna-pink/theme.css b/primefaces-themes/themes/primefaces-luna-pink/theme.css
diff --git a/primefaces-themes/themes/primefaces-mytheme/theme.css b/primefaces-themes/themes/primefaces-mytheme/theme.css
diff --git a/primefaces-themes/themes/primefaces-mytheme/variables/_data.scss b/primefaces-themes/themes/primefaces-mytheme/variables/_data.scss
@@ -50,7 +50,7 @@ $paginatorElementHoverBorderColor: transparent;
 
 /// Border radius of a paginator element
 /// @group data
-$paginatorElementBorderRadius: $borderRadius;
+$paginatorElementBorderRadius: 50%;
 
 /// Border of a datatable header
 /// @group data

diff --git a/primefaces-themes/themes/primefaces-nova-colored/theme.css b/primefaces-themes/themes/primefaces-nova-colored/theme.css
diff --git a/primefaces-themes/themes/primefaces-nova-common/_variables.scss b/primefaces-themes/themes/primefaces-nova-common/_variables.scss
@@ -427,7 +427,7 @@ $paginatorElementHoverIconColor:#333333 !default;
 $paginatorElementMargin:0 .125em !default;
 $paginatorElementBorder:1px solid transparent !default;
 $paginatorElementHoverBorderColor:transparent !default;
-$paginatorElementBorderRadius:$borderRadius !default;
+$paginatorElementBorderRadius:50% !default;
 
 //datatable
 $datatableHeaderBorder: $panelHeaderBorder !default;

diff --git a/primefaces-themes/themes/primefaces-nova-dark/theme.css b/primefaces-themes/themes/primefaces-nova-dark/theme.css
diff --git a/primefaces-themes/themes/primefaces-nova-light/theme.css b/primefaces-themes/themes/primefaces-nova-light/theme.css
diff --git a/primefaces-themes/themes/primefaces-saga-blue/_variables.scss b/primefaces-themes/themes/primefaces-saga-blue/_variables.scss
@@ -449,7 +449,7 @@ $paginatorElementHoverIconColor:$shade700 !default;
 $paginatorElementMargin:0 .125em !default;
 $paginatorElementBorder:1px solid transparent !default;
 $paginatorElementHoverBorderColor:transparent !default;
-$paginatorElementBorderRadius:$borderRadius !default;
+$paginatorElementBorderRadius:50% !default;
 
 //datatable
 $datatableHeaderBorder:1px solid $shade200 !default;

diff --git a/primefaces-themes/themes/primefaces-saga-blue/theme.css b/primefaces-themes/themes/primefaces-saga-blue/theme.css
diff --git a/primefaces-themes/themes/primefaces-vela-blue/_variables.scss b/primefaces-themes/themes/primefaces-vela-blue/_variables.scss
@@ -451,7 +451,7 @@ $paginatorElementHoverIconColor:$shade000 !default;
 $paginatorElementMargin:0 .125em !default;
 $paginatorElementBorder:1px solid transparent !default;
 $paginatorElementHoverBorderColor:transparent !default;
-$paginatorElementBorderRadius:$borderRadius !default;
+$paginatorElementBorderRadius:50% !default;
 
 //datatable
 $datatableHeaderBorder:1px solid $shade600 !default;

diff --git a/primefaces-themes/themes/primefaces-vela-blue/theme.css b/primefaces-themes/themes/primefaces-vela-blue/theme.css
diff --git a/primefaces/src/main/java/org/primefaces/component/api/UIPageableData.java b/primefaces/src/main/java/org/primefaces/component/api/UIPageableData.java
@@ -46,8 +46,8 @@ public class UIPageableData extends PrimeUIData implements Pageable, TouchAware
     public static final String PAGINATOR_TOP_RIGHT_CONTENT_CLASS = "ui-paginator-top-right-content";
     public static final String PAGINATOR_BOTTOM_LEFT_CONTENT_CLASS = "ui-paginator-bottom-left-content";
     public static final String PAGINATOR_BOTTOM_RIGHT_CONTENT_CLASS = "ui-paginator-bottom-right-content";
-    public static final String PAGINATOR_PAGE_CLASS = "ui-paginator-page ui-state-default";
-    public static final String PAGINATOR_ACTIVE_PAGE_CLASS = "ui-paginator-page ui-state-default ui-state-active";
+    public static final String PAGINATOR_PAGE_CLASS = "ui-paginator-page ui-button ui-button-flat ui-state-default";
+    public static final String PAGINATOR_ACTIVE_PAGE_CLASS = "ui-paginator-page ui-button ui-button-flat ui-state-default ui-state-active";
     public static final String PAGINATOR_CURRENT_CLASS = "ui-paginator-current";
     public static final String PAGINATOR_RPP_OPTIONS_CLASS = "ui-paginator-rpp-options ui-widget ui-state-default";
     public static final String PAGINATOR_RPP_LABEL_CLASS = "ui-paginator-rpp-label ui-helper-hidden";

diff --git a/primefaces/src/main/java/org/primefaces/component/paginator/PageLinkRenderer.java b/primefaces/src/main/java/org/primefaces/component/paginator/PageLinkRenderer.java
@@ -35,20 +35,17 @@ public class PageLinkRenderer {
     public void render(FacesContext context, Pageable pageable, String linkClass, String iconClass, boolean disabled) throws IOException {
         ResponseWriter writer = context.getResponseWriter();
         String styleClass = disabled ? linkClass + " ui-state-disabled" : linkClass;
-        int textIndex = iconClass.indexOf("seek-");
-        String text = String.valueOf(iconClass.charAt(textIndex + 5)).toUpperCase();
         String tabindex = (disabled) ? "-1" : "0";
 
-        writer.startElement("a", null);
-        writer.writeAttribute("href", "#", null);
+        writer.startElement("button", null);
+        writer.writeAttribute("type", "button", null);
         writer.writeAttribute("class", styleClass, null);
         writer.writeAttribute("tabindex", tabindex, null);
 
         writer.startElement("span", null);
         writer.writeAttribute("class", iconClass, null);
-        writer.writeText(text, null);
         writer.endElement("span");
 
-        writer.endElement("a");
+        writer.endElement("button");
     }
 }
diff --git a/primefaces/src/main/java/org/primefaces/component/paginator/PageLinksRenderer.java b/primefaces/src/main/java/org/primefaces/component/paginator/PageLinksRenderer.java
@@ -55,12 +55,12 @@ public void render(FacesContext context, Pageable pageable) throws IOException {
         for (int i = start; i <= end; i++) {
             String styleClass = currentPage == i ? UIPageableData.PAGINATOR_ACTIVE_PAGE_CLASS : UIPageableData.PAGINATOR_PAGE_CLASS;
 
-            writer.startElement("a", null);
+            writer.startElement("button", null);
             writer.writeAttribute("class", styleClass, null);
             writer.writeAttribute("tabindex", 0, null);
-            writer.writeAttribute("href", "#", null);
+            writer.writeAttribute("type", "button", null);
             writer.writeText((i + 1), null);
-            writer.endElement("a");
+            writer.endElement("button");
         }
 
         writer.endElement("span");

diff --git a/primefaces/src/main/resources/META-INF/resources/primefaces-saga-blue/theme.css b/primefaces/src/main/resources/META-INF/resources/primefaces-saga-blue/theme.css
diff --git a/primefaces/src/main/resources/META-INF/resources/primefaces/paginator/paginator.js b/primefaces/src/main/resources/META-INF/resources/primefaces/paginator/paginator.js
@@ -117,7 +117,7 @@ PrimeFaces.widget.Paginator = PrimeFaces.widget.BaseWidget.extend({
         var $this = this;
 
         //visuals for first,prev,next,last buttons
-        this.navigator.children('a.ui-state-default').on('mouseover.paginator', function(){
+        this.navigator.children('button.ui-state-default').on('mouseover.paginator', function(){
             var item = $(this);
             if(!item.hasClass('ui-state-disabled')) {
                 item.addClass('ui-state-hover');
@@ -299,7 +299,7 @@ PrimeFaces.widget.Paginator = PrimeFaces.widget.BaseWidget.extend({
     * @private
     */
    unbindEvents: function() {
-        var buttons = this.navigator.children('a.ui-state-default');
+        var buttons = this.navigator.children('button.ui-state-default');
         if (buttons.length > 0) {
             buttons.off();
         }
@@ -408,7 +408,7 @@ PrimeFaces.widget.Paginator = PrimeFaces.widget.BaseWidget.extend({
         //update dom
         this.pagesContainer.children().remove();
         for(var i = start; i <= end; i++) {
-            var styleClass = 'ui-paginator-page ui-state-default',
+            var styleClass = 'ui-paginator-page ui-button ui-button-flat ui-state-default',
             ariaLabel = this.ariaPageLabel.replace('{page}', (i+1)),
             ariaCurrentPage = '';
 
@@ -417,7 +417,7 @@ PrimeFaces.widget.Paginator = PrimeFaces.widget.BaseWidget.extend({
                 ariaCurrentPage = 'aria-current="page"';
             }
 
-            this.pagesContainer.append('<a class="' + styleClass + '" aria-label="' + ariaLabel + '" ' + ariaCurrentPage + ' tabindex="0" href="#">' + (i + 1) + '</a>');
+            this.pagesContainer.append('<button class="' + styleClass + '" aria-label="' + ariaLabel + '" ' + ariaCurrentPage + ' tabindex="0" type="button">' + (i + 1) + '</button>');
         }
 
         if(focusContainer) {