VSCode Integration - Debugging/Logging Sporadic Editor Blanking

[jmenzies12]

Hey there,

We ran into an issue where the diagram editor will very infrequently go blank. Trying to get more information on what is causing this has been a bit of a nightmare.

The most I can see, is that the server connection is initialized but the client never gets to that point. However there are no errors in any of the logs or the browser console(webview dev tools) to indicate anything went wrong.

Normally we would get the following in the server log:

Initializing server with: applicationId: e88b642a-e35c-487d-ad9f-bbc5ea447d34, protocolVersion: 1.0.0
Initializing client session with: clientSessionId: 'argument-diagram_0', diagramType: 'argument-diagram'

However in this case we just get:
Initializing server with: applicationId: e88b642a-e35c-487d-ad9f-bbc5ea447d34, protocolVersion: 1.0.0

Do you have any suggestions that would allow us to gather more information on this issue?
How would I go about enabling "enableNotifications" in the client?

Cheers
Jonathan

[tortmayr]

Hi @jmenzies12,

unfortunately your issue is indeed quite hard to debug.
It seems like something in the early connection/server initialize phase goes wrong. At this point there is nothing you can
configure directly to enable additional notifications.

Could you provide a little bit more context about your project?
What GLSP server flavor are your using? Java or Node?
How do you connect to the GLSP server? Socket, Websocket or is the server running directly in the extension (NodeGlspVscodeServer)

What we know so far:

• It seems that the server initialization itself is invoked as expected

• However the subsequent client session initialization is not triggered

• Since there are no errors or warnings in the console log its save to assume that this is not caused
  by an unhandled promise rejection (otherwise you would see some sort of error)

  I would assume that this issue is caused by some sort of race condition and/or a pending promise that is not resolved in time.

  I guess to you need to incrementally customize certain GLSP components and add additional log messages to pinpoint the problem.

  I would start by overriding the resolveCustomEditor method in your EditorProvider and add a log message to the registerClient method:

 async resolveCustomEditor(
        document: vscode.CustomDocument,
        webviewPanel: vscode.WebviewPanel,
        token: vscode.CancellationToken
    ): Promise<void> {
        // This is used to initialize GLSP for our diagram
        const diagramIdentifier: GLSPDiagramIdentifier = {
            diagramType: this.diagramType,
            uri: serializeUri(document.uri),
            clientId: `${this.diagramType}_${this.viewCount++}`
        };

        const endpoint = new WebviewEndpoint({ diagramIdentifier, messenger: this.glspVscodeConnector.messenger, webviewPanel });

        // Register document/diagram panel/model in vscode connector
        this.glspVscodeConnector
            .registerClient({
                clientId: diagramIdentifier.clientId,
                diagramType: diagramIdentifier.diagramType,
                document: document,
                webviewEndpoint: endpoint
            })
            .then(() => console.log('Client registration successful'))
            .catch(error => console.error('Client registration failed', error));

        this.setUpWebview(document, webviewPanel, token, diagramIdentifier.clientId);
    }

Now if you run into the blank window issue and receive the Client registration successful message we know
that at the server/extension side so far everything went as expected.
Then the problem is probably in the webview code and we have to look into that.
If that promise fails or never resolves then we need to dive further into the internals of registerClient

[jmenzies12]

We are using the node flavor of GLSP Server. And then sockets to connect to it so SocketServerLauncher/SocketGlspVscodeServer.

Thanks for the suggestions, I will implement those and get back to you either way.