Oh no bitwarden what the hell did you do to your website?
<a aria-label="go to https://bitwarden.com/products/personal/" data-testid="cta-link" class="plausible-event-name=navigation+drop+menu+click plausible-event-button=products+pm+personal ......
It keeps going on and on. And the result? A menu that reads like this to a screen reader:
link go to https://bitwarden.com/pricing/business/
link go to https://bitwarden.com/download/
link go to https://bitwarden.com/developers/
Can we collectively add a thing to VS Code that pops up a really big warning when you control s any file that has aria-label in it that says "You probably don't wanna do this!" and won't let you proceed until you enter a very good reason for why you did this, which is then inspectable in the html source for all of us to see?
@piggo@piggo.space@piggo it actually used to have one! But really, windows has one, mac has one, linux has one that works with chromium and firefox browsers. So I doubt having a screen reader in Chrome would have made them care enough to try before production.
@piggo@piggo.space@piggo on windows you press control windows enter, and on mac you press command f5. On most linux distros you should be able to turn it on with super s, or super alt s. Anything after that is actually using the screen reader itself, which is sadly necessary to test functionality meant for screen readers. Building one into Chrome probably won't help you here as it would need to be similarly complex. Otherwise, the functionality you're testing for would be missing in the screen reader. But in Bitwarden's case, turning on any screen reader, focusing the website and pressing tab a bunch would have caught this problem.
@piggo that said though, I believe chrome's dev tools have an accessibility inspector which should have also definitely made this pretty obvious, no screen reader required.
@piggo ah well I'm trying it now and that does not seem to be quite as obvious as I expected. I'm still really confused as to how aria labels like that could happen though. I don't really understand.
@piggo@piggo.space@piggo yeah that is very unfortunate actually, because the aria is completely useless. Something that automated testing just won't catch I suppose since it wouldn't know what a good label would be.
@piggo the confusing bit is somebody somewhere decided the full URL of each page, including querystrings and all, would be a good aria label.
@piggo@piggo.space@piggo yup, probably something component related as that HTML definitely does not look remotely hand written.