Jakiś dobry debugger dla API HTML postMessage HTML5?

Question

Czy jest jakieś dobre narzędzie, które pozwala programistom poprawnie debugować wiadomości wysyłane między oknami z postMessage?

A może wtyczka do Firebug?

Answer 1

Firebug (as of 1.11 beta 1) obsługuje to z monitorEvents(). Można zrobić coś takiego:

$("iframe").each(function(i, e) { 
    console.log("Monitoring messages sent to: iframe(" + i + ")#" + $(this).attr("id")); 
    monitorEvents(this.contentWindow, "message"); 

    // Send a test message to this iframe 
    this.contentWindow.postMessage("Hi iframe - " + i, "*"); 
}); 

console.log("Monitoring messages sent to window"); 
monitorEvents(window, "message"); 
// Send a test message to the window 
window.postMessage("Hi window", "*"); 

(@Pierre: dzięki za wspomnieć, że feature request)

EDIT:Also works in Chrome, ale kiedy próbowałem powyższy kod I wystąpił błąd zabezpieczeń wartości document.domain nie były takie same, więc zachowanie tych dwóch implementacji może być nieco inne.

AKTUALIZACJA: Mam submitted a feature request do zespołu Chrome z pytaniem, czy zdarzenia postMessage pojawiają się na osi czasu. Ponadto znalazłem extension called JScript Tricks, który może wstrzyknąć dowolny kod JavaScript do strony po wczytaniu. Możesz dodać do niego następujący kod, aby monitorować zdarzenia po załadowaniu strony. Działa całkiem nieźle, chociaż może spowodować nieoczekiwane zdarzenia, które wystąpią natychmiast (na przykład przed przeładowaniem, jeśli to możliwe).

(function($) { 
    var $window = $(window); 
    $window.add("iframe").on("message", function(e) { 
     console.log("Received messsage from " + e.originalEvent.origin + ", data = " + e.originalEvent.data); 
    }); 
})(jQuery); 

Answer 2

Został wydany firebug feature-request.