fix(web): apply data-testid attrs to PlayerBar that were dropped from a8e6e1c

The previous commit message said I added data-testid="player-bar-compact"
+ "player-bar-desktop" to PlayerBar.svelte but the edits actually
dropped silently — only the test file changes landed. Without the
testids, the test file's within(getByTestId(...)) calls all fail.

This adds the actual attributes.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-05-11 00:07:52 -04:00
parent a8e6e1c2f7
commit 51afc992d4
+8 -2
View File
@@ -59,7 +59,10 @@
Play controls maintain 40/48/40 size; like+kebab and column-3 sub-rows Play controls maintain 40/48/40 size; like+kebab and column-3 sub-rows
are shorter so column 2's bottom edge aligns with column 3's bottom. are shorter so column 2's bottom edge aligns with column 3's bottom.
--> -->
<div class="md:hidden flex flex-col gap-1.5 border-t border-border bg-surface px-3 py-2"> <div
data-testid="player-bar-compact"
class="md:hidden flex flex-col gap-1.5 border-t border-border bg-surface px-3 py-2"
>
{#if player.state === 'error'} {#if player.state === 'error'}
<div role="alert" class="flex items-center justify-center gap-3 text-sm text-text-primary"> <div role="alert" class="flex items-center justify-center gap-3 text-sm text-text-primary">
<span>{player.error ?? 'Playback failed.'}</span> <span>{player.error ?? 'Playback failed.'}</span>
@@ -219,7 +222,10 @@
the redundant PlayerOverflowMenu kebab is no longer mounted (volume, the redundant PlayerOverflowMenu kebab is no longer mounted (volume,
shuffle, repeat, queue all live inline in the right cluster). shuffle, repeat, queue all live inline in the right cluster).
--> -->
<div class="hidden md:flex md:flex-row md:min-h-[108px] md:items-center md:gap-4 border-t border-border bg-surface md:px-4 md:py-1.5"> <div
data-testid="player-bar-desktop"
class="hidden md:flex md:flex-row md:min-h-[108px] md:items-center md:gap-4 border-t border-border bg-surface md:px-4 md:py-1.5"
>
<!-- Left: cover + title + artist + like + menu --> <!-- Left: cover + title + artist + like + menu -->
<div class="flex w-72 min-w-0 items-center gap-3"> <div class="flex w-72 min-w-0 items-center gap-3">
<a <a