consensys / vscode-solidity-auditor

Solidity language support and visual security auditor for Visual Studio Code

^{[ 🌐 📩 🔥 ]}

Solidity Visual Developer

• Advanced Solidity Language Support
• Code Augmentation
• Source Exploration
• Visual Security Linting

An extension that supports developers in writing secure and well understood code

This extension contributes security centric syntax and semantic highlighting, a detailed class outline, specialized views, advanced Solidity code insights and augmentation to Visual Studio Code.

---

⚠️ Note: Customize this extension to fit your needs! Show/Hide/Enable/Disable features in Preference → Settings → Solidity Visual Developer: solidity-va.*, select one of the customized security-aware color themes in Preferences → Color Themes.

We ❤ feedback → get in touch!

---

Marketplace: ext tintinweb.solidity-visual-auditor

---

---

Features

Semantic highlighting and solidity insights for passive security awareness. Most features are configurable (preferences -> Settings -> Solidity Visual Developer)

Themes (preferences -> Color Theme):

• Visual Auditor Dark - based on the "Atom One" theme
• Visual Auditor Light (Visual Studio) - based on the standard "light (VSCode)" theme
• Visual Auditor Solarized Light - based on the standard "Solarized Light" theme

Syntax Highlighting

• access modifiers (external, public, payable, ...)
• security relevant built-ins, globals, methods and user/miner-tainted information (address.call(), tx.origin, msg.data, block.*, now)
• storage access modifiers (memory, storage)
• developer notes in comments (TODO, FIXME, HACK, ...)
• custom function modifiers
• contract creation / event invocations
• easily differentiate between arithmetics vs. logical operations
• make Constructor and Fallback function more prominent

Code fragments passively draw your attention to statements that typically reduce risk or need your attention .

Semantic Highlighting

• highlights StateVars (constant, inherited)
• detects and alerts about StateVar shadowing
• highlights function arguments in the function body

Review Features

• audit annotations/bookmarks - @audit - <msg> @audit-ok - <msg> (see below)
• generic interface for importing external scanner results - cdili json format (see below)
• codelens inline action: graph, report, dependencies, inheritance, parse, ftrace, flatten, generate unittest stub, function signature hashes, uml

Graph- and Reporting Features

• 💒🤵👰 vscode-solidity-auditor ⚭ Sūrya
  • access your favorite Sūrya features from within vscode!
  • interactive call graphs with call flow highlighting and more!
• 📈🎉 auto-generate UML diagrams from code to support your threat modelling exercises or documentation!

Code Augmentation

• Hover over Ethereum Account addresses to download the byte-code, source-code or open it in the browser
• Hover over ASM instructions to show their signatures
• Hover over keywords to show basic Security Notes
• Hover over StateVar's to show declaration information

Views

• Cockpit View
  • Explore and focus on solidity files in your workspace
  • Generate report/graphs for any files/folders selected in the explorer views
  • Selectively flatten files
  • Search for contracts that are likely to be deployed in the system
  • Context-sensitive views: click into a contract in the editor to list public state-changing method
  • Get quick access to extension settings
• Outline View
  • populates VS Code outline view with sourceUnit and contract layout
  • contracts, stateVars, methods, inherited names
  • annotates security relevant information (visibility, ...)
  • calculates complexity rating
  • annotations functions with information about whether they are accessing stateVars

Installation

Method 1: Install by going to Visual Studio Market Place and click Install.

Method 2: Bring up the Extension view in VS Code and search for Solidity Visual Developer and click Install

Method 3 (Manual):

1. Download the latest compiled extension as *.vsix
2. Fire up Terminal and install the extension by running code --install-extension "solidity-visual-auditor-0.0.x.vsix"
3. vscode --> preferences --> color scheme --> Solidity Visual Developer Dark

Tour

Scroll down and take the tour.

• semantic highlighting for state variables (constant=green, statevar=golden, inherited=blue)
• semantic highlighting for function arguments
• outline view with security annotations and inherited names
• tooltips (asm instruction signatures, security notes)
• @audit tags
• graph's and uml
• generic interface to import issues from external scanners
• Cockpit View

Feature: Ethereum Account Address Actions

Ethereum Account Address Actions

• open the account on etherscan.io
• show the contract code
• show the VerifiedContract source code
• decompile the byte-code. requires vscode-decompiler

Feature: Semantic function argument highlighting

Semantic function argument highlighting

• arguments are assigned different colors in the scope of the function

Feature: Inline Bookmarks

Inline Bookmarks: @audit tags

This feature is provided by Inline Bookmarks.

• @audit - <msg> ... flag lines for security review or start a security review discussion
• @audit-ok - <msg> ... flag that a line was checked for security or a security discussion on that line turned out to be a non-issue

Feature: Code Augmentation / Annotations / Hover / Tooltip

Code Augmentation / Annotations / Hover / Tooltip

• additional information for various keywords (including security notes)

• asm instruction signatures

• Address hover integration via tintinweb.vscode-ethover
  • Open it in etherscan (or whatever you configure)
  • Show address balance in hover (mainnet) (note: might be rate-limited, configure your API key in settings)
  • Download the bytecode and disassemble it.
    • With hover info on instructions
    • Representation of data as ASCII and resolving 4bytes to funcsigs, Color code reflects the type of instruction: stack, memory, storage, arithm., logic, system, environment, …
  • Download the bytecode and show it.
    • With hover info
    • Click to see instruction boundaries
    • Color coded bytes to reflect type of instruction)
  • Show verified contract source (etherscan.io)
  • Show reconstructed contract source from eveem.org
  • Show reconstructed contract source from evm.js
  • run vscode-decompiler to decompile it manually using panoramix (eveem.org) locally

Feature: State Variable Highlighting

State Variable Highlighting

• highlight contract local stateVars (golden box)

• alert on a shadowed variable (red box)

• highlight const stateVar (green box)

• highlight inherited stateVar (blue box Approval)

Feature: CodeLenses

CodeLenses

• surya - interactive graph

• surya - generate report, show inheritance, show AST

• flatten source file with tintinweb.vscode-solidity-flattener (using truffle-flattener)

• surya - ftrace

• UML - auto-generate UML for source-units or specific contracts

• Function Signature Hashes

Feature: Outline View

Outline View

• library with function parameters T and declarations

• class and events, functions annotated (stateMutability, visibility)

• class and events, functions annotated (stateMutability, visibility)

• inheritance browser - resolves inheritance, only shows inherited names

• extra information (subjective function complexity; accesses stateVar?)

Feature: Cockpit View

Cockpit View

We've been working on a new cockpit view that allows you to navigate large codebases more efficiently. Check out the new    icon in the activity bar to your left.

So, what can you do with it?

• Explore .sol files with the new workspace explorer
• Generate report/graphs for any files/folders selected in the explorer views
  
• Conveniently flatten selected files (selected folders or all files in the top-level view) (Note: truffle-flattener may require an npm install of the project for flattening to work)
• Search for contracts that are likely to be deployed in the system (complete workspace or selected folders)
  
• Context-sensitive views: click into a contract in the editor to list public state-changing methods
  
• Get quick access to extension settings
  

And there is more to come 🙌 stay tuned!

Note: The cockpit view is fully customizable. You can hide both the sidebar menu or any view in the cockpit that you do not need (right-click → hide).

BuiltIn: Commands

Commands

• suggest top level contracts aka "entrypoint contracts" (most derived)
• flatten current (codelens) or all suggested top level contracts (command)
• list all function signatures (human readable or json format)
  
• open remix in external browser

Please refer to the extension's contribution section to show an up-to-date list of commands.

Theme: Solidity Visual Developer Light (VSCode)

Theme: Solidity Visual Developer Light (VSCode)

Theme: Solidity Visual Developer Dark

Theme: Solidity Visual Developer Dark

Simple DAO

Vulnerable Contract

Theme: Solidity Visual Developer Solarized Light

Theme: Solidity Visual Developer Solarized Light

Simple DAO

Configuration: Settings & Customizations

Extension Settings

• solidity-va.mode.active .. Enable/Disable all active components of this extension (emergency master-switch).
• Solidity-va.parser.parseImports ... Whether to recursively parse imports or not
• Solidity-va.hover ... Enable or Disable generic onHover information (asm instruction signatures, security notes)
• Solidity-va.deco.statevars ... decorate statevars in code view (golden, green, blue boxes)
• Solidity-va.deco.arguments ... enable/disable or select the mode for semantic highlighting of function arguments. (default: 'enable' = 'color and arrow')
• Solidity-va.deco.argumentsMode ... select the mode for semantic highlighting of function arguments (may require a reload)
• Solidity-va.deco.argumentsSuffix ... a custom Suffix/Symbol that is appended to the decoration when performing semantic highlighting for function arguments
• Solidity-va.outline.enable ... enable/disable outline and symbolprovider
• Solidity-va.outline.decorations ... decorate functions according to state mutability function visibility
• Solidity-va.outline.inheritance.show ... add inherited functions to outline view
• Solidity-va.outline.extras ... annotate functions with extra information (complexity, statevar access)
• Solidity-va.outline.var.storage_annotations ... Whether to show/hide storage annotations for variables in the outline view
• Solidity-va.outline.pragmas.show ... Whether to show/hide pragmas in the outline view
• Solidity-va.outline.imports.show ... Whether to show/hide imports in the outline view
• Solidity-va.diagnostics.import.cdili-json ... Automatically import diagnostic issues from external scanners using the cdili-issue.json format:

  {
    "onInputFile": "contracts/BountiesMetaTxRelayer.sol",
    "atLineNr": "10",
    "ruleType": "code_smell",
    "severity": "major",
    "linterVersion": "0.1",
    "linterName": "maru",
    "message": "State Variable  Default Visibility - It is best practice to set the visibility of state variables explicitly. The default           visibility for \"bountiesContract\" is internal. Other possible visibility values are public and private.",
    "forRule": "State_Variable_Default_Visibility"
  }

• Solidity-va.codelens.enable ... enable/disable codelens support (inline code actions)
• solidity-va.preview.dot ... open dot output in graphviz rendered form
• solidity-va.preview.markdown ... open markdown output in rendered form
• Solidity-va.tools.surya.input.contracts ... Define whether surya should take cached files or all contracts in the workspace as input

Please refer to the extension's contribution section to show an up-to-date list of settings.

FAQ

• Q: The uml feature does not seem to work. How can I set it up?
• A: We are relying on a properly set-up plantuml installation. Please follow the set-up guide at jebbs-plantuml vscode extension.

Known Issues

• outline view does not always refresh. TempFix: modify and save the file to trigger a refresh.
• codelenses do not appear. TempFix: modify and save the file to trigger a refresh.
• github issues

Acknowledgements

• Themes: Atom One Dark Theme and an adapted version of built-in Solarized Light
• Base Grammar for Solidity: vscode-solidity

Release Notes

Changelog

vscode-solidity-auditor's Issues

Should identify mappings

Hovering over the variable it reports

(undefined) StateVar StandardBounties.bounties

I was expecting

(mapping(uint => Bounty)) StateVar StandardBounties.bounties

Does not work with newer versions of solidity

I'm seeing this in the VSCode console:

I hope it will be fixed by this: Consensys/surya#142, and updating this repo to use the community parser.

Empty Call Graph

• Call Graph is empty, screenshot:
  

• Clicking the contract interaction graph button does nothing

Error on "Set color theme"

When I click on 'set color theme':

I get this error message:

TBH I'm not really sure what that button should do.

funcsigs shown for internal functions

rework funcsigs and only show sighashes for external/public methods

Rename to Solidity Visualizer

I now feel sure that we should do this, also in the Marketplace.

Feature Request: UnitTest stub support for Hardhat/Ethers (instead of truffle)

If adding something like this wouldn't clutter things too much I'd be happy to work on a pull request.

@audit-issue

This is a feature request.

Next to having @audit and @audit-ok, it would be great if there was also @audit-issue.

this command would signify that an issue has been created in github/bitbucket, having a blue marker instead of red/green.

besides this this plugin is already amazing 👍

feat-req - outline add function modifiers to function as subnode

get a better view on permissions

ftrace not doing anything

Hi,

I am on 0.0.22. When I click funcSig, I correctly get the function signature. But when I click ftrace, nothing happens. Here is the top most output from my dev console:

console.ts:137 [Extension Host] stack trace: ReferenceError: opts is not defined
at Object.FunctionCall (/Users/dteiml/.vscode/extensions/tintinweb.solidity-visual-auditor-0.0.22/node_modules/surya/lib/ftrace.js:563:13)

Failing to retrieve evm.js reconstructed source code

Selecting evm.js from the hover options results in no contract code being returned. Instead, it seems to hang and load indefinitely.

Windows 10.0.18363
VSCode 1.47.2

Add PNG output option to graphs [Feature request]

When generating the graph of a contract, the output options are SVG, and DOT. Having the option to generate a common format such as PNG is useful too.

feat-req: check for @audit in comment and add gutter to line (like bookmarking lines)

Extra characters (lineNumber) in Declaration path

Version: 0.0.11

It seems that the LineNumber:CharacterNumber is included in the dependency path, which leads to failure to "Jump to Declaration".

e.g.:
When hover on a mapping, this message is shown:
(mapping( bytes32=>Entry )) StateVar HashRegistrar._entries (Declaration: #16)

When clicked on (Declaration: #16) VSCode tries to open a file in the "correct" path but wrong file name: HashRegistrar.sol:133:1

Unable to open 'HashRegistrar.sol:133:1': File not found (file:///PATH_TO_THE_DIRECTORY/node_modules/@ensdomains/ens/contracts/HashRegistrar.sol:133:1).

Annotations appear on both sides of a split window

When I open a Solidity file in one pane and a Javascript file in a pane next to it, I see highlights and annotations in the Javascript file for variables, etc from the Solidity file. It appears to be triggered when I edit and save the Javascript file.

If I switch to a different file and come back, the annotations disappear.

feat-req: show modifier invocations in outline

Highlight shadowed function parameters

Currently, the extension highlights places where a state variable is shadowed by a local variable. It also would be useful to see when a function parameter is shadowed by a local variable.

Function selector is incorrect if there's a comment in the function signature definition

Steps to reproduce:

1. See this function has an inline comment
2. Run "List function signatures" for this file
3. Notice how it outputs 1137c1f8 => sendToken(address,address,uint256,bytes32,//) when it should output b9bfabe1 => sendToken(address,address,uint256,bytes32,bytes32)

Function linked above:

function sendToken(
    address _receiver,
    address _tokenAddr,
    uint256 _amount,
    bytes32 _pkx, // ephemeral public key x coordinate
    bytes32 _ciphertext
) external payable {
   ...
}

VSCode-Error: Proposed API is only available when running out of dev or with the following command line switch...

Unfortunately, vscode decided to suddenly disable proposed api features like the treeviewElement.tooltip property. I've disabled the tooltip feature for now. This only affects the cockpit->settings view. The tooltip will not show up anymore.

Let's re-enable this once they've come to a conclusion that this is added to their main API.

solarized-light-theme: make natspec params less distractring

The solarized theme highlights natspec keywords in dark bold which can be quite distracting.

therefore we are planning to make them less distracting by changing the color from black -> greyish

Underlining underscore makes it look weird.

Underlining underscore makes it look weird, kind of like an equal sign!

Yellow exclamation mark appears in VS Code

I get a yellow exclamation mark next to a low-level call. There is no further information when I hover over it nor any problems/warnings logged.

Trigger: it's the parameters in the curly brackets (in my case {gas: req.gas}) that cause the warning. If you remove these arguments, everything disappears.

Does someone have idea how to fix this (the code compiles also w/o any warnings):

Also see: juanfranblanco/vscode-solidity#257 for a smart contract to replicate the warning.

What does the complexity mean? Is it the gas to be costed?

Outline View:
populates VS Code outline view with sourceUnit and contract layout
contracts, stateVars, methods, inherited names
annotates security relevant information (visibility, ...)
calculates complexity rating
annotations functions with information about whether they are accessing stateVars

error: invalid `funcSig` output for solidity functions containing `uint` type

There is an invalid hash of signature function calculation for uint types.

The next function has a signature provideAccess(address[],uint256[],bytes32,bytes)

function provideAccess(address[] _addresses, uint[] _amounts, bytes32 _key, bytes _info) public {
// ...
}

Then it should have the next hash:

> require("web3-utils").soliditySha3("provideAccess(address[],uint256[],bytes32,bytes)").slice(0, 10)

'0x745ca7ea'

but funcSig command returns like:

> require("web3-utils").soliditySha3("provideAccess(address[],uint[],bytes32,bytes)").slice(0, 10)

'0xb196df14'

Flaterra does not support importing contracts from node_modules.

Probably it will be better to use truffle-flattener and run flattening command with npx truffle-flattener inputfile > output?

feature-req: output a list of function signature hashes for the current file

preferrable as text or harvey json

new theme: light_vs - based on vscode default light theme

new light theme.

Re-Enable Cockpit->Settings tooltip once API is stable

see #59

Preview not showing graphs

I can get the diagraph G with meaningful contents in it, however, the Preview tab does not have the desired graph showing up. Actually it is not showing up anything. I have reopenit the editor after installation. Wondering why this is case. Thanks.

Annotations appear on words in comment blocks

The extension appears to be treating comment blocks as code. For example, if I have a block like

/**
@dev An example for this issue
*/

then hovering over the word "for" gives me an annotation about LOOP - check for OOG conditions. Similarly, I get one when hovering over the word "this."

Add "Surya - graph (this)" to the command palette

Context

For my current workflow, I usually find the Surya - graph(this) functionality more useful as it is less noisy and helps me to better understand a subset of a large codebase.

However this is only accessible via code lens which I keep disabled most of the time, since it adds clutter.

Request

I would like to have access to the graph(this) function from the command palette.

Function selector is incorrect for structs

Hey again @tintinweb—I know in #68 you mentioned the signature extraction is hacky and you don't expect many people use it, but actually it's probably the feature I use most, so here's another related issue 😁

The issue:

• The function selector for this method is 0x9120491c
• But the extension reports 0xe1acd927

In this case the method linked is an array of structs. I think I've also seen regular structs and interfaces (e.g. function someMethod(IERC20 _address)) give the wrong function signature, though I don't have an example handy—I can double-check and confirm this if you need

Installation Note - DeprecationWarning: Buffer()

Installing extensions...
(node:31038) [DEP0005] DeprecationWarning: Buffer() is deprecated due to security and usability issues. Please use the Buffer.alloc(), Buffer.allocUnsafe(), or Buffer.from() methods instead.

Windows: Codelenses not showing up

I have just freshly installed the plugin on Windows 10 VS Code. The codelenses are not showing up for me. I have installed Surya and Graphviz before.

I saw that there is a bug mentioned about codelenses not showing up. So I changed the file and saved it to trigger a reload but it doesn't help. Also uninstalled / reloaded the plugin multiple times. The settings for codelenses are enabled.

I'm not sure what exactly I need to post so you can investigate, just let me know.

Map truffle style dependencies

It is possible to import contracts using @ which truffle pulls using npm install. However these contracts will be installed in npm-modules which truffle maps to the contract folder.

In this scenario, it is not possible to jump/see the definition of imported functions.

e.g.
import "@ensdomains/ens/contracts/ENS.sol"; in
https://github.com/ensdomains/ethregistrar/blob/master/contracts/BaseRegistrarImplementation.sol

feat-req: show value for identifiers resolving to constants.

Show value when hovering over constant values that can be resolved directly.

funcSig to use recursive type resolving (AST) rather than lexical parsing

I used the funcSigs and found out there’s a discrepancy between what it shows and what it should be:

function _executeActionsFromFL(Task memory _currTask, bytes32 _flAmount)

Which SVA shows as :
4517bb07 => _executeActionsFromFL(Task,bytes32)

But the actual func signature that calls this function as the callback is: 0xd6741b9e

Apparently, the struct that is in the function argument (abi) should be expanded.

    struct Task {
        string name;
        bytes[][] callData;
        bytes[][] subData;
        bytes32[] actionIds;
        uint8[][] paramMapping;
    }

Something like: "_executeActionsFromFL((address,address,uint256,...),bytes32)"

feature-req: interactive graphs 😎

going to be awesome! but let's release surya graph first ;)

feat-req - track external calls

Constructor visibility warning issue

When a constructor visibility is set to public, a warning is shown" Visibility for constructor is ignored. If you want the contract to be non-deployable, making it "abstract" is sufficient
However, explicitly mentioning is needed; else there is an error when trying to compile: SyntaxError: No visibility specified. Did you intend to add "public"?

I'm using Truffle v5.1.40 (core: 5.1.40) and Node v14.8.0

Fix linter warnings

graph(this) feature does not work

It returns only text file.

I have installed all needed extensions and surya v2.0.11. I use Ubuntu 18.04.

Maintenance / Parser update - wait for upstream to fix location information (affects v0.13.x)

refs solidity-parser/parser#46

Funcsig collision false positives

You knwo what I mean

Wrong arrow direction for inheritance property in plantuml script generation

Describe the bug
Uml function generate a wrong uml class diagram.
For example, following Solidity contract:

pragma solidity ^0.5.0;

import "openzeppelin-solidity/contracts/math/SafeMath.sol";
import "./Stoppable.sol";

contract StoppableElement is Stoppable {
    using SafeMath for uint256;
    constructor () Stoppable(false) public {
    }
}

where StoppableElement derive from Stoppable class, generate following plantuml script and diagram:

@startuml
' -- for auto-render install: https://marketplace.visualstudio.com/items?itemName=jebbs.plantuml
' -- options --



' -- classes --


class StoppableElement {
    ' -- inheritance --
	{abstract}Stoppable

    ' -- usingFor --
	{abstract}📚SafeMath for [[uint256]]

    ' -- vars --

    ' -- methods --
	+**__constructor__**()

}
' -- inheritance / usingFor --
StoppableElement <|--[#DarkGoldenRod] Stoppable
StoppableElement <|..[#DarkOliveGreen] SafeMath : //for uint256//

@enduml

where inheritance arrow is in wrong direction.

Expected behavior
Inheritance tags should be:

' -- inheritance / usingFor --
Stoppable <|--[#DarkGoldenRod] StoppableElement
SafeMath <|..[#DarkOliveGreen] StoppableElement : //for uint256//

Screenshots

should be:

feature-req: add "flatten all" command

• use builtin "find top level contracts" command to find all candidates for the big flattening
• flatten the files using flaterra https://github.com/cleanunicorn/flaterra
  • create a popup and ask people to install flaterra (pip3 install --user flaterra) if not available

Feature request: 'Find references'

JS language support has a really nice 'find references' feature, which would be really nice to have here. My use case would be highlighting sensitive state vars so I can review any code that touches it.

A similar feature would be the ability to highlight a state var, with an icon. Much like how arguments are indicated an arrow in the extension.

Disable stateVar highlighting

I'm trying to disable stateVar highlighting but it doesn't seem to work. Did it both globally from the settings and for the current workspace. Also checked the json file and it seems to have both "deco" values set to false. On the other hand I had no problems disabling hilighting function arguments.

"solidity-va.deco.arguments": false, "solidity-va.deco.statevars": false

Not sure if there's something wrong on my end. Maybe a problem with another extension?

Graphing features aren't rendering graphs

Clicking on "report", "graph (this)", "graph", "inheritance", "parse", and "flatten" result in no action. No graph is rendered, no text file is created, and no errors are shown.

Clicking on "funcSigs" does work -- it produces a text file as expected.

I'm running version 0.0.17.

Alphabetical order in the top-level contracts sidebar section

Can we have the "Top-level contracts" sidebar section display the results in alphabetical order? 😊