프로젝트/LookSoPrt 트러블슈팅 - invalidateQueries가 호출되지 않음

1. 문제 상황

등록 상품 수정 시 이미지를 제외한 입력 필드만 변경했을 경우 invalidateQueries가 호출되지 않는다.

• 파일: use-fetch-console.ts

---

2. 원인

storageService.deleteFiles 메소드 내부에서 fileURLs 인자가 배열이 아니거나 undefined일 경우

throw Error를 던지므로 다음 코드가 실행되지 않고 catch block으로 코드 흐름이 넘어갔음

---

3. 해결 방법

• 에러를 던지지 않도록 변경, throw Error 코드 제거

AS-IS

 

TO-BE

---

4. 배경지식

• Error 생성자 함수로 에러 객체를 에러가 발생하는 것은 아니다. 에러 객체 생성과 에러 발생은 엄연히 의미가 다르다.
• 에러를 발생시킬려면 throw 키워드로 에러 객체를 던져야 한다. (단, try 코드 블럭에서 던져야 함.)
• 에러는 어디로 전파될까? throw된 에러를 캐치하지 않으면 호출자 방향(직전에 푸시된 실행 컨텍스트)로 전파된다.
• 에러를 catch 적절히 대응하면 프로그램의 강제 종료를 막을 수 있고 코드의 실행 흐름을 복구할 수 있다. (catch하지 않으면 프로그램은 멈춘다.)
• 주의할 점은 비동기 함수 setTimeout이나 프로미스 후속 처리 메서드의 콜백 함수는 태스크큐 또는 마이크로태스크 큐에 일시 저장되었다가 콜 스택이 비었을 경우 이벤트 루프에 의해 콜 스택으로 푸시된다. 즉 콜백 함수의 실행 컨텍스트는 스택 가장 하부에 존재하므로, 에러를 전파할 호출자가 존재하지 않는다.

---

참조

모던 자바스크립트 딥다이브 - 에러 처리 (throw 문)