Context
Axe-core reports nested-interactive (serious) on tables rendered via @material-table/core when column sorting is enabled. In RHDH / Backstage demos this surfaces as focusable controls nested inside MuiTableSortLabel (role="button").
Problem
Interactive / focusable descendants inside the sort label create nested interactive controls, which fail axe nested-interactive and are problematic for screen reader / keyboard users.
Setting options={{ draggable: false }} reduces some nesting from drag handles, but the sort-label nesting remains an upstream markup issue.
Expected
Header / sort controls should not nest focusable interactive elements (or should use a markup pattern that passes axe nested-interactive).
Environment
Ask
Please consider fixing the header/sort control DOM so consumers can keep axe nested-interactive enabled.
Context
Axe-core reports
nested-interactive(serious) on tables rendered via@material-table/corewhen column sorting is enabled. In RHDH / Backstage demos this surfaces as focusable controls nested insideMuiTableSortLabel(role="button").Problem
Interactive / focusable descendants inside the sort label create nested interactive controls, which fail axe
nested-interactiveand are problematic for screen reader / keyboard users.Setting
options={{ draggable: false }}reduces some nesting from drag handles, but the sort-label nesting remains an upstream markup issue.Expected
Header / sort controls should not nest focusable interactive elements (or should use a markup pattern that passes axe nested-interactive).
Environment
@material-table/core(observed with 3.2.x in BackstageTabledemos)Ask
Please consider fixing the header/sort control DOM so consumers can keep axe
nested-interactiveenabled.