Files
HMDesign/docs/org-chart/implementation-report-p6.1.md

9.4 KiB

HMDesign OrgChart P6.1 — 연결선 접근성 및 배포 품질 보완

RESULT: PASS (요청한 P1 1건·P2 2건의 변경 범위)

Auto 관계선 대비, 과거 브라우저 runner의 도구 경로, 두 배포 README의 링크를 수정했다. Fixed CSS·Core/React API·레이아웃 알고리즘·회사 프리셋·package.json·lockfile은 변경하지 않았다. 전체 운영 배포 인증 또는 기존 미검증 영역 승인으로 확대하지 않는다.

작업 환경과 Git

  • 저장소: D:\디자인시스템\HMDesign-orgchart-package
  • 범위: BOTH의 기존 공통 Core Auto CSS 및 검증 도구·패키지 문서. 신규 UI/Story 없음.
  • 브랜치 및 시작/종료 HEAD: feature/orgchart-package, d2b76e766466e1f156f6a0f8f63710e023af900e
  • origin: https://gitea.hmac.kr/b25027/HMDesign.git. 읽기 전용 git ls-remote의 feature SHA도 일치했다. 최초 sandbox 네트워크 오류 후 허용된 실행 환경에서 확인했다.
  • Git 작성자 유지: b25027 / shkim4@samaneng.com
  • 기존 미커밋 파일: untracked docs/org-chart/quality-diagnosis-p6.md 1개. 수정하지 않았다. 최종 SHA-256: 224aa06880b9cad222f510b6e633d5b0faccece742f720584fd2b42912cdb10f.
  • 최종 Working Tree: 기존 추적 파일 23개 수정, 이번 신규 문서 2개·실행 도우미 1개, 기존 untracked P6 보고서 1개. 실행기·로그·캡처·Tarball은 ignored test-results/org-chart-p6-1/에 보존했다.
  • Staged diff 없음. Stage·Commit·Push·Merge·PR·main Checkout·Reset·Rebase·Clean·Force Push 미진행.

수정 결과

항목 수정 및 검증 결과
P1 Auto 대비 Auto 전용 --hm-orgchart-expanded-line-color: #738399. 부모/자식 pseudo 관계선과 직원 SVG path만 참조한다. 이전 computed rgb(186, 199, 215) → rgb(115, 131, 153). 흰 배경 1.7159036307:1 → 3.8635120805:1.
배경·상태 browser computed 배경/색상·opacity·background image/filter/blend를 기록하고 투명 배경을 합성했다. 기본 실제 관계선 배경은 흰색이다. 기존 light surface override rgb(240, 241, 242)도 3.4163257790:1. Zoom/Pan 좌표 probe가 반환한 content 배경 rgb(244,247,251)의 보수적 비율은 3.5956293943:1이며, 이 probe에는 viewport 밖의 clipped 좌표도 포함될 수 있다. 최소 확인 비율은 3.4163:1. 임의 외부 배경 재정의는 별도 검증이 필요하다.
기준 내용을 전달하는 그래픽의 인접 색상 대비 3:1 이상 충족. W3C SC 1.4.11. Anti-aliasing/전체 Fit의 축소는 기존 상태이며 굵기를 변경하지 않았다.
기존 스타일 같은 페이지에서 수정 전 공개 CSS → 수정 후 CSS를 교체하여 Fixed 전체 DOM의 관련 computed 스타일 및 ::before/::after를 비교했다. Fixed 연결선·협업 화살표·카드 스타일 불변. Auto 직원 path 좌표·굵기, 카드 offset/크기·Border·회사 accent 불변.
P2 실행 경로 Core 17개·React 2개 runner가 공통 scripts/orgchart-browser-runtime.mjs를 사용한다. 기본은 표준 프로젝트 playwright 모듈 및 관리 Chromium. 기존 외부 모듈·브라우저는 ORGCHART_PLAYWRIGHT_MODULE / ORGCHART_CHROME으로 선택형 지정. 하드코딩된 개인 경로·고정 Chrome 경로 제거. 원래 모듈/실행 오류를 cause와 함께 안내한다.
새 PC 경로 이식성·선택형 환경변수·오류 메시지 검증 PASS. 이 PC의 프로젝트에는 Playwright가 없어 이미 설치된 외부 모듈과 Chrome을 환경변수로 지정하여 실제 실행했다. 신규 설치/업그레이드 없음. 실제 다른 PC의 fresh install과 실행은 NOT VERIFIED. 기존 fixture·baseline·서버 origin 전제는 유지한다. 실행 안내.
P2 README Core 4개, React 3개 링크(타 패키지 README 상대링크 포함), 총 7개를 기존 문서가 존재하는 공식 Gitea 고정 Commit URL로 교체했다. 문서 복사·배포 파일 구조 변경 없음.
Tarball Build 후 npm pack --ignore-scripts로 실제 2개 tgz 생성·추출. README의 깨진 상대 링크 0개, 외부 URL 형식/고정 Commit의 Git blob 존재 7/7. 공개 export 대상 파일과 README named import/type export 일치. Gitea URL의 HTTP 접근 권한은 별도 NOT VERIFIED(저장소 권한 필요 가능).

검증 결과와 재사용

검증 결과·범위
Core Typecheck / Build PASS / PASS, 기존 workspace 명령 사용
React Typecheck / Build PASS / PASS, 공통 Core 공개 선언 기반
변경 범위 브라우저 17/17 PASS, 실제 Chrome. 300명·7회사, 부모/자식 3종 및 직원 관계선 computed 대비, 제목 Hover, Enter 접기/Space 펼치기, 회사 단일/복수 선택, UI Zoom·실제 pointer Pan·Fit, 기존 light background override 포함. 콘솔/page/request 오류 0.
실행기·패키지 감사 87/87 PASS. 19개 runner 및 공통 helper syntax, 도구 연결 변경을 제외한 원래 시나리오/Assert/기대값의 텍스트 동일성, PC 경로 제거, 기본/선택형 도구 설정과 명확한 실패, Tarball 링크·공개 export/import/type, git diff --check. 실제 과거 전체 suite 실행 수가 아니다.
기존 P6 브라우저 59/59 PASS 재사용. 전체 재실행 없음.
기존 패키지·CSS Export/Tarball/타입 16/16, CSS 격리 9/9, Noto Sans KR PASS 재사용. 이번 pack 링크 검사는 변경된 README에 대한 보완이며 과거 증거를 덮어쓰지 않았다.
기존 Guard Static 및 연결 Runtime PASS 재사용. 제품 bootstrap/import/Navigation 계약 변경 없이 패키지 내부 CSS·도구·README만 수정했다. 기존 consumer Guard 전체 반복 없음.
Guard CSS 범위 기존 STATIC PASS / RUNTIME NOT VERIFIED / DESIGN_INTENT NOT VERIFIED / FINAL NOT VERIFIED를 유지한다. 이번 연결선 computed 및 Fixed 영향 검증 PASS를 Core 전체 CSS/동적 입력/디자인 의도 승인으로 확대하지 않는다. 원본 RENDER-002 NOT VERIFIED 유지.

초기 browser 실행의 ERR_NETWORK_ACCESS_DENIED는 sandbox localhost 제한이었다. 초기 로그/JSON을 별도 보존하고 동일 실행기를 localhost 접근 가능한 권한으로 실행했다. 성공한 과거 suite를 반복하거나 기대값을 수정하지 않았다. 신규 제품 FAIL 0건.

근거: Build, 브라우저 raw, 대비 raw, 감사, Pack 목록, 캡처, Git 상태. 이 파일들의 기존 test-results 정책은 유지하며 Git Stage하지 않았다.

변경 파일

제품·패키지·문서:

  • packages/org-chart/src/styles/org-chart-expanded.css
  • packages/org-chart/README.md
  • packages/org-chart-react/README.md
  • docs/org-chart/expanded-usage.md
  • scripts/orgchart-browser-runtime.mjs (신규)
  • docs/org-chart/browser-verification.md (신규)
  • docs/org-chart/implementation-report-p6.1.md (신규)

도구 경로만 변경한 Core runner 17개:

  • examples/org-chart/verify.mjs
  • examples/org-chart/verify-p1.mjs
  • examples/org-chart/verify-p2.mjs
  • examples/org-chart/verify-p3.mjs
  • examples/org-chart/verify-p3.1.mjs
  • examples/org-chart/verify-p3.2.mjs
  • examples/org-chart/verify-p5-1a.mjs
  • examples/org-chart/verify-p5-1b.mjs
  • examples/org-chart/verify-p5-23.mjs
  • examples/org-chart/verify-p5-4.mjs
  • examples/org-chart/verify-card-content.mjs
  • examples/org-chart/verify-card-design.mjs
  • examples/org-chart/verify-final-card-check.mjs
  • examples/org-chart/verify-final-logo-check.mjs
  • examples/org-chart/verify-final-status-check.mjs
  • examples/org-chart/verify-quality-boundaries.mjs
  • examples/org-chart/verify-quality-p1.mjs

React runner 2개:

  • examples/org-chart-react/verify.mjs
  • examples/org-chart-react/verify-boundaries.mjs

남은 결함과 미검증

이번 요청의 배포 전 결함은 P1 1건·P2 2건 모두 해결했다. 이번 확인 범위의 남은 P0/P1/P2: 0/0/0, 신규 회귀 결함 0. 과거 Fixed 대비 REVIEW와 오래된 테스트 FAIL을 새 PASS로 재분류하지 않았다.

계속 NOT VERIFIED: Guard 전체 CSS Runtime/디자인 의도 및 임의 동적 입력, 실제 화면 리더·물리 터치·타 브라우저, 전체 역사 회귀/과거 FAIL 전체 재분류, 모든 Fixed 폭·전체 픽셀 일치, 임의 데이터/override/접힘 전 조합, 실제 새 PC fresh install, 실제 운영 base/font/CSP/origin·배포·SSR/hydration·실제 API. 390/768/1280/1440 기존 P6 결과를 재사용했으며 이번에는 1440px의 변경 범위 시나리오를 확인했다.

Stage·Commit·Push는 사용자 검토 후 별도 요청으로 진행한다.

작업 시간

  • Started At: 2026-10-12 22:33:57 KST
  • Completed At: 2026-10-12 22:43:52 KST
  • Actual Duration: 9분 55초
  • Estimated Duration: 최초 35~45분
  • Variance: 예상 하한보다 25분 5초, 상한보다 35분 5초 짧음

준비된 기존 의존성/브라우저, 공통 실행 도우미, P6 정상 기록 재사용과 변경 범위 검사로 예상보다 빠르게 완료했다.