How to fix aria progressbar name on Adobe Commerce (Magento)

Steps for Adobe Commerce (Magento)

1. Progress bars in Adobe Commerce appear in: checkout step progress (Magento_Checkout module), product review rating bars, and password-strength meters.
2. For checkout step progress: the template is vendor/magento/module-checkout/view/frontend/templates/progress.phtml (or its override in app/design/frontend/<Vendor>/<Theme>/Magento_Checkout/templates/progress.phtml). Add aria-label='Checkout step progress' to the progress bar element in this file — always use a theme override rather than editing vendor files directly.
3. For review/rating bars: override app/design/frontend/<Vendor>/<Theme>/Magento_Review/templates/review.phtml and add aria-label='Customer rating' to the rating bar element.
4. For password-strength meters: override the relevant template in Magento_Customer (template: customer/widget/form/element/password.phtml) and add aria-label='Password strength' to the meter/progressbar element.
5. Run bin/magento cache:clean and bin/magento setup:static-content:deploy after making template changes.
6. Verify with the axe DevTools browser extension.

What is aria progressbar name?

A progress bar (any element with role="progressbar", or an HTML `<progress>` element) must have a human-readable name so that assistive technologies like screen readers know what the bar is measuring — for example "Order shipping progress" or "Password strength". Without a name, a screen reader user hears something useless like "progress bar, 60%" with no context about what is progressing. The fix is almost always adding a single HTML attribute — `aria-label` or `aria-labelledby` — directly to the element.

This issue violates WCAG 2.1 Success Criterion 1.1.1 (Non-text Content, Level A) — the lowest, most broadly required accessibility level. Failing Level A criteria creates legal exposure in jurisdictions that mandate web accessibility (including the ADA in the US, EAA in the EU, and AODA in Canada). For an ecommerce store, progress bars typically appear during checkout (multi-step progress), password-strength meters, review ratings, loyalty-point trackers, and shipping status — all high-value, conversion-critical moments. A customer using a screen reader who cannot understand a progress bar at checkout may abandon the purchase entirely. Fixing this is a quick-win code change that reduces legal risk and directly protects conversion rates for the roughly 7 million screen-reader users who shop online.

See the complete Aria progressbar name guide for every platform and the full background.