Implicit Parentheses VSCode Extension

Clarify operator precedence by showing implicit parentheses as inline decorations in JavaScript files.

When reading complex expressions, it can be hard to understand how the subexpressions will be grouped. This extensions shows you how the sub expression are grouped by visually including the implicit parentheses as decorations.

Try Online

Online Demo

Installation

Install through VS Code extension marketplace. Search for "Implicit Parentheses".

Command Pallet Commands

• "Show Implicit Parentheses"
• "Hide Implicit Parentheses"
• "Toggle Implicit Parentheses"

Extension Settings

This extension contributes the following settings:

• implicitParentheses.enable: Show implicit parentheses
• implicitParentheses.showInMenuBar: Show a button in the menu bar to show/hide implicit parentheses
• implicitParentheses.useFlow: Parse JavaScript files as Flow
• implicitParentheses.debounceTimeout: Number of milliseconds that the plugin will wait after a file changes before it parses the file.
• implicitParentheses.parenStyle: Style of parentheses to use. Accepts "big" or "tiny" (defaults to "tiny").

The color of the parentheses can be configured via:

{
    "workbench.colorCustomizations": {
        "implicitParentheses.parens": "#ff0000"
    }
}

TODO

• [ ] Correctly handle case where config has been set at the language level.

Possible Future Features

• Provide automated fixes for adding parens, or even extracting expressions to variables.
• Use the menu bar item to indicate if parsing has failed.
• Suggest changing parser when we get a parse error that indicates we're using the wrong parser
• Use Flow/Typescript parser when possible to get incremental parsing.