Javascript Static Code Analyzer Héctor Quartino hector@quartino.info hquartino@netsuite.com

About me 10+ years of developer experience. Multiple languages / technologies (Java, C#, JS). Curious about Security for a while. AppSec Engineer @ NetSuite.

About this talk Motivation. A bit of theory on the concepts behind static code analyzers. Related Javascript tools. Why would one want to use a Javascript Static Code Analyzer in Javascript? How does a Static Code Analyzer work? Can one leverage existing tools from the Javascript community to achieve this goal?

Static Code Analysis – What & Why? Runs on source code (white-box testing). Can use project specific rules. Can be automated. Highly effective with specific patterns. Early detection of potential issues. Static Code Analyzers are thorough and consistent (unlike a human ). Early detection is paramount because it makes it faster & cheaper to fix defects.

Why analyze Javascript code? Scripting language of the Web. Web Applications vs. Native Apps on mobile. JavaScript Server Applications Rhino NodeJS IoT Embedded Devices Home Automation Robotics DIY Trend of WebApps: websites are nowadays full fledged apps. War of native applications: should one do a native app or do a shell that contains a WebApp? Server Applications: Javascript is here to stay, with Node being available on as many platforms as Java (and there are even projects that run Node applications in JEE containers). IoT: Bring the RPi!

Why a Javascript Static Code Analyzer? Scenario of 100% Javascript Applications is more common. Testing infrastructure in Javascript too! Goal: One language can give more flexibility to teams. Goal: Run static code analysis on CI / nightly builds. Goal: Leverage existing tools available in the Javascript community. One language means that developers and quality engineers from different layers do not have a language barrier.

Static Code Analysis Limitations False positives Need a way to filter successive scan results. False negatives Some vulnerabilities need to be discovered via dynamic code analysis. Unaware of custom APIs, cross layer vulnerabilities, or configuration files. Add custom rules to mitigate.

A few compiler concepts Compiler: transforms code from one language to another. Input Lexer Tokens Parser AST Optimizer IR Generator Output

A few compiler concepts Compiler: transforms code from one language to another. Input Lexer Tokens Parser AST Optimizer IR Generator Output For many languages, the compiler already catches some types of bugs, i.e. type checking errors. Used by Static Analysis

A few compiler concepts (cont.) Lexer: transforms code into tokens. Lexical Grammar Type Value Keyword var Identifier foo Punctuator = bar ; Input Lexer Tokens var foo = bar;

A few compiler concepts (cont.) Parser: transforms tokens into AST. Abstract Syntax Tree: represents program structure. Syntactic Grammar Type Value Keyword var Identifier foo Punctuator = bar ; VariableDeclaration Tokens Parser AST foo bar

A few Static Code Analyzer techniques Data Flow Analysis Collect dynamic information about data by analyzing static information. Determine the Control Flows for a given program. pathA if (a > 1) { pathA(a); } else { pathB(1); } if end-if pathB

A few Static Code Analyzer techniques Taint Analysis: Trace variables from user inputs (taints) to potentially vulnerable functions (sinks). var searchTerms = $('q').val(); var trimmedSearchTerms = searchTerms.trim(); // … code displaySearchResults(trimmedSearchTerms, results);   function displaySearchResults(terms, results) { $(selector).append(terms); // XSS } Taints that are used by sinks without proper sanitization can lead to security vulnerabilities. Taint Analysis is a hard problem to resolve in Javascript due to its dynamic features (eval, variadic arguments, dynamic typing). This is an open avenue for additional Javascript tools.

Javascript Tools Parser: Esprima, Acorn. AST: ESTree. Code Analyzer: ScanJS. Code Analyzer, take 2: ESLint.

Esprima Standard ECMAScript parser written in ECMAScript. Supports ES6. Standard AST based on ESTree project. Heavily used, some examples: Code Minifier: esmangle Code Instrumentation: Instanbul ES6 to ES5 transpiler: esnext (uses Espree)

ESTree DEMO De facto standard AST specification. Originated as part of SpiderMonkey’s Parser API. Lots of manipulation tools available. DEMO Short Demo of AST explorer http://astexplorer.net/ Focus on the JSON format, describe the general aspects of the format A nice summary of ECMAScript AST Tools: https://github.com/estools

ScanJS DEMO Focused on client-side web applications. Web UI, no command line tools makes it hard to integrate with build tools. Developed by Mozilla, unfortunately deprecated, but lives on as plugin for ESLint: eslint-config-scanjs. Short demo of the ScanJS UI and scan results. DEMO

ESLint Uses Espree (fork of Esprima) for parsing. Pluggable architecture: All rules are plugins, more can be added at runtime. Different parsers can be used (Esprima, Espree or Babel are currently compatible). Language extensions specified at configuration. Global variables predefined through Environments. Integrates with editors, build systems, command line tools, and more! Talk about some of the integrations: http://eslint.org/docs/user-guide/integrations

DEMO Demo of ESLint in a sample project using custom rules.

Q&A

Reference material Esprima: http://esprima.org/ ESTree spec: https://github.com/estree/estree/blob/master/spec.md ESTools projects: https://github.com/estools ESLint: http://eslint.org/ ESLint integrations: http://eslint.org/docs/user-guide/integrations ScanJS ESLint Plugin: https://github.com/mozfreddyb/eslint-config-scanjs ScanJS ESLint Rules: https://github.com/mozfreddyb/eslint-plugin-scanjs-rules