Interactive Language Server log inspector
Перейти к файлу
Pine Wu f86c1d04c3 More JSON log parsing 2018-08-20 00:46:53 -07:00
.github Init 2018-06-25 20:30:38 -07:00
public Enable tracking & hambunger navigation 2018-07-12 14:49:25 +08:00
scripts Add scripts to automate publishing 2018-07-05 05:22:19 -07:00
src More JSON log parsing 2018-08-20 00:46:53 -07:00
tests Clean up 2018-07-05 06:01:53 -07:00
.gitignore Init 2018-06-25 20:30:38 -07:00
.postcssrc.js Init 2018-06-25 20:30:38 -07:00
.prettierrc Init 2018-06-25 20:30:38 -07:00
.travis.yml Init 2018-06-25 20:30:38 -07:00
LICENSE Init 2018-06-25 20:30:38 -07:00
README.md Add json spec 2018-08-19 23:20:15 -07:00
cypress.json Init 2018-06-25 20:30:38 -07:00
jest.config.js Init 2018-06-25 20:30:38 -07:00
package.json Add typescript as explicit dev dependency 2018-08-16 11:01:08 -07:00
tsconfig.json Init 2018-06-25 20:30:38 -07:00
tslint.json Sidebar and new layout 2018-07-05 03:36:19 -07:00
vue.config.js Don't output sourcemap 2018-07-05 14:19:00 -07:00
yarn.lock Add typescript as explicit dev dependency 2018-08-16 11:01:08 -07:00

README.md

Language Server Protocol Inspector

Try it at https://microsoft.github.io/language-server-protocol/inspector/.

Motivation

When you are using vscode-languageserver-node to develop a language server, it's possible to specify a setting "[langId].trace.server": "verbose" to make the Language Client log the LSP communication. This log is useful for developing and testing the Language Server, but the log can be lengthy — using the editor for 5 seconds could generate 5000 lines of LSP log. This makes it hard to gain insight from the logs.

This inspector visualizes the logs to make it easy to understand the communication between the Language Client / Server. It also lets you filter the logs by search query or language features, so you can quickly identify the logs you are interested in.

lsp-inspector

Usage

  • A log file (log from html Language Server) is loaded by default.
  • Click each LSP item to expand its parameters.
  • Type a query into the search bar to filter the logs.
  • Select a language feature area to filter the logs.
  • Collect your own logs and inspect them! For example:
    • Set css.trace.server: "verbose" in VS Code.
    • Open a CSS file.
    • Copy everything inside CSS Language Server channel into a log file css.log.
    • Load it from the web app.
  • You can try it on real-world logs file at /tests/unit/logParser/fixture.

Log Format

The Inspector takes two log formats: Text and JSON.

  • Text:
    • Logs generated by setting "[langId].trace.server": "verbose".
    • Logs generated by setting "[langId].trace.server": { "format": "Text" }
  • JSON: Logs generated by setting: "[langId].trace.server": { "format": "JSON" }

The Inspector could load any JSON logs, as long as they follow this format:

export type MsgKind =
  | 'send-notification'
  | 'recv-notification'
  | 'send-request'
  | 'recv-request'
  | 'send-response'
  | 'recv-response'

export interface LspItem {
  type: MsgKind
  message: any
  timestamp: unix timestamp
}

Each line is terminated with \r\n.

Here is a sample:

{"type":"receive-response","message":{"jsonrpc":"2.0","id":0,"result":{"capabilities":{"textDocumentSync":1,"completionProvider":{"resolveProvider":true}}}},"timestamp":1534721620392}\r\n
{"type":"send-notification","message":{"jsonrpc":"2.0","method":"initialized","params":{}},"timestamp":1534721620393}\r\n

Running & Developing

  • yarn
  • yarn serve

License

Copyright (c) Microsoft Corporation. All rights reserved.

Licensed under the MIT License.