Tracer: embedding into vscode

[ulugbekna]

Hi,

I think vscode has quite nice facilities that allow embedding the tracer into vscode. Some of the advantages, for example, include

• debugging your language server without switching from editor to browser
• platform for working with documents:
  • clickable url's that open documents with code highlighting (if we add Tracer: reproduce document state at given point in time #108, we can open locked documents with code highlighting and selected text)

Would you guys be interested in collaborating on something like this?

[keynmol]

I think vscode has quite nice facilities that allow embedding the tracer into vscode

Hi!

Could you elaborate on how that would look like? I'm not really a VS code user so not sure what facilities it provides for embedding.

Do you mean tracer (1) being part of some sort of VS Code's built-in webview and (2) the links in json payloads to be clickable?

(2) is totally desirable on its own, and (1) sounds cool but I'm not sure how to achieve it

[ulugbekna]

Yes both to (1) and (2).

(2) should be achievable by OS redirecting the file open request to the editor of choice, but I imagine this to be slow, while having the tracer embedded could allow faster and more pleasurable experience, e.g., the json payload could be shown in a side editor with highlighting enabled, encoded values could have inlay hints attached to them to show what they stand for. Some of these niceties can be achieved by using the Monaco editor in the tracer's web interface.

[keynmol]

So I've been experimenting with two things:

1. Rendering the json payload in a custom way
2. Replacing uri links (in a dumb way) with VS code paths

The results are pretty interesting: when used in a regular browser, you can jump straight to vs code (I will make this an optional parameter, because I myself don't use VS code and the links are distracting), but the built-in "Simple browser" doesn't seem to work with them:

I wish to find a way to make it work with the simple browser - because then the whole "embedding" story might be solved without having to write a VS code extension.

So my current plan is:

1. Polish the rendering of "json" as a custom HTML (still allowing to "Copy raw json" as an option)
2. Make vscodified links a toggle in the UI (persisted in local storage)
3. ... and only after merging and releasing 1 and 2, figure out why Simple Browser doesn't work this way.

The work is currently in #118 so @ulugbekna if you want to give it a go.
I added a command to build just the tracer - you can use sbt buildTracer or sbt bt for short, to build the development version of tracer app.

The actual rendering of "json" will be improved, this is just for testing

[keynmol]

For posterity, what you see in the gif is me using the langoustine-vscode extension to configure a local LSP I use with the following config:

    "langoustine-vscode.servers": [
        {
            "name": "Quickmaffs LSP",
            "extension": "qmf",
            "command": "langoustine-tracer-dev",
            "args": [
                "--port",
                "9941",
                "/Users/velvetbaldmime/projects/quickmaffs/bin/lsp"
            ]
        }
    ],

I just set fix the port, instead of randomly assigned one, so that it's easier to reload the window