@nine-lab/nine-mu 0.1.336 → 0.1.337

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nine-lab/nine-mu",
-  "version": "0.1.336",
+  "version": "0.1.337",
   "description": "AI-Driven Full-Stack Code Fabrication Engine",
   "type": "module",
   "main": "./dist/nine-mu.umd.js",

package/src/components/exception/ExceptionHook.js

@@ -57,32 +57,35 @@ export class ExceptionHook extends HTMLElement {
 		this.shadowRoot.appendChild(link);
 	}
 
-	// src/components/exception/ExceptionHook.js
-
 	#handleRuntimeError = (event) => {
 		if (this.#hasError) return;
 
-		// 🎯 핵심 1: 리액트 에러는 내부 가상 DOM에서 발생하므로
-		// event.error가 존재하거나, 에러 타겟이 이 컴포넌트 하위에 속해있는지 확인합니다.
-		const isReactError = event.error || (event.target && this.contains(event.target));
+		// 1. 에러 메시지 추출 (event 객체 자체 또는 event.error에서 타겟팅)
+		const errorMessage = event.error?.message || event.message || String(event);
+		const errorStack = event.error?.stack || "No stack trace available";
 
-		if (isReactError) {
-			// 에러 스택과 메시지 추출
-			const message = event.error?.message || event.message || "알 수 없는 런타임 에러";
-			const stack = event.error?.stack || "Stack trace unavailable";
+		// 2. 개발 환경(Vite, Webpack) 및 리액트 특유의 무조건적인 전역 에러 전파 캐치
+		// 리액트 에러는 보통 전역 window로 던져지므로, 이 훅이 떠 있는 상태라면 그냥 가차없이 잡아야 합니다.
+		if (errorMessage) {
 
-			// 🎯 핵심 2: 리액트가 에러 때문에 화면을 통째로 날려버리기 전에
-			// 기본 렌더링 슬롯(<slot>)을 즉시 숨기고 Web Component 자체 에러 보드를 띄웁니다.
-			this.#renderError(message, stack);
+			// 3. 리액트가 에러 때문에 <slot> 내부 DOM을 통째로 Unmount(파괴)해버리는 것을 방지하기 위해
+			// 브라우저 버블링을 즉시 차단하고, 에러 보드를 즉각 그리도록 순서를 가로챕니다.
+			this.#renderError(errorMessage, errorStack);
 
-			// 브라우저 기본 에러 동작(콘솔 중복 출력 등)을 필요에 따라 제어하려면 추가
+			// 필요시 브라우저 기본 빨간 에러창(Vite Overlay 등) 억제 원할 때 활성화
 			// event.preventDefault();
 		}
 	}
 
 	#handlePromiseError = (event) => {
 		if (this.#hasError) return;
-		this.#renderError(event.reason?.message || String(event.reason), event.reason?.stack);
+
+		// 비동기 훅(useEffect 안의 null.data 같은 Promise 거부) 에러 캐치
+		const reason = event.reason;
+		const errorMessage = reason?.message || String(reason || "Unhandled Promise Rejection");
+		const errorStack = reason?.stack || "No stack trace available";
+
+		this.#renderError(errorMessage, errorStack);
 	}
 
 	#handleLocationChange = () => {