Solidity VS Code extensions for development & security

EthPrague 2024 · 31 May 2024 · 21:00

At EthPrague 2024, Stepan Sonsky compares popular Solidity extensions for the VS Code editor, covering the features they have in common and showcasing those unique to each. The comparison focuses on developer tooling for smart contract development and for security work.

Speakers

Topics

From EthPrague 2024, hosted by ETHPrague.

Transcript

[Music] okay so uh everyone uh happy to see you there and uh today we going to learn something about solidity vs code extension my name is chipan and I'm a team lead ethical hacker and developer in Aki blockchain security we are based uh here in Prague and we are mainly focused to security Audits and development of open source security tools namely wake and uh tools

for solidity which we will talk about them later and also uh we are teaching solidity evm and related security at uh Czech Technical Czech Technical University okay uh these are some of our well-known clients uh we work uh for example with 1 in Lido safe Axel or rhinestone recently and also we've received some grants for our open source tools okay uh when it comes to solid TVs code extensions we have to ask what are

our requirements because different people have different needs so today we will focus basically on two areas the first one is development are there any developers out there hands up okay cool uh so if you're a developer what you need from the extension syntax highlighting of course to highlight uh for example functions State variables Etc some uh code navigation to better navigate across the code like uh go to definition go to type definition uh find all references or go to

implementation code completion because we are lazy and we don't want to write every character in the code some code actions for quick sis in the code code formatting to make our code prettier and some refactoring features like renaming symbols Etc and of course uh we need compilation during development yeah and finally debugging because developers don't like bugs but Auditors do are there any security Auditors out there hands up okay not so many

competitors in in the room well uh if you're security engineer what do you need from the extension syntax highlighting of course uh code navigation and here comes the interesting part static analysis uh we will talk about it uh later in detail but basically static analysis allows you to automatically detect vulnerabilities in the code and uh show them directly in uh the IDE vs code and then uh these vulnerabilities

can be highlighted uh directly in the code and graphs yeah graphs are pretty interesting during auditing because it allow they allows you to see the code uh in a different way not just lines of code but more visualized graphs uh I will show examples on the next slid okay uh and when you are auditing you need to write some notes into the code and uh track the issues it's uh pretty useful uh and also unit test fast test and uh test

coverage okay uh now let's take a look to the ex existing V Cod extensions which are a available on the market so the first one is solidity by by Juan Blanco it's like a golden standard in the space is the most popular extension for developing uh in solidity it has more than 1 million installations uh yeah it features uh basic stuff around the code so code navigation code completion code formatting and code actions uh there's also uh some linting using soland and E

lint uh it has a integration with ether scan so you can download the source or API from the scan and of course compilation the next one is solidity bomic Foundation uh it's really focused to hard integration so if you are hard developer this is the way to go uh yeah it features also basic uh stuff around the code so go navigation code completion code formatting and code actions uh yeah some refactoring features like uh symbol renaming and uh there's also uh hover for the

help so when you hover over some parts of code you can get a help or a documentation for example for open Zeppelin contracts uh and compilation of course the next extension is a visual developer by consensus um the name is self-explanatory it's uh very visual it contains a lot of types of graphs which are even interactive you can generate uh uml diagrams uh Etc uh you can also generate uh reports from your contracts where you can see for example lines of code lights of uh assembly code number of uh public

external functions uh Etc it's pretty useful for example for for estimates uh there's also cockpit view which allows you to at uh better in bigger projects uh outline view uh where you can see all the functions their visibility modifiers uh Etc uh you can also write your inline bookmarks uh actually this uh extension was previously named visual auditor and then consent this rename it to visual developer so it's focused also to auditing yeah uh code c l uh we haven't been talk about this uh feature yet so

cods are like little buttons above uh the functions or contracts where you can execute some actions uh like uh find all references or generating graphs and there's also um integration with ether scan so you can see balances of the contracts or you can download ABI or The Source from uh e skan the next extension is slitter which is a wellknown static analyzer uh and this extension is basically the front end for it so you can see output from the static analyzis

from slitter directly in the vs code and there is a what uh slider slider here uh slide 12 yeah thank you so yeah uh you can filter issues by type in the extension uh and yeah now we can move to the next one uh midx by consensus it's also static analyzer but unfortunately it was discontinued

recently uh it was very helpful for our early auditing days and also it was a great inspiration for us uh for developing uh wake framework so thank you consensus for your good work uh the next extension is uh not focus to the development or security itself but more on more seamless auditing Pro process so it's a collaborative code review tool where the team of Auditors can collaborate and make a notes to the code and um uh it has a very good uh GitHub issues integration so from the extension you

can create a new GitHub issues um you can Mark reviewed files and this progress is even shared across the auditor team and also there are some uh daily logs when you can see your progress uh by reviewed lines of code okay and now I would like to tell you something about uh our uh tools for solidity extension which is powered by wake uh at the beginning I would like to shortly describe what the wake is we will have also uh talk about the Wake itself on Sunday uh 2 p.m at the root stage so uh V is basically uh python based development and testing

framework uh it contains a static analyzer uh there is also lot of powerful stuff around fuzzing fuzzing is uh like putting random values into your contracts and functions uh then you run them for couple hundreds of thousand cycles and then you can discover some hidden issues which uh cannot be uh or it they are very hard to discover by manual review also we have a interactive debugger with detailed code faes and uh finally there is a LSP server which is like back end for our

extension and um yeah the clicker is somehow broken okay and uh now about the tool Force solidity itself uh it's on the opposite uh front and from the WG so one of the main features is uh static analysis and our detections UI where you can see your vulnerability detections directly in the vs code I will uh show it on on the next slide and uh yeah you can see this this potential

vulnerabilities uh highlighted directly in the code uh we have some graphs I'll show them on the next slide as well uh you can see coverage of your tests and yeah also uh We've recently introduced vest Cod printers uh and I will describe this feature also in a few um in a few minutes uh so we have a basic uh stuff around the code so code navigation go to references implementation FAL uh references uh Cod lens actions and uh

compilation okay and now let's take a look uh to the detail of some interesting features so this is our detections UI where you can see uh the detections from the static analysis directly in the vs code uh you can filter them by impact or confidence uh you can group them by detector or this criteria and um these are uh some of the examples of our two-dimensional icons so we are evaluating impact of the vulnerability and uh how confident uh the detector is about this finding so I

think it's pretty clear high impact high confidence high impact low confidence Etc um yeah and these vulnerabilities as I said are highlighted directly in the code so we have underlined uh the part of code which can be potentially exploitable this is a example for reentrancy and in the detail you can see uh from which contract and which function uh it this potentially EXP table yep now here comes the graphs uh graphs are pretty useful uh if you are auditing bigger projects and you want to

see the overview of the project uh like U here is the example for inheritance so inheritance graph can transform this inheritance chain to this uh inheritance tree control flow graph uh here we have a simple transfer function when we uh changing the balances of cender and recipient and control flow graph can transform this code into this graph uh this is pretty simple example but for more complicated uh algorithms and functions it's uh pretty useful to

see all the executing parts of the code yeah uh here's the test coverage uh and we are supporting even uh real time test coverage during uh the fuzzing and yeah uh vs code printers it's our recent uh feature in the tool Force solidity and vs code printers allows us to execute native commands in the vs code from the LSP server um here's the example for uh Cod L for public

functions uh above the contract so when you click on it uh you can see uh public functions and you can navigate to them uh and lot of uh new features um regarding the V code printers are uh coming soon okay and uh today uh we would like like to exclusively for the E pra announce one new interesting feature so let me invite to the stage Lucas the developer of project sake to tell you more uh hi guys I'm Lucas I'm an auditor

and developer at Aki and I am the developer behind our newest project uh sake so to start uh who here is familiar with remix IDE all right I see that many of you know what I'm talking about uh for those unfamiliar remix is a web-based code editor uh made specifically for solidity development featuring a uh very intuitive UI for thanks uh featuring a very intuitive UI for uh compilation deployment and interaction uh with your smart contracts on a usually uh local chain uh so we loved what uh remix was

doing with the user experience for the developers however we all know that it can be a bit of a hassle to use multiply these for uh different development uh and that's the reason why we started to develop uh sake which is a remix like UI however in your own vs code uh so to start uh imagine you have a um workspace with a few solidity files and firstly you might want to start with compilation right uh sake is able to automatically locate all the solidity files you have in your workspace and it compiles them all in bulk uh we are able to do this because of wake's underlying

uh very Speedy compilation uh it also is able to automatically select the correct saly compiler version uh so the compilation is really as easy as it gets then uh once compiled you can deploy these compiled contracts on a local uh chain um you can deploy them on the local chain then uh if we go to the Run tab uh this is the place where you can interact with these deployed contracts uh you can see a very familiar interface we didn't really want to reinvent the wheel here uh and since so many developers are familiar with uh what remix provides uh we decided to build uh up on that so you see some um

information about your contracts the addresses the balances some controls and mainly you can see an interface which gets generated from the contract ABI uh featuring some uh featuring all the cable functions together with the respective input fields and uh you can use this interface to make simless contract calls to the local chain uh and get the results call traces events and so on immediately back and all inside your vs code uh sake should be available later this year I think and it will be available as part of our already existing tools for solidity extension so if you are already user you can expect

all of this to come to you without um any additional setup needed from your side yeah uh thanks to Stan and I will give him back the [Applause] stage yeah uh thank you lukash I'm super excited to uh see these features coming to our extension looking forward and now uh back uh to the summary of extensions we've talked about uh today uh every extension has some strengths and weaknesses advantages and dis advantages uh even ours but uh we are working hard to cover all of these areas

development security and auditing in our tools for solidity so uh the perfect uh one extension does not exist and uh today you have a bigger overview around some of the most uh famous popular and uh you can pick the ones which suit your workflow so thank you very much and I would like to invite you if you are interested in fuzzing today Andre has a workshop uh in Hecker house at 4:30 and U Sunday 2: p.m. at root stage Mel will

have a talk about our wake framework so thank you very much and see you the bar