fix: improve accessibility for menu items with toggle state (#753)

nkn2022 · Nisha Nair · web-flow · commit 928f9d762fff · 2025-04-29T11:21:18.000+01:00
* fix: improve accessibility for menu items with toggle state

* fix: clean up

---------

Co-authored-by: Nisha Nair &lt;nknair@Nishas-MacBook-Pro.local&gt;
diff --git a/packages/widgets/src/menu.ts b/packages/widgets/src/menu.ts
@@ -1369,7 +1369,12 @@ export namespace Menu {
           if (!data.item.isEnabled) {
             aria['aria-disabled'] = 'true';
           }
-          aria.role = 'menuitem';
+          if (data.item.isToggled) {
+            aria.role = 'menuitemcheckbox';
+            aria['aria-checked'] = 'true';
+          } else {
+            aria.role = 'menuitem';
+          }
       }
       return aria;
     }

Original file line number	Diff line number	Diff line change
`@@ -1369,7 +1369,12 @@ export namespace Menu {`
`1369`	`1369`	`if (!data.item.isEnabled) {`
`1370`	`1370`	`aria['aria-disabled'] = 'true';`
`1371`	`1371`	`}`
`1372`		`- aria.role = 'menuitem';`
	`1372`	`+ if (data.item.isToggled) {`
	`1373`	`+ aria.role = 'menuitemcheckbox';`
	`1374`	`+ aria['aria-checked'] = 'true';`
	`1375`	`+ } else {`
	`1376`	`+ aria.role = 'menuitem';`
	`1377`	`+ }`
`1373`	`1378`	`}`
`1374`	`1379`	`return aria;`
`1375`	`1380`	`}`