<a routerLink><button></button></a> yields two stops during keyboard navigation

[Galen Charlton]

As exemplified by the Patron View and Place Hold buttons in the action bar for record details in the Evergreen staff interface the construct <a routerLink><button></button></a> results in needing two hits of the tab button to move on when navigating the interface via keyboard. Regardless of whether the link or the button has focus, the action corresponding to the button happens when you hit enter.

I see this in both Firefox 122.0.1 and Chrome 121.0.6167.161 on Windows.

Desired behavior is that the control needs just one hit of the tab key to move away from.

Evergreen 3.11+

[Stephanie Leary (stephanieleary)]

We definitely should not have buttons nested inside links; in general, we can't have any interactive element nested inside any other.

Branch here: https://git.evergreen-ils.org/?p=working/Evergreen.git;a=shortlog;h=refs/heads/user/sleary/LP2052960-catalog-record-actions-nested-buttons

To test:

1. View any bib record (staff/catalog/record/210 will do)
2. Inspect the Patron View and Place Hold buttons below the bib summary box
3. Verify that the link tags do not contain button tags
4. Verify that both links still work

[Galen Charlton (gmc)]

Tested and signed off after resolving a merge conflict. Branch is user/gmcharlt/lp2052960_signoff

[Jane Sandberg (sandbergja)]

Thanks, Stephanie and Galen! Pushed to rel_3_11 and above.