검색 요청 순서와 상태 모델

빠른 검색과 화면 이탈에서도 최신 조건에 맞는 결과를 유지합니다.

진도 0%

레슨

m05 미션 solution 전체를 복사한 starter에서 요청 정책을 확장합니다. 기존 문서·CSS·데이터·DOM·API 회귀 검사는 보존하며 새 request-control.js와 입력·탐색 어댑터를 사용합니다.

assets/request-control.js TODO에서 성공·오류·finally의 최신 요청 검사와 schedule의 타이머 제거·즉시 무효화를 완성합니다.
텍스트 연속 입력은 250ms 뒤 마지막 검색만 실행합니다. Enter·지역 변경·상세·목록 복귀는 즉시 실행하며 예약 요청과 중복하지 않습니다.
이전 문서·CSS·안전 제목·검색·필터·상세·포커스 복귀 동작과 현재 실패의 동일 조건 재시도를 유지합니다.
화면 이탈에서 타이머·signal·리스너를 정리합니다. 한국어 조합 중 검색 억제와 조합 완료 후 검색을 브라우저에서 관찰합니다.
npm ci 후 npm test를 실행합니다. Node·DOM 모델 증거와 실제 브라우저 관찰을 LAYOUT.md에서 구분합니다. 실제 서비스 자격증명은 사용하지 않습니다.

B→A 완료 순서에서도 B 결과를 유지하고 옛 오류·finally가 최신 로딩을 바꾸지 않습니다. 취소 신호를 무시하는 mock에서도 통과합니다.
가짜 시간 249ms에서 요청 0개, 1ms 추가에서 마지막 조건 1개입니다. 새 입력 직후의 옛 완료와 dispose 이후 갱신은 차단됩니다.
Enter 즉시 실행은 예약 검색을 제거합니다. 현재 오류는 같은 URL·options로 재시도하고 AbortError는 사용자 오류로 내보내지 않습니다.
npm test에서 기존 문서 18건·CSS 20건·데이터 15건·동기 DOM 20건·API/비동기 DOM 17건과 요청 제어 9건·새 DOM 어댑터 5건이 통과합니다.
실제 브라우저의 IME·키보드·320px·200% 확대·Network·뒤로 가기 캐시 복원은 별도 관찰합니다. 자동 모델 통과로 확인을 대신하지 않습니다.

npm test

모범 답안