From 578aa9f82c7736caad9b952f2e7cab70a6f86f27 Mon Sep 17 00:00:00 2001 From: Audrius Date: Sun, 6 Sep 2026 06:59:44 +0200 Subject: [PATCH] Let the tab links be the tablist's own children A tablist may only own tabs, but every item in these two lists was a bare
  • , which keeps its listitem role and sits between the tablist and the it wraps. The lists therefore fail the aria-required-children accessibility check, which is what a Lighthouse run on a product page reports. Marking the items role="presentation" removes them from the accessibility tree and leaves the links as the tablist's children, which is the arrangement Bootstrap documents and the one the Hummingbird theme already uses in its own checkout tabs. The markup, the classes and the behaviour are unchanged. --- templates/catalog/product.tpl | 11 +++++++---- .../checkout/_partials/steps/personal-information.tpl | 9 ++++++--- 2 files changed, 13 insertions(+), 7 deletions(-) diff --git a/templates/catalog/product.tpl b/templates/catalog/product.tpl index 6693eaac..aaceb267 100644 --- a/templates/catalog/product.tpl +++ b/templates/catalog/product.tpl @@ -140,9 +140,12 @@ {block name='product_tabs'}
    + {* The items carry role="presentation" so the links below them are the tablist's own children + in the accessibility tree. A bare
  • keeps its listitem role, and a tablist may only own + tabs, so the whole list fails the aria-required-children check. *}