WebIDL for VSCode
This extension brings a complete editing experience for
Web IDL to VSCode and compatible editors, on
both desktop and web. It provides syntax highlighting, on‑the‑fly validation,
semantic linting, formatting and simple commands to help you work with WebIDL
definitions more productively.
Features
The extension uses the webidl2 library
under the hood to parse, validate, and format your IDL.
- Syntax highlighting: A comprehensive TextMate grammar describes WebIDL
syntax so that keywords, literals, identifiers and punctuation are colored
correctly.
- Automatic diagnostics: Whenever you open or edit a WebIDL file the
extension parses it and runs semantic validation. Diagnostics are shown inline
in the editor with error or warning severity depending on the issue. The
validation logic is powered by
webidl2.validate(). Syntax and semantic
problems are reported with concise messages, rule names where available, and
precise token ranges when the parser exposes them.
- Document formatting: You can reformat a WebIDL document using either the
WebIDL: Format Document command or the built‑in Format Document action.
Formatting parses the document, applies any available autofixes and
regenerates canonical output using webidl2.write(). Autofixes are applied
transparently to your buffer.
- Manual validation: Use the
WebIDL: Validate Document command to run
validation on demand. When no problems are found an informational notification
appears.
Commands
| Command ID |
Description |
webidl.format |
Formats the current WebIDL document in place using webidl2.write() and any available autofixes. |
webidl.validate |
Parses and validates the active WebIDL document using webidl2.parse() and webidl2.validate(). Diagnostics are published to the editor. |
Usage
- Install the extension from the VS Code Marketplace or by side‑loading the
.vsix created from this repository.
- Open a file with a
.webidl or .idl extension. The extension activates
automatically on the first WebIDL file.
- Edit your WebIDL as usual. Syntax errors are highlighted immediately.
Semantic warnings (for example, using a
sequence type on an attribute)
appear as you type.
- Run WebIDL: Format Document from the command palette
(
⇧⌘P/Ctrl+Shift+P) to reflow your definitions. The formatter parses the
AST with webidl2.parse(), applies autofixes exposed by webidl2.validate()
and then writes the result with webidl2.write().
- Run WebIDL: Validate Document to manually re‑evaluate the current file
and see a summary in the notifications area.
Example
The following IDL contains a semantic error: an attribute may not have a
sequence type. When the file is opened or edited, the extension adds a
diagnostic to the offending token.
interface Example {
attribute sequence<long> data;
};
The validation API in webidl2 returns an array of problem objects whose
message, line, level, token and rule fields describe the issue. The
extension enriches those tokens with source ranges, converts the results into
VS Code diagnostics and displays them inline. Formatting the example would leave
the semantic error intact but tidy up whitespace and braces.
Configuration
The extension relies only on the built‑in VS Code settings. There are no custom
configuration options at this time, but you can control editor behavior through
standard settings such as editor.formatOnSave to automatically format WebIDL
files on save.
Contributing
Contributions to this project are warmly welcomed! If you have an idea for a new
feature, a bug fix, or an improvement to the documentation, please open an
issue, and if appropriate, feel free to open a pull request on GitHub.
Opening an issue first is always a good idea to discuss your proposed changes
and get feedback from the maintainers/community before investing time in a PR.
[!TIP]
Please refer to the contributing guidelines for
more details on how to contribute effectively to this project.
MIT © Nicholas Berlette. All rights reserved.
