How to monitor WebSocket communication in Phantom.js?

Question

Phantom.js documentation shows how to monitor HTTP communication: http://phantomjs.org/network-monitoring.html

However, it does not work for WebSockets. How can I monitor WebSocket communication in Phantom.js?

Answer 1

PhantomJS 1.x does not support WebSockets¹, so you cannot monitor them. If the page uses some fallback for WebSockets, then the page.onResourceRequested and page.onResourceReceived can be used to log the meta data of the messages. PhantomJS does not expose the actual data sent in any way.

WebSockets work correctly in PhantomJS 2. Since no fallback is necessary, it is not possible to observe the traffic with those events. The event handlers mentioned above don't show anything. The only way to see the messages would be to proxy the WebSocket object as early as possible:

page.onInitialized = function(){
    page.evaluate(function(){
        (function(w){
            var oldWS = w.WebSocket;
            w.WebSocket = function(uri){
                this.ws = new oldWS(uri);
                ...
            };
            w.WebSocket.prototype.send = function(msg){
                w.callPhantom({type: "ws", sent: "msg"});
                this.ws.send(msg);
            };
            ...
        })(window);
    });
};
page.onCallback = function(data){
    console.log(JSON.stringify(data, undefined, 4));
};

¹ My tests actually show that the websocket echo page works with v1.9.6 and up, but not v1.9.0.