Wie kann ich Ereignisüberwacher für eine bestimmte JavaScript-Datei in den Chrome Developer Tools aktivieren?

494
João Paiva

Ich muss wissen, welche JavaScript-Funktion in einer Datei aufgerufen wird, wenn ich eine Taste drücke. Mein Problem ist, dass ich eine sehr große JavaScript-Datei habe und keine Dokumentation darüber habe. Ich habe mich gefragt, ob es eine Möglichkeit gibt, Ereignisüberwacher nur für diese bestimmte Datei in Chrome-Entwicklerwerkzeugen zu aktivieren. Wenn ich auf eine Schaltfläche klicke, wird mir angezeigt, welche Funktion für diese riesige Datei aufgerufen wird.

Bisher konnte ich die Registerkarte "Globale Listener" verwenden, um nach Mausklickereignissen zu suchen. Dies führt mich jedoch zu jquery- (version) .js, und das führt mich nicht wirklich irgendwo hin.

Ich denke, das wäre ähnlich wie das Setzen von Haltepunkten in jeder einzelnen Zeile dieser Datei, aber ich kann das aufgrund der Größe der Datei nicht wirklich tun.

0

1 Antwort auf die Frage

1
EHAD

Aufgrund der Art Ihrer Frage gehe ich davon aus, dass die betreffende riesige Javascript-Datei minimiert oder anderweitig verschleiert ist, was die semantische Suche schwierig macht (dh ctrl + f bei der Suche nach Schlüsselwörtern wie "onClick" in der Datei).

Ich bin nicht sicher, ob es einen besonders sauberen Weg gibt, dies zu tun. Ich denke, Sie setzen am besten die Event Listener Breakpoints des Chrome-Debuggers ein, um alle Klick-Listener durchzugehen, bis Sie einen gefunden haben, der Ihre Datei aufruft.

  • Öffnen Sie die Registerkarte Ereignislistener-Haltepunkt im Chrome-Debugger, öffnen Sie den Abschnitt Maus und klicken Sie auf OK . Dadurch werden allen js-Click-Ereignis-Listenern in Ihrem DOM Haltepunkte zugewiesen (es kann daher nützlich sein, dies in einem Inkognito-Fenster zu tun oder alle Erweiterungen zu deaktivieren, die über Click-Listener verfügen).
  • Wenn die Haltepunkte ausgelöst werden, klicken Sie auf die Schaltfläche "Fortsetzen", bis in der Datei, die Sie untersuchen, ein Haltepunkt ausgelöst wird.
  • Wenn Ihre Datei nie auftaucht, haben Sie wahrscheinlich einen gewissen Slog vor sich. Lösen Sie erst jetzt einen weiteren Klick aus, gehen Sie in die Callbacks und prüfen Sie, ob einer von ihnen in Ihre Datei führt.
    • Gehen Sie nicht zu tief in einen bestimmten Rückruf, wenn er nicht vielversprechend aussieht. Sie können bei Bedarf darauf zurückkommen. Führen Sie einige relativ flache Durchläufe durch (dh Sie müssen nur einige Funktionen tief in jeden Rückruf einleiten), um unwahrscheinliche Leads zu eliminieren.
    • Lassen Sie alle Bibliotheksrückrufe (JQuery, Kefir usw.) als letztes zu untersuchen, da diese häufig die tiefsten sind und oft nur interne Logik bei der Arbeit sind.
  • Wenn Sie immer noch nichts finden, nachdem Sie in die Click- Callbacks eingetreten sind, können Sie versuchen, Haltepunkte auf das Mausedown oder den Mouseup zu setzen