king
47e09b94d7
Pointer Events 기반으로 바꾸고(터치·펜 지원, setPointerCapture 로 창 밖 이동에도 이벤트 유실 없음) 업무툴 수준의 조작 피드백을 붙였다. - 드래그 핸들(⠿)에서만 드래그 시작 → 카드 클릭/텍스트 선택과 충돌 없음 - 커서를 따라오는 고스트에 "잔여 N박스" 배지, 담을 수 없는 위치에서는 빨간 테두리로 금지 표시 - 대상 센터에 "○○ — 여기에 담기" 플레이스홀더를 끼워 놓일 자리를 보여줌 - 센터 목록 위/아래 44px 안에 커서가 오면 자동 스크롤(센터가 많을 때 필수) - pointermove 처리는 requestAnimationFrame 으로 1프레임 1회만 실행 - pointercancel / 창 blur / Esc 에서 드래그를 안전하게 취소 SortableJS 도입은 보류했다. 웨일에서 네이티브 DnD 가 시작조차 되지 않아 어차피 fallback 모드로만 동작하고, 브라우저 실측 검증 수단이 없는 상태에서 의존성만 늘어난다. tests/js: 핸들 밖 드래그 차단·고스트 배지·플레이스홀더·금지 표시·Esc 취소 시나리오 추가(rAF 지연을 고려해 프레임 대기). 전체 통과. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
박스 계산 화면 UI 테스트 (jsdom)
app/modules/cupang/templates/cupang/box_calc.html 의 드래그 분배·수량 대화상자·
잔여 계산을 브라우저 없이 검증한다. 서버 API 응답은 고정값으로 대체한다.
# 1) 템플릿을 HTML 로 렌더 (프로젝트 루트에서)
python tests/js/render_box_calc.py # → tests/js/.out/box_calc_render.html
# 2) jsdom 설치 후 실행
npm install jsdom
node tests/js/box_calc_ui.test.js
성공하면 마지막 줄에 ALL PASS, 실패하면 실패한 항목명이 출력되고 종료코드 1.