Add the first note
This commit is contained in:
parent
ccd13c62a2
commit
39419a2a31
34
source/_notes/1.md
Normal file
34
source/_notes/1.md
Normal file
|
@ -0,0 +1,34 @@
|
||||||
|
---
|
||||||
|
title: Ellipsis in pager template fails accessibility tests
|
||||||
|
date: '2024-08-21 12:00:00'
|
||||||
|
tags:
|
||||||
|
- Drupal
|
||||||
|
- Accessibility
|
||||||
|
- ARIA
|
||||||
|
- Software Development
|
||||||
|
- Web Development
|
||||||
|
---
|
||||||
|
|
||||||
|
```html
|
||||||
|
<ul> and <ol> must only directly contain <li>, <script> or <template> elements
|
||||||
|
Ensures that lists are structured correctly
|
||||||
|
|
||||||
|
more informationLink opens in a new window
|
||||||
|
Element Location:
|
||||||
|
.pager__items
|
||||||
|
<ul class="pager__items js-pager__items">
|
||||||
|
To solve this problem, you need to fix the following:
|
||||||
|
List element has direct children that are not allowed: [role=presentation]
|
||||||
|
|
||||||
|
Related Node
|
||||||
|
<li class="pager__item pager__item--ellipsis" role="presentation">…</li>
|
||||||
|
```
|
||||||
|
|
||||||
|
Proposed resolution:
|
||||||
|
|
||||||
|
Replace `role="presentation"` with `aria-label="additional pages"`.
|
||||||
|
|
||||||
|
## Links
|
||||||
|
|
||||||
|
* <https://www.drupal.org/project/drupal/issues/3348552> (issue, currently "needs work").
|
||||||
|
* <https://www.drupal.org/node/3399874> (draft change record).
|
Loading…
Reference in a new issue