Webix-JET websocket example

#1

Hi,

I have a Jet app using your websocket example:

webix.proxy.socket = {
    $proxy:true,
    load:function(view) {
        //create a socket connection
        this.socket = new WebSocket("ws:"+this.source);

        //handle errors
        this.socket.onerror = (error) => {
            console.log("WebSocket Error", error);
        };
        //receive updates
        this.socket.onmessage = (e) => {
            // update view data
            // ...
        };
        //close a socket connection when a view is destroyed
        view.attachEvent("onDestruct", () => {
            this.socket.close();
        });
    },
    save:function(view, update) {
        //send message to server
        this.socket.send(webix.stringify(update));
    }
};

problem is when I save I get this.socket is undefined.
Any help would be greatly appreciated.

-Tomas

#2

Hello!

We’ve tested the issue, and, it seems, there’s a bug in Webix Jet. When Jet copies the config, it removes some properties from the objects.

As a workaround, you can save on the view instead of proxy (this): Code Snippet

[Updated]: After studying the issue, we’ve came to the conclusion that it was caused by CopyConfig:

url:data_proxy,
save:data_proxy

here both url and save reference the same object, after CopyConfig, each property will reference its own UNIQUE config object, so when Socket is created in the load handler, it will affect “url” but will not affect “save” as they are different objects now.

The best alternative for it will be to move data load/save logic into the “init” handler:

init(){
var data_proxy = webix.proxy("socket", "[//localhost:8080](https://localhost:8080/)", {
key:"data", clientId:webix.uid()
});

const grid = this.$$("grid");
grid.load(data_proxy)
webix.dp({ master: grid, url: data_proxy })