diff --git a/.changeset/odd-apples-smash.md b/.changeset/odd-apples-smash.md new file mode 100644 index 0000000000..e93e87b3c1 --- /dev/null +++ b/.changeset/odd-apples-smash.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-catalog': patch +--- + +Lighthouse was reporting this button as having invalid aria- values, as the popover doesn't exist until clicked. This adds additional labels to the button to make it valid aria diff --git a/plugins/catalog/src/components/EntityContextMenu/EntityContextMenu.tsx b/plugins/catalog/src/components/EntityContextMenu/EntityContextMenu.tsx index ee677c5238..5664186ab1 100644 --- a/plugins/catalog/src/components/EntityContextMenu/EntityContextMenu.tsx +++ b/plugins/catalog/src/components/EntityContextMenu/EntityContextMenu.tsx @@ -109,9 +109,12 @@ export function EntityContextMenu(props: EntityContextMenuProps) { aria-label="more" aria-controls="long-menu" aria-haspopup="true" + aria-expanded={!!anchorEl} + role="button" onClick={onOpen} data-testid="menu-button" className={classes.button} + id="long-menu" > @@ -121,6 +124,7 @@ export function EntityContextMenu(props: EntityContextMenuProps) { anchorEl={anchorEl} anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }} transformOrigin={{ vertical: 'top', horizontal: 'right' }} + aria-labelledby="long-menu" > {extraItems}