From 3551bf16ab06ec0e7f7353fe089a4034c73eb4f8 Mon Sep 17 00:00:00 2001
From: seonghobae <8172694+seonghobae@users.noreply.github.com>
Date: Sat, 5 Sep 2026 02:16:05 +0000
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20=ED=8F=BC=20=EC=A0=80?=
 =?UTF-8?q?=EC=9E=A5=20=EB=B2=84=ED=8A=BC=EC=97=90=20native=20disabled=20?=
 =?UTF-8?q?=EB=8C=80=EC=8B=A0=20aria-disabled=20=EC=86=8D=EC=84=B1=20?=
 =?UTF-8?q?=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 접근성을 위해 저장 버튼에 native `disabled` 대신 `aria-disabled="true"`를 사용하도록 수정.
- native disabled를 사용하면 포커스가 이동하지 않고(screen-reader 사용자 혼란), 버튼 이벤트가 차단되어 상태 설명 메시지(toast)를 띄울 수 없는 문제를 해결.
- `app.js`에서 폼 제출 이벤트를 인터셉트하여 `aria-disabled` 상태일 때 처리를 중단하고 "현재 사용할 수 없는 작업입니다." 토스트 메시지를 보여주도록 개선.
---
 app.js | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/app.js b/app.js
index a04aae71..f0e6b7c2 100644
--- a/app.js
+++ b/app.js
@@ -429,6 +429,13 @@ function bindTableEvents(renderDraftValidation, updateEditorDraftFromEvent) {
       return;
     }
     event.preventDefault();
+
+    const submitBtn = form.querySelector('button[type="submit"]');
+    if (submitBtn && submitBtn.getAttribute('aria-disabled') === 'true') {
+      showToast(submitBtn.title || '현재 사용할 수 없는 작업입니다.');
+      return;
+    }
+
     renderDraftValidation.flush();
     saveEditor();
   });
@@ -1068,7 +1075,11 @@ function renderEditorValidation() {
 
   const saveButton = form.querySelector('button[type="submit"]');
   if (saveButton) {
-    saveButton.disabled = errors.length > 0;
+    if (errors.length > 0) {
+      saveButton.setAttribute('aria-disabled', 'true');
+    } else {
+      saveButton.removeAttribute('aria-disabled');
+    }
     saveButton.title = errors.length > 0 ? '입력값을 올바르게 수정해야 저장할 수 있습니다.' : '저장 (Enter)';
   }