🎨 Palette: 비동기 로딩 상태의 인터랙티브 테이블 행 비활성화 상태 추가

.jules/palette.md

@@ -81,3 +81,6 @@
 ## 2026-08-12 - Skip to Content Accessibility
 **Learning:** Screen reader and keyboard-only users experience significant friction when forced to navigate through repetitive header controls on every page load.
 **Action:** Keep a visible-on-focus skip link as the first interactive element, target a programmatically focusable main container, and give the focused link a high-contrast outline.
+## 2026-08-14 - 비동기 테이블 행(row) 인터랙션 방지 (aria-disabled)
+**Learning:** `pointer-events: none` CSS 속성은 마우스 이벤트만 막을 뿐, `Enter` 또는 `Space` 등의 키보드 인터랙션은 방지하지 못합니다. 또한 테이블 행(`<tr>`)에는 `:disabled` 가상 선택자가 동작하지 않기 때문에 비동기 작업 시 화면 낭독기가 비활성 상태를 인지하지 못합니다.
+**Action:** 클릭형 테이블 행의 비동기 처리 시에는 `aria-disabled="true"`를 부여하고, 이를 CSS(`opacity: 0.6`, `pointer-events: none`)와 연동함은 물론 자바스크립트 이벤트 핸들러(키보드/클릭 모두)에서 명시적으로 `aria-disabled` 값을 검사하여 조기 반환(`return`)하도록 처리해야 합니다.

scanner/dashboard/console.html

@@ -36,6 +36,7 @@
   th{font-size:11px;color:var(--muted);text-transform:uppercase}
   tr.scan{cursor:pointer}
   tr.scan:hover{background:var(--bg)}
+  tr.scan[aria-disabled="true"]{pointer-events:none;opacity:0.6}
   input:focus-visible, button:focus-visible, tr.scan:focus-visible, .bar:focus-visible, #detail:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
   .close-btn{float:right;border:0;background:transparent;font-size:16px;cursor:pointer;color:var(--muted);padding:0 4px;margin-top:-2px}
   .close-btn:hover{color:var(--text)}
@@ -88,6 +89,7 @@ <h1>AppGuardrail Console</h1>
   detail.innerHTML="";
   if(lastDetailFocus instanceof HTMLElement && lastDetailFocus.isConnected){
     lastDetailFocus.removeAttribute("aria-busy");
+    lastDetailFocus.removeAttribute("aria-disabled");
     delete lastDetailFocus.dataset.detailRequest;
     lastDetailFocus.focus();
   }
@@ -135,8 +137,17 @@ <h1>AppGuardrail Console</h1>
       <td>${esc(s.created_at)}</td><td>${esc(s.repo||"—")}</td><td><code>${esc((s.commit||"—").slice(0,10))}</code></td>
       <td>${s.total}</td><td>${pill(s.deploy_blocking,"var(--crit)")}</td><td>${pill(s.new_blocking,"var(--high)")}</td></tr>`).join("")||'<tr><td colspan="6" class="muted">No scans. POST to /api/v1/scans from CI.</td></tr>';
     document.querySelectorAll("tr.scan").forEach(tr=>{
-      tr.onclick=()=>detail(tr.dataset.id,tr);
-      tr.addEventListener('keydown', e => { if(e.key === 'Enter' || e.key === ' ') { e.preventDefault(); detail(tr.dataset.id,tr); } });
+      tr.onclick=()=>{
+        if(tr.getAttribute("aria-disabled")==="true") return;
+        detail(tr.dataset.id,tr);
+      };
+      tr.addEventListener('keydown', e => {
+        if(e.key === 'Enter' || e.key === ' ') {
+          e.preventDefault();
+          if(tr.getAttribute("aria-disabled")==="true") return;
+          detail(tr.dataset.id,tr);
+        }
+      });
     });
   }catch(e){ $("#msg").classList.remove("hidden");$("#app").classList.add("hidden");
     $("#msg").innerHTML=`<span class="err">${esc(e.message)}</span>`; }
@@ -149,6 +160,7 @@ <h1>AppGuardrail Console</h1>
   if(tr){
     tr.dataset.detailRequest=String(requestId);
     tr.setAttribute("aria-busy","true");
+    tr.setAttribute("aria-disabled","true");
   }
   d.classList.remove("hidden");
   d.innerHTML='<div aria-live="polite" class="muted">Loading scan details...</div>';
@@ -173,6 +185,7 @@ <h1>AppGuardrail Console</h1>
   }finally{
     if(tr&&tr.dataset.detailRequest===String(requestId)){
       tr.removeAttribute("aria-busy");
+      tr.removeAttribute("aria-disabled");
       delete tr.dataset.detailRequest;
     }
   }

tests/test_console_detail_loading_contract.py

@@ -37,3 +37,14 @@ def test_console_detail_scrolling_respects_reduced_motion():
     assert "element.scrollIntoView();" in html
     assert 'element.scrollIntoView({behavior:"smooth"});' in html
     assert html.count("scrollDetailIntoView(d);") == 2
+
+def test_console_disables_pending_detail_rows_until_their_request_settles():
+    """Pointer and keyboard activation stay blocked while one row request is pending."""
+    html = _console_html()
+
+    assert 'tr.scan[aria-disabled="true"]{pointer-events:none;opacity:0.6}' in html
+    assert html.count('if(tr.getAttribute("aria-disabled")==="true") return;') == 2
+    assert 'tr.setAttribute("aria-disabled","true");' in html
+    assert 'lastDetailFocus.removeAttribute("aria-disabled");' in html
+    assert 'tr.removeAttribute("aria-disabled");' in html
+    assert 'tr.dataset.detailRequest===String(requestId)' in html