🎨 Palette: [UX improvement] 악보 뷰어의 접근성 및 툴팁 개선

.Jules/palette.md

@@ -37,3 +37,6 @@
 ## 2026-07-02 - Inline clear buttons preserve focus
 **Learning:** Inline clear buttons often unmount immediately after clearing state, which can drop keyboard focus to the document body.
 **Action:** Move focus back to the owning input before clearing state, and cover the behavior with a DOM focus test.
+## 2026-08-04 - Accessible disabled buttons in test suites
+**Learning:** When testing accessible disabled buttons that use `aria-disabled="true"`, Jest-DOM's `.toBeDisabled()` will fail because it strictly checks for the native HTML `disabled` attribute.
+**Action:** Instead, query the button (e.g., `screen.getByRole("button", { name: ... })`) and use `.toHaveAttribute("aria-disabled", "true")` to assert its state.

apps/desktop/src/features/score/ScoreView.test.tsx

@@ -96,7 +96,7 @@ describe("ScoreView", () => {
 
     expect(screen.getByText("Scores attach to the active analysis project.")).toBeInTheDocument();
     expect(screen.getByRole("button", { name: "Add score" })).toBeDisabled();
-    expect(screen.getByRole("button", { name: "Open score: opener.pdf" })).toBeDisabled();
+    expect(screen.getByRole("button", { name: "Open score: opener.pdf" })).toHaveAttribute("aria-disabled", "true");
     expect(screen.getByRole("button", { name: "Remove: opener.pdf" })).toBeDisabled();
 
     fireEvent.click(screen.getByRole("button", { name: "Open score: opener.pdf" }));

apps/desktop/src/features/score/ScoreView.tsx

@@ -184,10 +184,11 @@ export function ScoreView({ song, projectId, onSongUpdate }: ScoreViewProps) {
                     <button
                       type="button"
                       onClick={projectId ? () => void openAttachment(projectId, attachment) : undefined}
-                      disabled={!projectId}
+                      aria-disabled={!projectId ? "true" : undefined}
                       aria-current={selected?.id === attachment.id ? "true" : undefined}
                       aria-label={`${t("scoreOpen")}: ${attachment.fileName}`}
-                      className="flex min-h-10 min-w-0 flex-1 items-center gap-2 text-left text-sm font-semibold text-slate-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-cyan-300 disabled:cursor-not-allowed disabled:opacity-60"
+                      title={!projectId ? t("scoreRequiresProject") : `${t("scoreOpen")}: ${attachment.fileName}`}
+                      className="flex min-h-10 min-w-0 flex-1 items-center gap-2 text-left text-sm font-semibold text-slate-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-cyan-300 aria-disabled:cursor-not-allowed aria-disabled:opacity-60"
                     >
                       <FileMusic className="size-4 shrink-0 text-cyan-300" aria-hidden="true" />
                       <span className="truncate">{attachment.fileName}</span>
@@ -198,6 +199,7 @@ export function ScoreView({ song, projectId, onSongUpdate }: ScoreViewProps) {
                       onClick={projectId ? () => void handleRemove(projectId, attachment) : undefined}
                       disabled={!projectId}
                       aria-label={`${t("scoreRemove")}: ${attachment.fileName}`}
+                      title={!projectId ? t("scoreRequiresProject") : `${t("scoreRemove")}: ${attachment.fileName}`}
                       className="size-10 border-rose-300/25 text-rose-200 hover:bg-rose-400/10"
                     >
                       <Trash2 className="size-4" aria-hidden="true" />

apps/desktop/src/features/score/ScoreViewer.tsx

@@ -258,6 +258,7 @@ export function ScoreViewer({ data, fileName, onStatusChange }: ScoreViewerProps
               size="icon-lg"
               className="size-12"
               aria-label={t("scoreViewerZoomOut")}
+              title={t("scoreViewerZoomOut")}
               onClick={zoomOut}
             >
               <ZoomOut aria-hidden="true" />
@@ -267,6 +268,7 @@ export function ScoreViewer({ data, fileName, onStatusChange }: ScoreViewerProps
               size="icon-lg"
               className="size-12"
               aria-label={t("scoreViewerZoomIn")}
+              title={t("scoreViewerZoomIn")}
               onClick={zoomIn}
             >
               <ZoomIn aria-hidden="true" />
@@ -292,6 +294,7 @@ export function ScoreViewer({ data, fileName, onStatusChange }: ScoreViewerProps
             size="icon-lg"
             className="size-14"
             aria-label={t("scoreViewerPrevPage")}
+            title={t("scoreViewerPrevPage")}
             disabled={pageNumber <= 1}
             onClick={goToPreviousPage}
           >
@@ -305,6 +308,7 @@ export function ScoreViewer({ data, fileName, onStatusChange }: ScoreViewerProps
             size="icon-lg"
             className="size-14"
             aria-label={t("scoreViewerNextPage")}
+            title={t("scoreViewerNextPage")}
             disabled={pageNumber >= pageCount}
             onClick={goToNextPage}
           >