<ion-radio-button and <ion-radio-group setting invalid aria labelledby's (Elements cannot be found)

Ionic Framework
1

Please describe the question in detail and share your code, Hi Ionic team :waving_hand:

I’ve run into an accessibility issue flagged by axe-core on our app that uses Ionic’s ion-radio components. The axe-core report highlights invalid aria-labelledby attribute values on ion-radio and ion-radio-group elements.

Here’s a summary of the violations:

axe-core Report:

  • Element: <ion-radio-group role="radiogroup" aria-labelledby="ion-rg-0-lbl">
    Error: Invalid ARIA attribute value: aria-labelledby="ion-rg-0-lbl"
  • Element: <ion-radio value="full" aria-labelledby="ion-rb-0-lbl" role="radio">
    Error: Invalid ARIA attribute value: aria-labelledby="ion-rb-0-lbl"
  • Element: <ion-radio value="partial" aria-labelledby="ion-rb-1-lbl" role="radio">
    Error: Invalid ARIA attribute value: aria-labelledby="ion-rb-1-lbl"

The issue is that I cannot find these aria-labelledby IDs (ion-rg-0-lbl, ion-rb-0-lbl, ion-rb-1-lbl) in the DOM using the browser’s inspector tools. They’re not present in the HTML, but they’re still being referenced.

This is currently blocking our Axe Core tests from passing and I’m not sure how to work around it.

Thanks,

Vikram