fix(data-ui): scope document action loading and WebDAV confirmation

docs/doctoring/webdav-write-confirmation-accessibility.md

@@ -0,0 +1,46 @@
+# WebDAV write-confirmation accessibility boundary
+
+Status: **Proposed** until the exact integrated PR head has current frontend/browser evidence and an independent accessibility review.
+
+## Problem
+
+The Data workspace can dispatch an explicit customer WebDAV write after the user selects a server-authoritative workspace document and a write-capable WebDAV source. The confirmation surface therefore changes customer-owned source-of-truth data when confirmed. A visual warning alone is insufficient: keyboard and assistive-technology users must receive the same bounded decision surface, and `aria-modal="true"` must not claim modality while pointer or keyboard interaction with the underlying page remains possible.
+
+A document action also captures the selected repository asset and, for WebDAV materialization, the selected WebDAV source before the request is dispatched. Allowing either selection to change while that action remains pending would let the completion/status UI appear beside a different document or source than the one actually submitted.
+
+## Constraints and decision
+
+Naruon keeps the confirmation as an `alertdialog` because it interrupts an explicit external-write action and requires a binary decision. The interaction contract is:
+
+- `aria-labelledby` and `aria-describedby` identify the warning and consequence;
+- `aria-modal="true"` is used only with a full-viewport modal layer that visually obscures and blocks pointer interaction with the underlying page;
+- opening moves focus to the non-destructive **취소** action;
+- Tab and Shift+Tab remain within the two confirmation actions;
+- Escape cancels without dispatching the provider write;
+- body scrolling is locked while the confirmation is open;
+- cancel and confirmed completion restore focus to the invoking WebDAV write control;
+- while any document action is pending, repository-asset and WebDAV-account selection are disabled so the visible selection cannot drift away from the request context; and
+- the confirmed provider request remains the existing server-authoritative, conflict-aware WebDAV materialization path rather than a client-side write.
+
+An inline `alertdialog` with `aria-modal="true"` was rejected. WAI-ARIA APG explicitly warns that `aria-modal="true"` is appropriate only when application code prevents interaction outside the dialog and the visual presentation also obscures outside content. A non-modal inline confirmation was also rejected because this action mutates a customer-owned external source and the existing product contract intentionally requires an interruptive confirmation.
+
+The implementation follows the same repository accessibility shape already used by `frontend/src/components/SourceDrawer.tsx`: visible modal layer, focus entry, keyboard containment, Escape handling, body scroll lock, and focus restoration. It does not introduce a new design-system dependency or claim that a shadcn/ui source component is being used.
+
+## Test and change traceability
+
+- `190fb909627074d15b03f750c72fec556510496c` introduced a focused component regression before the focus/keyboard repair.
+- `364895b7a246f35e0faacba163760315e2f78acd` restored focus entry, cyclic Tab/Shift+Tab, Escape cancellation, and invoker focus restoration while preserving the newer per-action busy-state changes.
+- `2e6881395e204083041aa92122a7df233d8b3edb` removed unrelated `.jules/codeql.md` and product-gap receipt changes from this product UI writer.
+- `e29f7e58ff1dbc4cb35c20d053016090de9a26ea` aligned the focused fixture with the typed WebDAV/account and repository-asset contracts.
+- `dfd8ec72a3f23e257b42853fbff4eb8d03350a7c` strengthened the regression so `aria-modal` must correspond to a full-viewport interaction boundary and body scroll lock.
+- `43cf974a50d69f3109893f73a53a97d40dd1d70f` implemented the full-viewport modal layer and scroll lock while retaining the focus contract.
+- `78c690de92e2767834c6fac99e331c263410063e` added the source-order regression that requires WebDAV-account and repository-asset selection to remain frozen during a pending document action.
+- `517c8e7ccd6081250ebbceba82dc1dac2fb533aa` disabled WebDAV-account selection and made repository-asset mouse/keyboard selection inert with `aria-disabled` while the action is pending.
+
+These commits establish source-order RED→repair provenance. They are not, by themselves, exact-head GREEN. Promotion from Proposed requires current-head frontend/component and browser/E2E checks without warning-class failures, plus the normal repository review gates.
+
+## References
+
+World Wide Web Consortium, Web Accessibility Initiative. (n.d.). *Alert and message dialogs pattern*. WAI-ARIA Authoring Practices Guide. https://www.w3.org/WAI/ARIA/apg/patterns/alertdialog/
+
+World Wide Web Consortium, Web Accessibility Initiative. (n.d.). *Dialog (modal) pattern*. WAI-ARIA Authoring Practices Guide. https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/

frontend/scripts/full-product-ui-smoke.mjs

@@ -1253,11 +1253,12 @@ async function runCriticalInteractionSmoke(page, routeSpec, viewportSpec) {
   }
 
   if (routeSpec.name === "data") {
-    await page.getByRole("button", { name: "임베딩 재생성 의도", exact: true }).click();
+    await page.getByRole("button", { name: "임베딩 재생성 요청 등록", exact: true }).click();
     await page.getByText("Embedding regeneration intent recorded", { exact: false }).waitFor({ state: "visible", timeout: 10_000 });
-    await page.getByRole("button", { name: "HWP 변환 의도", exact: true }).click();
+    await page.getByRole("button", { name: "HWP 변환 요청 등록", exact: true }).click();
     await page.getByText("HWP conversion intent recorded", { exact: false }).waitFor({ state: "visible", timeout: 10_000 });
-    await page.getByRole("button", { name: "WebDAV 문서 실행 요청", exact: true }).click();
+    await page.getByRole("button", { name: "고객 WebDAV에 문서 쓰기", exact: true }).click();
+    await page.getByRole("alertdialog").getByRole("button", { name: "WebDAV 쓰기 확인", exact: true }).click();
     await page.getByText("WebDAV materialization executed by the connector.", { exact: false }).waitFor({ state: "visible", timeout: 10_000 });
     await page.getByText("외부 쓰기 실행됨", { exact: false }).waitFor({ state: "visible", timeout: 10_000 });
     await page.getByRole("button", { name: "WebDAV 반영 의도 점검", exact: true }).click();

frontend/src/app/data/page.test.tsx

@@ -1903,7 +1903,7 @@ describe("DataPage", () => {
     expect(container.textContent).toContain("decision-note.md");
     expect(container.textContent).toContain("의도만 기록");
 
-    for (const buttonLabel of ["재파싱 실행", "임베딩 재생성 의도", "HWP 변환 의도"]) {
+    for (const buttonLabel of ["파싱 완료로 표시", "임베딩 재생성 요청 등록", "HWP 변환 요청 등록"]) {
       const button = Array.from(container.querySelectorAll("button")).find((candidate) =>
         candidate.textContent?.includes(buttonLabel),
       );
@@ -1919,12 +1919,28 @@ describe("DataPage", () => {
     expect(container.textContent).toContain("HWP conversion intent recorded");
 
     const materializeButton = Array.from(container.querySelectorAll("button")).find((candidate) =>
-      candidate.textContent?.includes("WebDAV 문서 실행 요청"),
+      candidate.textContent?.includes("고객 WebDAV에 문서 쓰기"),
     );
     expect(materializeButton).toBeDefined();
     await act(async () => {
       materializeButton?.dispatchEvent(new MouseEvent("click", { bubbles: true }));
     });
+    expect(fetchMock.mock.calls.some(([input]) => String(input).includes("webdav-materialization-intent"))).toBe(false);
+    expect(container.textContent).toContain("운영 문서 원본에 현재 문서를 기록합니다");
+
+    const cancelWriteButton = Array.from(container.querySelectorAll("button")).find((candidate) => candidate.textContent === "취소");
+    await act(async () => {
+      cancelWriteButton?.dispatchEvent(new MouseEvent("click", { bubbles: true }));
+    });
+    expect(fetchMock.mock.calls.some(([input]) => String(input).includes("webdav-materialization-intent"))).toBe(false);
+
+    await act(async () => {
+      materializeButton?.dispatchEvent(new MouseEvent("click", { bubbles: true }));
+    });
+    const confirmWriteButton = Array.from(container.querySelectorAll("button")).find((candidate) => candidate.textContent === "WebDAV 쓰기 확인");
+    await act(async () => {
+      confirmWriteButton?.dispatchEvent(new MouseEvent("click", { bubbles: true }));
+    });
 
     const materializeCall = fetchMock.mock.calls.find(([input]) => (
       String(input) === "/api/data/documents/doc_repository_ready/webdav-materialization-intent"
@@ -1965,6 +1981,160 @@ describe("DataPage", () => {
     expect(container.textContent).not.toContain("runner_req_data_doc_1");
   });
 
+  it("shows loading feedback only on the document action that is pending", async () => {
+    const fetchMock = mockWebdavFetch();
+    vi.stubGlobal("fetch", fetchMock);
+    container = document.createElement("div");
+    document.body.appendChild(container);
+    root = createRoot(container);
+
+    await act(async () => {
+      root?.render(<DataPage />);
+    });
+
+    const originalFetch = fetchMock.getMockImplementation();
+    const reparsePath = "/api/data/documents/doc_repository_ready/reparse";
+    let releaseReparse: (() => void) | null = null;
+    const pendingReparse = new Promise<ReturnType<typeof jsonResponse>>((resolve) => {
+      releaseReparse = () => resolve(jsonResponse({
+        document_id: "doc_repository_ready",
+        workspace_id: "workspace-org-acme",
+        document_name: "roadmap.md",
+        document_type: "text/markdown",
+        document_status: "parsed",
+        content_chars: 128,
+        provider_write_executed: false,
+        provenance: "server-authoritative",
+        audit_event: "data.document.reparsed",
+        message: "Document parse metadata refreshed in the signed workspace scope.",
+      }));
+    });
+    fetchMock.mockImplementation((input, init) => {
+      if (String(input) === reparsePath) return pendingReparse;
+      return originalFetch?.(input, init) ?? Promise.reject(new Error("missing fetch implementation"));
+    });
+
+    const findButton = (label: string) => Array.from(container?.querySelectorAll("button") ?? []).find((candidate) => (
+      candidate.textContent?.includes(label)
+    ));
+    const reparseButton = findButton("파싱 완료로 표시");
+    const embeddingButton = findButton("임베딩 재생성 요청 등록");
+    const hwpButton = findButton("HWP 변환 요청 등록");
+    const materializeButton = findButton("고객 WebDAV에 문서 쓰기");
+    expect(reparseButton).toBeDefined();
+    expect(embeddingButton).toBeDefined();
+    expect(hwpButton).toBeDefined();
+    expect(materializeButton).toBeDefined();
+
+    await act(async () => {
+      reparseButton?.dispatchEvent(new MouseEvent("click", { bubbles: true }));
+    });
+
+    expect(reparseButton?.getAttribute("aria-busy")).toBe("true");
+    expect(reparseButton?.textContent).toContain("상태 변경 중");
+    const documentFileInput = container?.querySelector('input[accept=".txt,.md,.markdown,text/plain,text/markdown"]');
+    expect(documentFileInput).toHaveProperty("disabled", true);
+    for (const button of [embeddingButton, hwpButton, materializeButton]) {
+      expect(button?.getAttribute("aria-busy")).toBe("false");
+      expect(button?.disabled).toBe(true);
+      expect(button?.textContent).not.toContain("요청 등록 중");
+      expect(button?.textContent).not.toContain("WebDAV에 쓰는 중");
+    }
+
+    await act(async () => {
+      releaseReparse?.();
+      await pendingReparse;
+      await Promise.resolve();
+      await Promise.resolve();
+    });
+  });
+
+  it.each([
+    [409, "문서 처리가 아직 끝나지 않았습니다. 처리가 완료된 후 재시도하세요."],
+    [422, "쓸 수 있는 문서 내용 또는 WebDAV 저장소를 확인한 후 재시도하세요."],
+    [401, "로그인이 만료되었습니다. 다시 로그인한 후 재시도하세요."],
+    [500, "문서 작업을 완료하지 못했습니다. 잠시 후 재시도하세요."],
+  ])("shows a bounded actionable document error for HTTP %s and allows retry", async (status, message) => {
+    const fetchMock = mockWebdavFetch();
+    const originalFetch = fetchMock.getMockImplementation();
+    let attempts = 0;
+    fetchMock.mockImplementation((input, init) => {
+      if (String(input).endsWith("/doc_repository_ready/reparse")) {
+        attempts += 1;
+        return Promise.resolve(jsonResponse({}, false, status));
+      }
+      return originalFetch?.(input, init) ?? Promise.reject(new Error("missing fetch implementation"));
+    });
+    vi.stubGlobal("fetch", fetchMock);
+    container = document.createElement("div");
+    document.body.appendChild(container);
+    root = createRoot(container);
+
+    await act(async () => {
+      root?.render(<DataPage />);
+      await Promise.resolve();
+      await Promise.resolve();
+    });
+    const findReparseButton = () => Array.from(container?.querySelectorAll("button") ?? []).find((candidate) => candidate.textContent?.includes("파싱 완료로 표시"));
+    await act(async () => {
+      findReparseButton()?.dispatchEvent(new MouseEvent("click", { bubbles: true }));
+      await Promise.resolve();
+      await Promise.resolve();
+    });
+    expect(container.textContent).toContain(message);
+    expect(findReparseButton()?.disabled).toBe(false);
+
+    await act(async () => {
+      findReparseButton()?.dispatchEvent(new MouseEvent("click", { bubbles: true }));
+      await Promise.resolve();
+      await Promise.resolve();
+    });
+    expect(attempts).toBe(2);
+  });
+
+  it("reports a connector failure after explicit WebDAV write confirmation", async () => {
+    const fetchMock = mockWebdavFetch();
+    const originalFetch = fetchMock.getMockImplementation();
+    fetchMock.mockImplementation((input, init) => {
+      if (String(input).endsWith("/doc_repository_ready/webdav-materialization-intent")) {
+        return Promise.resolve(jsonResponse({
+          document_id: "doc_repository_ready",
+          workspace_id: "workspace-org-acme",
+          document_name: "roadmap.md",
+          document_type: "text/markdown",
+          document_status: "parsed",
+          content_chars: 128,
+          provider_write_executed: false,
+          provenance: "server-authoritative",
+          audit_event: "data.document.webdav_materialization.dispatch_failed",
+          error_code: "connector_unavailable",
+          message: "dispatch failed",
+        }));
+      }
+      return originalFetch?.(input, init) ?? Promise.reject(new Error("missing fetch implementation"));
+    });
+    vi.stubGlobal("fetch", fetchMock);
+    container = document.createElement("div");
+    document.body.appendChild(container);
+    root = createRoot(container);
+
+    await act(async () => {
+      root?.render(<DataPage />);
+      await Promise.resolve();
+      await Promise.resolve();
+    });
+    const writeButton = Array.from(container.querySelectorAll("button")).find((candidate) => candidate.textContent?.includes("고객 WebDAV에 문서 쓰기"));
+    await act(async () => writeButton?.dispatchEvent(new MouseEvent("click", { bubbles: true })));
+    const confirmButton = Array.from(container.querySelectorAll("button")).find((candidate) => candidate.textContent === "WebDAV 쓰기 확인");
+    await act(async () => {
+      confirmButton?.dispatchEvent(new MouseEvent("click", { bubbles: true }));
+      await Promise.resolve();
+      await Promise.resolve();
+    });
+    expect(container.textContent).toContain("WebDAV 쓰기를 완료하지 못했습니다. 연결 상태를 확인한 후 재시도하거나 관리자에게 문의하세요.");
+    expect(container.textContent).not.toContain("connector_unavailable");
+  });
+
   it("loads signed data quality surface without public identity headers", async () => {
     const fetchMock = mockWebdavFetch();
     vi.stubGlobal("fetch", fetchMock);