fix (DsfrPagination): 🐛 suppression des attributs title redondants avec le texte visible

Author: Trystan EVENO

src/components/DsfrPagination/DsfrPagination.spec.ts

@@ -8,16 +8,16 @@ describe('DsfrPagination', () => {
   it('should render a list of links to give quick access to several pages', async () => {
     // Given
     const pages = [
-      { label: '1', href: '/#', title: 'Page 1' },
-      { label: '2', href: '/#', title: 'Page 2' },
-      { label: '3', href: '/#', title: 'Page 3' },
-      { label: '4', href: '/#', title: 'Page 4' },
-      { label: '5', href: '/#', title: 'Page 5' },
+      { label: '1', href: '/#' },
+      { label: '2', href: '/#' },
+      { label: '3', href: '/#' },
+      { label: '4', href: '/#' },
+      { label: '5', href: '/#' },
     ]
     const currentPage = 1
 
     // When
-    const { getByTitle, emitted } = render(Pagination, {
+    const { getByText, emitted } = render(Pagination, {
       global: {
         components: {
           VIcon,
@@ -29,7 +29,7 @@ describe('DsfrPagination', () => {
       },
     })
 
-    const thirdLink = getByTitle('Page 3')
+    const thirdLink = getByText('3')
     await fireEvent.click(thirdLink)
 
     // Then

src/components/DsfrPagination/DsfrPagination.vue

@@ -48,7 +48,6 @@ const isCurrentPage = (page: Page) => props.pages.indexOf(page) === props.curren
           :href="pages[0]?.href"
           class="fr-pagination__link fr-pagination__link--first"
           :class="{ 'fr-pagination__link--disabled': currentPage === 0 }"
-          :title="firstPageTitle"
           :aria-disabled="currentPage === 0 ? true : undefined"
           @click.prevent="currentPage === 0 ? null : tofirstPage()"
         >
@@ -60,7 +59,6 @@ const isCurrentPage = (page: Page) => props.pages.indexOf(page) === props.curren
           :href="pages[Math.max(currentPage - 1, 0)]?.href"
           class="fr-pagination__link fr-pagination__link--prev fr-pagination__link--lg-label"
           :class="{ 'fr-pagination__link--disabled': currentPage === 0 }"
-          :title="prevPageTitle"
           :aria-disabled="currentPage === 0 ? true : undefined"
           @click.prevent="currentPage === 0 ? null : toPreviousPage()"
         >{{ prevPageTitle }}</a>
@@ -72,7 +70,6 @@ const isCurrentPage = (page: Page) => props.pages.indexOf(page) === props.curren
         <a
           :href="page?.href"
           class="fr-pagination__link fr-unhidden-lg"
-          :title="page.title"
           :aria-current="isCurrentPage(page) ? 'page' : undefined"
           @click.prevent="toPage(pages.indexOf(page))"
         >
@@ -86,7 +83,6 @@ const isCurrentPage = (page: Page) => props.pages.indexOf(page) === props.curren
           :href="pages[Math.min(currentPage + 1, pages.length - 1)]?.href"
           class="fr-pagination__link fr-pagination__link--next fr-pagination__link--lg-label"
           :class="{ 'fr-pagination__link--disabled': currentPage === pages.length - 1 }"
-          :title="nextPageTitle"
           :disabled="currentPage === pages.length - 1 ? true : undefined"
           :aria-disabled="currentPage === pages.length - 1 ? true : undefined"
           @click.prevent="currentPage === pages.length - 1 ? null : toNextPage()"
@@ -97,7 +93,6 @@ const isCurrentPage = (page: Page) => props.pages.indexOf(page) === props.curren
           :href="pages.at(-1)?.href"
           class="fr-pagination__link fr-pagination__link--last"
           :class="{ 'fr-pagination__link--disabled': currentPage === pages.length - 1 }"
-          :title="lastPageTitle"
           :disabled="currentPage === pages.length - 1 ? true : undefined"
           :aria-disabled="currentPage === pages.length - 1 ? true : undefined"
           @click.prevent="currentPage === pages.length - 1 ? null : toLastPage()"
@@ -112,7 +107,7 @@ const isCurrentPage = (page: Page) => props.pages.indexOf(page) === props.curren
 <style scoped>
 .fr-pagination__link:hover {
   background-image: linear-gradient(
-  deg, rgba(224,224,224,0.5), rgba(224,224,224,0.5));
+    deg, rgba(224,224,224,0.5), rgba(224,224,224,0.5));
 }
 .fr-pagination__link--disabled {
   color: currentColor;