Skip to content

Conversation

alionazherdetska
Copy link
Contributor

@alionazherdetska alionazherdetska commented Sep 24, 2025

📄 Description

This PR fixes accessibility issues in the post-breadcrumbs component by:

  • Wrapping breadcrumb items in proper <li> elements for semantic HTML structure
  • Moving aria-current="page" attribute from the breadcrumb item to the parent list item
  • Updating CSS selectors to target the new DOM structure (li[aria-current="page"] post-breadcrumb-item)

📝 Checklist

  • ✅ My code follows the style guidelines of this project
  • 🛠️ I have performed a self-review of my own code
  • 📄 I have made corresponding changes to the documentation
  • ⚠️ My changes generate no new warnings or errors
  • 🧪 I have added tests that prove my fix is effective or that my feature works
  • ✔️ New and existing unit tests pass locally with my changes

Copy link

changeset-bot bot commented Sep 24, 2025

🦋 Changeset detected

Latest commit: 2837732

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 12 packages
Name Type
@swisspost/design-system-components Patch
@swisspost/design-system-components-angular-workspace Patch
@swisspost/design-system-components-react Patch
@swisspost/design-system-documentation Patch
@swisspost/design-system-nextjs-integration Patch
@swisspost/design-system-components-angular Patch
@swisspost/design-system-styles Patch
@swisspost/design-system-tokens Patch
@swisspost/design-system-icons Patch
@swisspost/design-system-styles-primeng Patch
@swisspost/internet-header Patch
@swisspost/design-system-styles-primeng-workspace Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@swisspost-bot
Copy link
Contributor

swisspost-bot commented Sep 24, 2025

Related Previews

Copy link

Copy link
Contributor

@alizedebray alizedebray left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can't this be solve by adding a role="listitem" on the post-breadcrumb-item host?

@alionazherdetska
Copy link
Contributor Author

alionazherdetska commented Sep 29, 2025

I tried applying role=listitem directly on the <post-breadcrumb-item> host. However, this introduced another accessibility issue: automated checks (Axe) report Required ARIA parent role not present: list because the host is still a custom element, not a native <li>.

image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

<post-breadcrumbs> accessibility issue: List element has direct children that are not allowed
3 participants