9.2 KiB
9.2 KiB
E2E Test Report: 근태 사유 등록
Test ID: attendance-reason Executed: 2026-01-16 09:15:30 Duration: ~1분 Status: ❌ FAIL (라우팅 오류)
Summary
| Item | Result |
|---|---|
| Total Steps | 6 |
| Passed | 4 |
| Failed | 2 |
| Skipped | 0 |
Test Environment
- URL: https://dev.codebridge-x.com/ko/hr/attendance-management
- User: TestUser5 (홍킬동)
Test Results
✅ Passed Steps
| Step | Name | Status | Notes |
|---|---|---|---|
| 1 | 인사관리 메뉴 진입 | ✅ PASS | URL: /hr/attendance-management (이전 테스트에서 이미 진입) |
| 2 | 사유 등록 모달 열기 | ✅ PASS | "사유 정보" 모달 표시 |
| 3 | 대상 직원 선택 | ✅ PASS | "홍킬동" 선택 완료 |
| 4 | 사유 유형 선택 | ✅ PASS | "출장신청서" 선택 완료 |
❌ Failed Steps
| Step | Name | Status | Issue |
|---|---|---|---|
| 5 | 사유 등록 | ❌ FAIL | 라우팅 오류 - 출장신청서 작성 페이지로 이동 |
| 6 | 등록된 사유 탭에서 확인 | ❌ SKIP | Step 5 실패로 인해 미실행 |
상세 검증 결과
🔴 필수 검증 #2, #4: 등록 버튼 동작 (FAIL)
| 항목 | 예상 | 실제 | 결과 |
|---|---|---|---|
| 등록 전 URL | /hr/attendance-management | /hr/attendance-management | ✅ |
| 등록 후 URL | /hr/attendance-management | /hr/documents/new?type=businessTripRequest | ❌ |
| 페이지 타입 | 근태관리 페이지 유지 | 출장신청서 작성 페이지 | ❌ |
| 모달 상태 | 닫힘 | 페이지 이동으로 사라짐 | ❌ |
| 성공 토스트 | "등록 완료" 또는 "성공" | 없음 | ❌ |
| API 호출 | POST /api/attendance/reason | 미호출 (클라이언트 라우팅만) | ❌ |
| Console LOG | 참고 | "Submit reason: {employeeId: 33, baseDate: 2026-01-16, reasonType: businessTripRequest}" | ⚠️ |
최종 판정: ❌ FAIL (사유 등록 API 미호출, 출장신청서 작성 페이지로 잘못된 라우팅)
버그 유형: 라우팅 오류 또는 기능 미구현
- "사유 등록" 모달에서 "등록" 버튼 클릭 시 API를 호출하여 사유를 등록해야 하나,
- 실제로는
/hr/documents/new?type=businessTripRequest페이지로 클라이언트 사이드 라우팅됨 - 이것은 "출장신청서 작성 페이지"로, 별도의 상세 양식을 작성하는 페이지임
동작 검증 결과
| 요소 | 검증 수준 | 동작 | 결과 | 비고 |
|---|---|---|---|---|
| 사유 등록 버튼 (모달 열기) | Level 3 | 클릭 → 모달 열림 | ✅ | "사유 정보" 모달 표시 |
| 대상 combobox | Level 3 | 클릭 → 옵션 선택 | ✅ | 홍킬동 선택 완료 |
| 유형 combobox | Level 3 | 클릭 → 옵션 선택 | ✅ | 출장신청서 선택 완료 |
| 등록 버튼 (모달 내) | Level 4 | 클릭 → API 호출 → 등록 완료 | ❌ | 라우팅 오류 발생 |
콘솔 로그 분석
| 유형 | 메시지 | 심각도 | 조치 필요 |
|---|---|---|---|
| LOG | Submit reason: {employeeId: 33, baseDate: 2026-01-16, reasonType: businessTripRequest} | Info | ❌ API 호출 미구현 |
🐛 Bug Report for Developer
Report ID: BUG-attendance-reason-routing-20260116 Priority: High Component: C:\Users\codeb\react\app[locale](protected)\hr\attendance-management
Issue Summary
"사유 등록" 모달에서 "등록" 버튼 클릭 시 사유를 등록하지 않고 출장신청서 작성 페이지(/hr/documents/new)로 잘못 이동함
Steps to Reproduce
- 근태관리 페이지 이동 (/hr/attendance-management)
- "사유 등록" 버튼 클릭 → 모달 열림
- 대상: "홍킬동" 선택
- 유형: "출장신청서" 선택
- "등록" 버튼 클릭
- 현재 페이지:
/hr/documents/new?type=businessTripRequest(출장신청서 작성 페이지)
Expected Result
시나리오 A (간편 등록 방식):
- 모달에서 입력한 정보로 사유 즉시 등록
- API 호출:
POST /api/attendance/reason또는POST /api/hr/reasons - Request Body:
{
"employeeId": 33,
"baseDate": "2026-01-16",
"reasonType": "businessTripRequest"
}
- Response: 200 OK
- 모달 닫힘
- 성공 토스트: "사유가 등록되었습니다" 또는 "등록 완료"
- 근태관리 페이지 유지 (
/hr/attendance-management)
시나리오 B (상세 등록 방식, 현재 구현으로 추정):
- 만약 출장신청서 작성 페이지로 이동하는 것이 의도된 동작이라면:
- 모달의 "등록" 버튼 텍스트를 "상세 작성" 또는 "출장신청서 작성"으로 변경
- 또는 "간편 등록"과 "상세 작성" 두 버튼 제공
- 페이지 이동 전 확인 메시지 표시: "출장신청서 작성 페이지로 이동하시겠습니까?"
Actual Result
- Console LOG:
Submit reason: {employeeId: 33, baseDate: 2026-01-16, reasonType: businessTripRequest}출력 - API 호출: 없음 (클라이언트 사이드 라우팅만 발생)
- 페이지 이동:
/hr/documents/new?type=businessTripRequest(출장신청서 작성 페이지) - 출장신청서 작성 폼 표시:
- 제목 (필수)
- 시작일, 종료일 (2026-01-16으로 초기화)
- 출장지 (필수)
- 목적 (필수)
- 상세 내용 (필수)
- 근태관리 페이지에서 벗어남
Error Details
라우팅 오류 또는 기능 미구현:
- "사유 등록" 모달은 간편 등록 UI로 보이나 (대상, 기준일, 유형만 입력)
- "등록" 버튼 클릭 시 실제 등록이 아닌 상세 작성 페이지로 리다이렉트됨
- 사용자가 모달에서 입력한 정보(대상, 기준일, 유형)는 등록되지 않음
Network Requests
마지막 네트워크 요청:
[GET] /ko/hr/documents/new?type=businessTripRequest => [307] (리다이렉트)
[GET] /hr/documents/new?type=businessTripRequest => [200]
예상 네트워크 요청:
[POST] /api/attendance/reason => [200] (등록 성공)
또는
[POST] /api/hr/reasons => [200] (등록 성공)
Suggested Fix (Reference Only)
영향 범위: react 변경 승인 정책: ⚠️ 컨펌 필요 (비즈니스 로직 변경)
옵션 1: 간편 등록 구현 (권장)
// 사유 등록 모달의 "등록" 버튼 핸들러
const handleSubmit = async () => {
try {
const response = await fetch('/api/attendance/reason', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
employeeId: selectedEmployee,
baseDate: selectedDate,
reasonType: selectedReasonType
})
});
if (response.ok) {
toast.success('사유가 등록되었습니다');
closeModal();
refreshAttendanceData();
}
} catch (error) {
toast.error('등록 중 오류가 발생했습니다');
}
};
옵션 2: 사용자 의도 확인
// 두 가지 옵션 제공
<DialogFooter>
<Button variant="outline" onClick={handleSimpleRegister}>
간편 등록
</Button>
<Button onClick={handleDetailedForm}>
상세 작성
</Button>
</DialogFooter>
옵션 3: 현재 동작 유지 시 UI 개선
- 버튼 텍스트: "등록" → "출장신청서 작성"
- 페이지 이동 전 확인 메시지 추가
Related Documentation
- SAM 정책:
C:\Users\codeb\.claude\skills\sam_policy\SKILL.md - 문서 인덱스:
C:\Users\codeb\docs\INDEX.md - API 규칙:
C:\Users\codeb\docs\standards\api-rules.md
분석
UI 흐름 분석
현재 "사유 등록" 모달은 간편 등록 UI처럼 보이지만, 실제로는 상세 작성 페이지로 이동하는 시작점으로 동작합니다.
사용자 경험 문제:
- 모달에서 "등록" 버튼을 누르면 즉시 등록될 것으로 기대
- 실제로는 추가 정보 입력이 필요한 페이지로 이동
- 모달에서 입력한 정보(대상, 유형)가 등록되지 않음
개선 방향:
- 간편 등록: 모달에서 바로 API 호출하여 등록
- 또는 UI 명확화: "상세 작성으로 이동" 등 명확한 텍스트 사용
유형별 페이지 매핑
| 사유 유형 | 페이지 URL |
|---|---|
| 출장신청서 | /hr/documents/new?type=businessTripRequest |
| 휴가신청서 | /hr/documents/new?type=vacationRequest |
| 외근신청서 | /hr/documents/new?type=fieldWorkRequest |
| 연장근무신청서 | /hr/documents/new?type=overtimeRequest |
Recommendations
-
라우팅 로직 수정 필요:
- "사유 등록" 모달의 "등록" 버튼은 API를 호출하여 즉시 등록하거나
- 버튼 텍스트를 "상세 작성"으로 변경하여 사용자 기대 관리
-
API 엔드포인트 개발 필요 (간편 등록 방식 채택 시):
POST /api/attendance/reason또는POST /api/hr/reasons- Request:
{ employeeId, baseDate, reasonType } - Response:
{ success: true, reasonId: number }
-
UX 개선:
- 간편 등록 vs 상세 작성 두 옵션 제공
- 또는 명확한 버튼 텍스트로 사용자 기대 관리
Screenshots
Next Steps
- ❌ 라우팅 로직 수정 필요
- ❌ API 엔드포인트 개발 필요 (간편 등록 방식 채택 시)
- ⚠️ 비즈니스 요구사항 확인: 간편 등록 vs 상세 작성