fix(queue): name the queue header's two older actions
Clear queue and Add queue to playlist were named by a `title` attribute and nothing else, while the close button beside them has carried an `aria-label` since #24. They get one too. `title` is a name, so this is the weak-name case rather than the missing one: it is the *last* fallback in the accname order, so any content put inside the button later silently outranks it, and a phone has no hover to show it. The `title`s stay — on a desktop they are also the tooltip for an icon-only control, which is a different job. The assertion is the part worth reading. The obvious spec — `getByRole` by name, which is what `queue-overlay.spec.ts` already does for the close button — is **green on the broken build**: measured against the running pre-fix app, both buttons matched. So the second test states the property as what it is, that the name is not the tooltip: it removes the `title` attributes and asks again, which was 0 and 0 on main and is 1 and 1 now. Closes #170
This commit is contained in:
@@ -2201,11 +2201,25 @@ export class QueuePanel
|
||||
`
|
||||
: nothing}
|
||||
</div>
|
||||
<!-- **Every action here is named by aria-label**, like
|
||||
the close button #24 added beside them (#170). A
|
||||
title alone *is* a name, which is why a sweep for
|
||||
empty names reports these clean and why an
|
||||
assertion by role and name is green either way --
|
||||
but it is the weakest one: title is the last
|
||||
fallback in the accname order, so any content put
|
||||
inside the button later silently outranks it, and
|
||||
a phone has no hover to show it as a tooltip.
|
||||
|
||||
The titles stay. On a desktop they are the tooltip
|
||||
for an icon-only control, which is a different job
|
||||
from naming it, and aria-label does not do it. -->
|
||||
<div class="header-actions">
|
||||
<button
|
||||
class="header-action-button"
|
||||
@click=${() => void this.handleClearQueue()}
|
||||
?disabled=${tracks.length === 0}
|
||||
aria-label="Clear queue"
|
||||
title="Clear queue"
|
||||
>
|
||||
<wa-icon
|
||||
@@ -2216,6 +2230,7 @@ export class QueuePanel
|
||||
class="header-action-button add-to-playlist-button"
|
||||
@click=${this.handleAddToPlaylist}
|
||||
?disabled=${tracks.length === 0}
|
||||
aria-label="Add queue to playlist"
|
||||
title="Add queue to playlist"
|
||||
>
|
||||
<wa-icon
|
||||
|
||||
Reference in New Issue
Block a user