Code Metrics - Visual Studio Code Extension

Computes complexity in TypeScript / JavaScript / Lua files.

Complexity calculation

The steps of the calculation:

• create an AST from the input source file
• walk through each and every node of it
• depending on the type of the node and the configuration associated with it create a new entry about the node. This entry contains everything necessary for further use (e.g. a textual representation for the node, complexity increment, child nodes etc.)
• show the sum of complexity of child nodes for methods and the maximum of child nodes for classes

Please note that it is not a standard metric, but it is a close approximation of Cyclomatic complexity.

Please also note that it is possible to balance the complexity calculation for the project / team / personal taste by adjusting the relevant configuration entries (content assist is provided for all of them for easier configuration).

For example if one prefers guard clauses, and is ok with all the branches in switch statements then the following could be applied:

"codemetrics.nodeconfiguration.ReturnStatement": 0,
"codemetrics.nodeconfiguration.CaseClause": 0,
"codemetrics.nodeconfiguration.DefaultClause": 0

If You want to know the causes You can click on the code lens to list all the entries for a given method or class. (This also allows You to quickly navigate to the corresponding code)

It looks like this

Install

How to install Visual Studio Code extensions

Direct link to Visual Studio Code Marketplace

Customization

In the workspace settings one can override the defaults. For a complete list please check the configuration section in the package.json. For the most commonly used ones, one should do a search for codemetrics.basics in the settings ui.

{
  // highest complexity level will be set when it exceeds 15
  "codemetrics.basics.ComplexityLevelExtreme" : 15,

  // Hides code lenses with complexity lesser than the given value
  "codemetrics.basics.CodeLensHiddenUnder" : 5,

  // Description for the highest complexity level
  "codemetrics.basics.ComplexityLevelExtremeDescription" : "OMG split this up!",

  // someone uses 'any', it must be punished
  "codemetrics.nodeconfiguration.AnyKeyword": 100
}

Commands

• Toggle code lenses for arrow functions
• Toggle code metrics

They can be bound in the keybindings.json (File -> Preferences -> Keyboard Shortcuts)

{ "key": "f4",                    "command": "codemetrics.toggleCodeMetricsForArrowFunctions",
                                     "when": "editorTextFocus" },
{ "key": "f5",                    "command": "codemetrics.toggleCodeMetricsDisplayed",
                                     "when": "editorTextFocus" }

Change Log

• 1.26.1
  • Update tsmetrics-core to 1.4.1 (fixes default for IfWithElseStatement )
• 1.26.0
  • Update tsmetrics-core to 1.4.0 (comes with a new config IgnoredFunctionNames)
• 1.25.2
  • Update tsmetrics-core to 1.3.1
• 1.25.1
  • Update tsmetrics-core to 1.3.0
• 1.25.0
  • Update dependencies
  • Make it work for vue setup scripts
• 1.24.0
  • Jump to selection from the quick pick menu
• 1.23.1
  • Update dependencies
• 1.23.0
  • Use QuickPickItems instead of plain strings
  • Update tsmetrics-core to 1.2.1
• 1.22.1
  • Update change log
• 1.22.0
  • Update the activationEvents property (contribution from @igorskyflyer )
  • Add "onLanguage:vue" to the list of activation events
• 1.21.0
  • Show all items in the quick pick menu
• 1.20.0
  • Migrate to webpack
  • Adjust section about configuration options
  • Update tsmetrics-core
• 1.19.1
  • Update dependencies
• 1.19.0
  • Add support for ts based vue components
• 1.18.1
  • Update dependencies
  • Fix rounding issues
• 1.18.0
  • Add DecorationTemplate configuration (contribution from @luchsamapparat )
• 1.17.4
  • Update dependencies
• 1.17.3
  • Update dependencies
• 1.17.2
  • Fix invalid default color definition
• 1.17.1
  • Add file and untitled scheme explicitly
• 1.17.0
  • Adjust codebase to new API standards of VSCode
  • Adjust filter boundaries which are used for color decorators
• 1.16.0
  • Update dev dependency for vscode to avoid vulnerability warning
  • Add description about complexity calculation and configuration
• 1.15.0
  • Update tsmetrics-core to v1.0.0
• 1.14.0
  • Make decoration colors configurable
    • The following properties were introduced:
      • codemetrics.basics.ComplexityColorLow
      • codemetrics.basics.ComplexityColorNormal
      • codemetrics.basics.ComplexityColorHigh
      • codemetrics.basics.ComplexityColorExtreme
• 1.13.0
  • Update vscode version to 1.1.10
  • Avoid indentation distortion by moving decorations to the end of the line
  • Debounce EditorDecoration update requests properly
• 1.12.0
  • Add support for Visual Studio Live Share
• 1.11.2
  • Improve decorator lifecycle management
• 1.11.1
  • Only create new decorations if the settings has changed
• 1.11.0
  • Add new mode OverviewRuler
  • Update tsmetrics-core and typescript dependencies
• 1.10.0
  • Add support for embedded scripts in vue and html files
• 1.9.6
  • Disable diagnostic report for code metrics
• 1.9.5
  • Add .vscode-test to .vscodeignore
• 1.9.4
  • Replace new line characters in quick pick menu with spaces
• 1.9.3
  • Update readme
• 1.9.2
  • Fix behavior of command 'codemetrics.toggleCodeMetricsForArrowFunctions'
• 1.9.1
  • Set default of ObjectLiteralExpression to 0
• 1.9.0
  • Implement file exclusion by glob pattern
• 1.8.0
  • Upgrade to tsmetrics-core@0.4.0
  • Use new collector types from tsmetrics-core (show complexity maximum on class level)
• 1.7.2
  • Make it possible to enable / disable diagnostics
• 1.7.1
  • Always use activeTextEditor in change callbacks
• 1.7.0
  • Add experimental diagnostics support
  • Add experimental support for Lua
• 1.6.1
  • Fix spelling error of 'threshold' in configuration
• 1.6.0
  • Execute code metrics computation in language server
• 1.5.0
  • Upgrade vsdcode and typescript dependency
  • Remove unused typings
  • Extract code metrics related util class
  • Move CodeMetricsCodeLensProvider to codelensprovider folder
  • Add text decoration based on code metrics
    • Appearance can be configured with the following properties:
      • "codemetrics.basics.DecorationModeEnabled"
      • "codemetrics.basics.CodeLensEnabled"
• 1.4.1
  • Update changelog
• 1.4.0
  • Expose code lens location related configuration properties
    • "codemetrics.basics.MetricsForClassDeclarationsToggled"
    • "codemetrics.basics.MetricsForConstructorsToggled"
    • "codemetrics.basics.MetricsForEnumDeclarationsToggled"
    • "codemetrics.basics.MetricsForFunctionDeclarationsToggled"
    • "codemetrics.basics.MetricsForFunctionExpressionsToggled"
    • "codemetrics.basics.MetricsForMethodDeclarationsToggled"
    • "codemetrics.basics.MetricsForArrowFunctionsToggled"
• 1.3.0
  • Add new properties to selectively disable codemetrics for different languages
    • "codemetrics.basics.EnabledForTSX"
    • "codemetrics.basics.EnabledForJSX"
    • "codemetrics.basics.EnabledForTS"
    • "codemetrics.basics.EnabledForJS"
  • Introduce file size limit
    • "codemetrics.basics.FileSizeLimitMB" default is 0.5 MB
• 1.2.2
  • Fix behaviour of CodeLensHiddenUnder
• 1.2.1
  • Change type of IfWithElseStatement property to number
• 1.2.0
  • Add JSX and TSX support, special thanks to Aron Adler
• 1.1.6
  • Fix possible NPE in 'triggerCodeLensComputation'
  • Remove language restriction from 'activationEvents'
• 1.1.5
  • Udpate logo
• 1.1.4
  • Change textual representation in quick pick
• 1.1.3
  • Fix typo in codemetrics.basics.ComplexityLevelNormalDescription
• 1.1.2
  • Fix dependency issue with 'fs'
• 1.1.1
  • Fix issue with non up to date source file processing
• 1.1.0
  • Parse logic refactored to be a separate npm module tsmetrics-core allowing to create a gulp plugin as well gulp-tsmetrics
  • QuickPick now works with a simplified and more meaningful list, which shows only one level of the hierarchy at once
• 1.0.1
  • Default keyboard bindings removed
  • CodeLens cache invalidation side effect eliminated (dirty file)
  • Path concatenation replaced with path.join
• 1.0.0
  • Configuration properties has been renamed and listed in extension manifest
  • New property CodeLensHiddenUnder introduced to be able to hide uninteresting code lenses
• 0.5.0
  • Commands to alter code metrics behaviour added (toggle code metrics and toggle code lenses for arrow functions)
• 0.4.1
  • Showing complexity for arrow functions as well
• 0.4.0
  • Added JavaScript support
  • Removed module declaration from the complexity calculation
  • Function related complexity calculation revised
• 0.3.1
  • Fixed NPE in navigation command
• 0.3.0
  • Use script target defined in tsconfig
• 0.2.0
  • Code Metrics info command changed to display a QuickPick menu
• 0.1.0
  • Added command to be able to show code lens details
• 0.0.2
  • TypeScript added as real dependency
• 0.0.1
  • Initial project setup

License

Licensed under MIT