5

이것은 현재 가능한 내용으로는 불가능할 수도있는 다소 복잡한 질문이지만, 쉬운 방법이 있다면 엄청날 것입니다.Javascript에서 중단없는 중단 점 (추적 점)?

저는 Chrome에서 일부 자바 스크립트를 디버깅하고 있으며, 이벤트 중심이기 때문에 중단 점 대신 코드의 추적 보고서 (전화 번호 등)를 얻는 것을 선호합니다. 따라서 중단 점을 벗어날 때마다 로컬 함수 이름과 인수를 확인하고 싶습니다.

내가 얻을 수있는 가장 가까운처럼에서 조건부 중단 점을 드롭하는 것입니다 다음

  1. 붙여 넣기이 각 중단 점에 :이 방법이 큰 문제가 있습니다

    Sample trace

    너무 성가시다. 사람들은 각 중단 점에 대한 기본 조치로 선택할 수 있다면 훨씬 더 많이 사용하게 될 것입니다.

  2. Google 크롬에서는 로그 통화가 두 번 발생합니다.

이러한 문제 중 하나를 극복하는 방법에 대한 아이디어가 있습니까? 나는 그것이 가능할 수도 IE의 with VS,하지만 UI가 똑같이 성가신 것 같다.

+1

DOM 이벤트 추적에이 기능이 필요한 경우 콘솔의 ['monitorEvents()'] (http://www.briangrinstead.com/blog/chrome-developer-tools-monitorevents) 메소드를 사용해보십시오. – kpozin

+0

실제로 DOM 이벤트가 아닌 객체에 대해 가상 이벤트를 발생시켜 한 번에 monitorEvent를 사용하려고했습니다. 오류를 모니터링하여 꽤 멀리까지 얻을 수 있지만 필요한 세분화 된 필터링은 없습니다. – Chris

답변

0

이 작업을 수행 할 수있는 항목이 없습니다. 따라서 wrote my own입니다.

이제 console.log 호출을 계속해서 삽입하고 제거하는 대신 로그인을하고 필요할 때만 봅니다.

경고 : 아래의 특정 코드는 테스트되지 않았습니다.

var debug = TraceJS.GetLogger("debug", "mousemove"); 
$('div').mousemove(function(evt) { 
    debug(this.id, evt); 
}); 

마우스가 DIV 위로 이동 때마다, 그것은 LOGEVENT은 [ "MouseMove 이벤트", {해당 요소의 ID를}] 태그 생성하는 재미있는 부분은 수있게되고

선택적으로를보고 이벤트. 당신은 단지 요소 #A에 대한 MouseMove 이벤트 이벤트를 표시 할 경우, 콘솔에 다음과 같은 전화 : 내가 모두에서 mousemove 이벤트를 표시 할 때

TraceJS('a'); 

, 당신은 호출 할 수

TraceJS('mousemove'); 

만 이벤트를이 일치하는 필터가 표시됩니다. TraceJS (인수 없음)를 호출하면, 로그는 중지 표시를 호출합니다.

1

가장 좋은 옵션은 Chrome의 자바 스크립트 패널에서 javascript 코드를 편집하고 console.log를 추가하는 것입니다.

페이지를 새로 고친 후 중단 점을 넣은 다음 로깅 줄을 추가 할 수있는 경우가 아니라면 페이지가로드 된 후에 만 ​​작업해야합니다 (더 심하게). 페이지.

행운을 빈다.

1

이제 IE11에는 Visual Studio와는 별도로 "추적 지점"이 있습니다. 그들은 3 년 전 당신이 요구 한 것과 정확히 일치합니다. 아직 Chrome이나 다른 브라우저에서는 보이지 않지만 잘하면 곧 잡을 것입니다!

+0

쿨! https://msdn.microsoft.com/en-us/library/ie/dn255007(v=vs.85).aspx 항상 추적 점을두고 추적 할 수 있으므로 실제로 설정 한 라이브러리가 마음에 듭니다. 필요에 따라 켜고 끕니다. 그것이 어떻게 될지 추측하십시오. – Chris