Skip to content

Latest commit

 

History

History

lsp-web-extension-sample

LSP web extension Example

A LSP server that runs in a web extension

Functionality

This Language Server add color decorators to plain text files.

  • create a plain text file
  • enter text that contains colors in hex format (#rrggbb)
  • color decorators

It also includes an End-to-End test.

Structure

.
├── client // Language Client
│   ├── src
│   │   └── browserClientMain.ts // Language Client entry point
├── package.json // The extension manifest.
└── server // Language Server
    └── src
        └── browserServerMain.ts // Language Server entry point

Running the Sample

  • Run npm install in this folder. This installs all necessary npm modules in both the client and server folder
  • Open VS Code on this folder.
  • Press Ctrl+Shift+B to compile the client and server.
  • Switch to the Debug viewlet.
  • Select Run Web Extension from the drop down.
  • Run the launch config.
  • In the [Extension Development Host] instance of VSCode, open a document in 'plain text' language mode.
    • Type #00ff00 or any other color in hex format.
    • color decorators will appear.
  • You can set breakpoints in the client or server code.

You can also run and debug the extension in a browser

  • npm run chrome
  • use browser dev tools to set breakpoints