Problem/Motivation

That axe reports: “<ul> and <ol> must only directly contain <li>, <script>, or <template>” because the ellipsis <li> has role="presentation".

Steps to reproduce

1. Install Drupal with Radix (e.g. 6.x) as the active theme (or a Radix subtheme).
2. Create enough content so a paged list appears (e.g. a view with a small “Items per page” so pagination shows).
3. Open a page that shows the pager (e.g. a listing with “Next »” / page numbers).
4. Run an accessibility checker (e.g. axe DevTools) on that page.
5. Observe the failure: rule “List element has direct children that are not allowed” — the pagination <ul> has <li> elements with role="presentation" (the ellipsis items), which violates the requirement that list elements only directly contain <li>, <script>, or <template>.

Proposed resolution

Remove role="presentation" from those <li>s
And use aria-hidden="true" on the inner span
And add a visually-hidden “More pages” label for screen readers(see MR)

Remaining tasks

User interface changes

API changes

Data model changes

Issue fork radix-3575475

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Comments

jeanwang2dev created an issue. See original summary.

jeanwang2dev’s picture

Status: Active » Needs review

doxigo made their first commit to this issue’s fork.

  • doxigo committed fabd1ee2 on 6.0.x authored by jeanwang2dev
    Issue #3575475: Fix pagination a11y by removing role=presentation from...
doxigo’s picture

Status: Needs review » Fixed

Perfect Jean, merged.

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.