search

hperrin / svelte-material-ui

Svelte Material UI Components
https://sveltematerialui.com/
Apache License 2.0
3.33k stars 285 forks source link

role not set on list items on drawer #604

Open dmlayton opened 1 year ago

dmlayton commented 1 year ago

On all Drawer examples, the role for list is set as "list", but role is not set for the items (should be "listitem"). Running lighthouse for accessibility on the demo will reproduce the issue. Role is not set on items in the list demo either, but not warning is thrown -- I presume because the role are clear from the tags i.e. "li".

I poked around but was unable to set the role through the role prop on Item unless I set wrapper to true (which causes other issues).

dmlayton commented 1 year ago

Is it maybe this? In List.svelte the role is lookup from context: let role = getContext<string | undefined>('SMUI:list:role');

So if this fails, then this happens: if (!role) { if (singleSelection) { role = 'listbox'; setContext('SMUI:list:item:role', 'option'); } else if (radioList) { role = 'radiogroup'; setContext('SMUI:list:item:role', 'radio'); } else if (checkList) { role = 'group'; setContext('SMUI:list:item:role', 'checkbox'); } else { role = 'list'; setContext('SMUI:list:item:role', undefined); } } should it not be listitem rather than undefined?

dmlayton commented 1 year ago

Nope seems like just adding {role} to svelte:component in Item.svelte works.