RangeError를 디버깅하는 방법 : 개발자 콘솔없이 최대 호출 스택 크기를 초과했습니다.

Question

복잡한 JavaScript 응용 프로그램 (jQuery 및 jQueryUI 사용)에서는 JavaScript에서 오류가 발생하는 경우가 있습니다. 우리는 이러한 오류를 잡아서 기록하지만 stacktrace는 완전한 출처를 표시하지 않습니다. 지금까지 오류의 근본 원인을 찾을 수 없었습니다.

RangeError: Maximum call stack size exceeded 
at RegExp.[Symbol.replace] (native) at String.replace (native) 
at Function.camelCase (<jquery>) 
at Function.css (<jquery>) 
at Object.get (<jquery>) 
at init.cur (<jquery>) 
at init (<jquery>) 
at Function.Ya [as Tween] (<jquery>) 
at Object.createTween (<jquery>) 
at Object.r.Animation.r.extend.tweeners.* (<jquery>) 

다른 하나

RangeError: Maximum call stack size exceeded 
at RegExp.[Symbol.replace] (native) at String.replace (native) 
at Function.camelCase (<jquery>) 
at Function.css (<jquery>) 
at (<jquery>) 
at S (<jquery>) 
at a.fn.init.css (<jquery>) 
at HTMLImageElement.jc (<jquery>) 
at HTMLImageElement.e.complete (<jquery>) 
at i (<jquery>) 

개발자 툴킷을 사용하지 않고 오류의 근원에 도착하는 어떤 방법이 있나요? 오류는 Chrome에서만 발생하는 것으로 보이며 이전 버전의 jQuery를 사용했을 때 발생하지 않았습니다. (우리는 지금 3.1.1에있다)

Answer 1

나는 우리가 버그를 발견했다고 생각한다. 이 JSfiddle에서는이 발생

https://jsfiddle.net/c41bgs24/12/

function completeFunc(){ 
    var $this = $(this); 
    var fadeIn = $this.css("opacity") == 0; 
    console.log("complete", (new Date()).getTime()); 
    $this.animate({ 
    opacity: fadeIn ? 1 : 0 
    }, 2000, "linear", completeFunc); 
} 

// Make sure the tab is switched out within 3 seconds. This tab needs to be inactive when the timeout triggers for the bug to take place. 
setTimeout(function(){ 
    $("#test").each(completeFunc); 
}, 3000); 

이 버그가 발생 확인 3 초 전에 밖으로 확인 탭을 확인합니다.

이에 대해 jQuery에 버그 보고서를 보냈습니다. https://github.com/jquery/jquery/issues/3507