From a1cdfef773bdbf3ce1c6b63c4acb52ed34bd8c2d Mon Sep 17 00:00:00 2001
From: seonghobae <8172694+seonghobae@users.noreply.github.com>
Date: Sun, 4 Oct 2026 04:57:30 +0000
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20=EC=97=85=EB=A1=9C?=
 =?UTF-8?q?=EB=93=9C=20=ED=94=84=EB=A1=9D=EC=8B=9C=20=EB=B2=84=ED=8A=BC=20?=
 =?UTF-8?q?=EC=B6=94=EA=B0=80=20=EB=B0=8F=20=EC=A0=91=EA=B7=BC=EC=84=B1=20?=
 =?UTF-8?q?=EA=B0=9C=EC=84=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

대시보드의 파일 업로드 버튼(input[type=file])은 기본 브라우저 스타일링으로 인해 시각적으로 눈에 잘 띄지 않으며 UI/UX 일관성을 저해하는 문제가 있었습니다. 이를 해결하기 위해 기존 파일 입력을 시각적으로 숨기고(`sr-only`, `aria-hidden="true"`, `tabindex="-1"` 사용) 접근성이 보장된 커스텀 프록시 버튼을 추가했습니다. 자바스크립트를 사용해 프록시 버튼과 네이티브 파일 입력을 연결함으로써 마우스와 키보드 모두를 통한 원활한 파일 업로드 조작이 가능하도록 개선했습니다. 변경 사항과 관련된 UI 및 접근성 확인 테스트 코드 또한 함께 작성했습니다.
---
 .jules/palette.md            |  4 ++++
 scanner/dashboard/index.html | 12 +++++++++++-
 tests/test_dashboard_core.py | 12 +++++++++++-
 3 files changed, 26 insertions(+), 2 deletions(-)

diff --git a/.jules/palette.md b/.jules/palette.md
index ea004e2d2..ef0f653f6 100644
--- a/.jules/palette.md
+++ b/.jules/palette.md
@@ -81,3 +81,7 @@
 ## 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.
+
+## 2024-10-04 - 네이티브 파일 입력(Input File) 요소를 접근성 높은 프록시 버튼으로 대체
+**Learning:** `aria-hidden="true"`는 파일 입력 요소를 접근성 트리에서 제거(explicitly removes from the Accessibility Object Model)하며, 시각적으로 숨기기 위해 `class="sr-only" tabindex="-1"`을 함께 사용하여야 스크린 리더와 키보드 접근성을 유지하면서 커스텀 버튼 디자인을 노출시킬 수 있다는 사실을 확인했습니다.
+**Action:** 향후 파일 업로드 UI를 개선할 때는 인라인 `onclick` 대신 명시적인 자바스크립트 이벤트 리스너를 바인딩하고 접근성 속성을 올바르게 적용합니다.
diff --git a/scanner/dashboard/index.html b/scanner/dashboard/index.html
index 132bc31b2..fbe642876 100644
--- a/scanner/dashboard/index.html
+++ b/scanner/dashboard/index.html
@@ -93,7 +93,8 @@
   <span class="logo"></span><span class="brand">AppGuardrail</span>
   <span class="spacer"></span>
   <span class="meta" id="src">no findings loaded</span>
-  <input type="file" id="file" accept="application/json,.json" aria-label="Upload findings file" style="margin-left:12px">
+  <button type="button" id="header-browse-findings" class="primary-action">Upload findings</button>
+  <input type="file" id="file" class="sr-only" tabindex="-1" aria-hidden="true" accept="application/json,.json">
 </header>
 <p id="findings-summary" class="sr-only" role="status" aria-live="polite" aria-atomic="true"></p>
 <main id="app" tabindex="-1"></main>
@@ -388,6 +389,15 @@ <h1>Dashboard</h1>
     if(isDeployBlocking(f)!==expect) console.error('selftest FAIL', f, 'expected', expect);
   }
 })();
+
+(function() {
+  const headerBrowseFindings = document.getElementById('header-browse-findings');
+  const fileInput = document.getElementById('file');
+  if (headerBrowseFindings && fileInput) {
+    headerBrowseFindings.addEventListener('click', () => fileInput.click());
+  }
+})();
+
 </script>
 </body>
 </html>
\ No newline at end of file
diff --git a/tests/test_dashboard_core.py b/tests/test_dashboard_core.py
index 75a5809f8..e713eff04 100644
--- a/tests/test_dashboard_core.py
+++ b/tests/test_dashboard_core.py
@@ -77,7 +77,6 @@ def test_dashboard_rows_are_keyboard_accessible():
     assert 'tabindex="0" role="button"' in html
     assert 'title="View details for finding"' in html
     assert "tbody tr:focus-visible" in html
-    assert "aria-label=\"Upload findings file\"" in html
     assert "aria-label=\"Search findings\"" in html
     assert "aria-label=\"Filter by severity\"" in html
     assert "tr.addEventListener('keydown'" in html
@@ -302,3 +301,14 @@ def test_dashboard_search_escape_clears_input():
     assert "e.key === 'Escape'" in html
     assert "query = '';" in html
     assert "render();" in html
+
+def test_file_upload_proxy_accessibility_contract():
+    html = dashboard_index_path().read_text(encoding="utf-8")
+    assert 'class="sr-only"' in html and 'tabindex="-1"' in html and 'aria-hidden="true"' in html, "Hidden file input missing exact accessibility hiding attributes"
+    assert "headerBrowseFindings.addEventListener('click', () => fileInput.click())" in html, "Missing exact event listener wiring"
+
+def test_file_upload_proxy_accessibility_contract_is_documented_accurately():
+    path = dashboard_index_path().parent.parent.parent / ".jules" / "palette.md"
+    assert path.exists(), "Journal missing"
+    content = path.read_text(encoding="utf-8")
+    assert '`aria-hidden="true"`는 파일 입력 요소를 접근성 트리에서 제거' in content, "Missing exact documentation statement"