Here are the slides from my talk at BSides Leeds on performing JavaScript Static Analysis Video to talk: https://www.youtube.com/watch?v=mGUsCAWwLGg

1. © 2017 Synopsys, Inc. 1
Performing JavaScript Static Analysis
A high-level overview of performing code review on JavaScript apps
Lewis Ardern
January 26, 2018

2. © 2017 Synopsys, Inc. 2
About Me
• Sr. Security Consultant @ Synopsys Software Integrity Group (SIG)
– Formerly Cigital
– 4 years within the security space
– Ph.D. Candidate at Leeds Beckett University
• Prior to Cigital
– B.Sc. in Computer Security and Ethical Hacking
– Founder of the Leeds Ethical Hacking Society
– Software Developer
– Security Consultant
• Synopsys
– Historically all about hardware
– SIG formed to tackle software
– Team consisting of well-known organizations
– BlackDuck
– Coverity
– Codenomicon
– Cigital
– Codiscope
Lewis

3. © 2017 Synopsys, Inc. 3
Agenda
• JavaScript Landscape
• JavaScript Security Issues
• Static Code Analysis and Review Methods
• Challenges with JavaScript Code Analysis
• Tools and Automation
• Customizing Tools

4. © 2017 Synopsys, Inc. 4
JavaScript Landscape
From the beginning to now

5. © 2017 Synopsys, Inc. 5
A Time Once forgotten
• JavaScript was introduced in 1995
• JavaScript as we know it is an implementation of ECMAScript
• The web was predominantly Server Based
– Client: HTML, CSS, and JavaScript
– Server: .NET, PHP, Java, etc
– Database: MSSQL, MySQL, Oracle, etc
• The old view was that you only had to protect the Server
• The client was for aesthetics

6. © 2017 Synopsys, Inc. 6
Life as we know it
"JavaScript is the most commonly used programming language on earth. Even back-end developers are
more likely to use it than any other language.” – 2016 Stack Overflow Developer Survey
https://insights.stackoverflow.com/survey/2017

7. © 2017 Synopsys, Inc. 7
Example of Full-Stack JavaScript
Database
MongoDB
Server
Node.js/Express.js
Client
Angular/AngularJS

8. © 2017 Synopsys, Inc. 8
Lets be REACTtive!
• Every week, new JavaScript frameworks are created
• Frameworks are terrific development tools, but they all come
with their own specific security features, and threats
• Frameworks are sometimes vulnerable by default
– Abusing JavaScript frameworks to bypass XSS mitigations
• Teams transition to different frameworks in rapid succession
• Automated security tools are slow to adopt new frameworks

9. © 2017 Synopsys, Inc. 9
JavaScript Security Issues
Identifying issues by looking at code

10. © 2017 Synopsys, Inc. 10
Personal Tips
When working with a new language or framework here are my tips:
• Learn the idioms of the language
• Learn one issue well before moving onto the next
• Always document issues that you have found, and keep the code as a reference
• Use tools but do NOT rely on them

11. © 2017 Synopsys, Inc. 11
Covered Today
• Captured by automated code scanners
–Dynamic Execution of JavaScript
• Often misunderstood by Developers and Security Consultants
–postMessage
• Not easily detected by automated code scanners
–Client-Side Trust

12. © 2017 Synopsys, Inc. 12
Dynamic Execution of JavaScript
Method Example
eval(expression) eval("ale"+"rt(document.co"+"okie)");
execScript(expression [, language]) window.execScript("alert(document.cookie)");
setTimeout(expression, milliseconds) setTimeout("alert('XSS')",3000);
setInterval(expression, milliseconds [,
language])
setInterval("alert('XSS')",3000);
JavaScript provides various ways to execute JavaScript dynamically
• DOM-XSS happens quite often through Dynamic Execution of JavaScript
• Avoid the use of user-input in execution queries such as eval

13. © 2017 Synopsys, Inc. 13
Dynamic Execution of JavaScript
When worlds collide
JavaScript
ExecutionClient
RCEServer

14. © 2017 Synopsys, Inc. 14
Dynamic Execution of JavaScript Demo
When worlds collide

15. © 2017 Synopsys, Inc. 15
postMessage
• Websites by default are not able to communicate with each other due to the Same Origin
Policy (SOP)
• window.postMessage method enables cross-origin communication between Window objects
– Page and a popup it spawned
– Page and an embedded iframe
• If the developer does not validate the origin, any website can communicate with the message

16. © 2017 Synopsys, Inc. 16
postMessage Example

17. © 2017 Synopsys, Inc. 17
postMessage Exploit

18. © 2017 Synopsys, Inc. 18
postMessage Remediation

19. © 2017 Synopsys, Inc. 19
postMessage Demo
Crossing the origin

20. © 2017 Synopsys, Inc. 20
Client-Side Trust Issues
With the introduction of all of these frameworks, a lot of the heavy load has moved to the client
• Wrong assumptions:
• Data stored on the client is not accessible to attackers
• Data submitted by the client to the server is controlled by the client-side code
• In fact:
• Data stored on the client is almost always accessible to attackers
• Actions performed on the client are fully controlled by attackers
• HTML5 storage persists
• Sensitive information should not be stored in caches pages, forms data, or cookies
• Sensitive information should only be stored in sessionStorage, rather than localStorage
• Sometimes only client-side controls are relied on to protect Sensitive Data
• https://finnwea.com/blog/stealing-passwords-from-mcdonalds-users/

21. © 2017 Synopsys, Inc. 21
They are client-side checks!

22. © 2017 Synopsys, Inc. 22
Static Code Analysis and Review Methods
Let’s walk the tree

23. © 2017 Synopsys, Inc. 23
Static Analysis
• Manual Code Review is painful and can be boring if you have millions of lines to look at
• The term is commonly used to describe the automated process of reviewing the code using
Static Code Analysis (SCA)
• Usually carried out at the implementation phase of a Software Development Life Cycle (SDLC)

24. © 2017 Synopsys, Inc. 24
Static Analysis
• It helps identify:
– Security vulnerabilities introduced due to coding errors
– Security vulnerabilities deliberately introduced in source code

25. © 2017 Synopsys, Inc. 25
Source
Code
Tokens Lex Parse Semantics
Abstract
Syntax
Tree
Walk the
tree
Static Analysis Process
Recommended -
https://www.youtube.com/watch?v=DE18fHyZ0GI
https://interpreterbook.com/
http://astexplorer.net
http://resources.jointjs.com/demos/javascript-ast

26. © 2017 Synopsys, Inc. 26
Challenges with JavaScript Code Analysis
• JavaScript is an object-based prototypal language, which can be dynamically changed at run-
time
• Every JavaScript object has a prototype object, which can be overridden to do something
different:

27. © 2017 Synopsys, Inc. 27
Variables of JavaScript Can Contain Different Types

28. © 2017 Synopsys, Inc. 28
In addition, JavaScript Has Type Coercion
• Type Coercion converts one type of object to a new object with similar content, but of a
different type

29. © 2017 Synopsys, Inc. 29
JavaScript Has Higher Order Functions
• Higher-order functions can take another function as an argument

30. © 2017 Synopsys, Inc. 30
JavaScript By Default Is Forgiving
• Strongly Typed JavaScript frameworks to created to make developer lives easier
• Strongly typed JavaScript === less bugs

31. © 2017 Synopsys, Inc. 31
New Languages and Features
• Everyone wants to invent their own way of building modern applications
• GWT - Java to JavaScript
• TypeScript – Typed JavaScript to JavaScript
• Pyscript – Python to JavaScript
• FunScript – FSharp to JavaScript
• More - http://todomvc.com
• The support is low for automated code scanning against these frameworks
• Strongly Typed JavaScript is transpiled to JavaScript before interpreted
• Issues can be identified in the JavaScript code, but need to be mapped back to the problem location
• New features such as ES6/7/8 require updates to the static analysis process

32. © 2017 Synopsys, Inc. 32
Data Flow Analysis
Explaining Sources and Sinks in JavaScript
• Dynamic Execution of JavaScript
• AngularJS XSS

33. © 2017 Synopsys, Inc. 33
Commercial products that perform
JavaScript data flow analysis:
• Coverity
• Fortify
• Checkmarx
• AppScan Source
• VeraCode
Tools that look for known issues in
JavaScript libraries:
• Retire.js
• NSP
• Snyk
Tools that look for areas of interest:
• Burp Passive Scanner
• ScanJS (Deprecated)
• JSHint
• JSLint
• ESLint
Tools that deobfuscate JavaScript:
Closure Compiler
JStillery
Use what works for you
JavaScript Static Analysis Tools

34. © 2017 Synopsys, Inc. 34
ESLint
• ESLint is an open-source pluggable linting utility for JavaScript
• Linters parse ASTs to identify code quality and security issues
• ESLint was created was to allow developers to enforce rules
• Can be hooked into the development release cycle
– Many developers do not allow code to be pushed with ESLint issues flagged
– You can create Git Hooks
– Can be part of CI/CD pipeline
• Allows custom rules to enforce domain specific guidance

35. © 2017 Synopsys, Inc. 35
ESLint
• ESLint is now the go-to tool to JavaScript developers
https://stateofjs.com/2017/other-tools/

36. © 2017 Synopsys, Inc. 36
ESLint Security Rules
• ESLint can help security consultants look for points of interest
• Default security rule configs
– NodeJS https://github.com/nodesecurity/eslint-config-nodesecurity
– VanillaJS https://github.com/mozfreddyb/eslint-config-scanjs
– AngularJS https://github.com/LewisArdern/eslint-config-angular-security
– React https://github.com/yannickcr/eslint-plugin-react#list-of-supported-rules
• Security rules
– eslint-plugin-scanjs
– eslint-plugin-security
– eslint-plugin-react
– eslint-plugin-angular-security
– eslint-plugin-no-wildcard-postmessage
– eslint-plugin-no-unsafe-innerhtml

37. © 2017 Synopsys, Inc. 37
Problem: In AngularJS security assessments I want to identify problem locations quickly
Solution: Create ESLint rules to run on every assessment as a starting point:
• Current
– Basic rules to identify points of interest
– Identifies:
– Security Misconfigurations
– Expression Injection
– Client-Side Open-Redirection
• Roadmap:
– More rules
– Angular 2/4 support to come
– Maintain state of variable declarations
– Improve the rules to only identify actual issues
Creating Your Own Rules

38. © 2017 Synopsys, Inc. 38
• Create a test with true positive and false positive
• Walk the JavaScript AST and identify your requirements
• Create a rule from the AST output
• Make sure the test passes
Steps To Create a Rule

39. © 2017 Synopsys, Inc. 39
Creating a Test

40. © 2017 Synopsys, Inc. 40
Identifying The Requirements

41. © 2017 Synopsys, Inc. 41
Create The Rule

42. © 2017 Synopsys, Inc. 42
ESLint Demo
Capturing points of interest on AngularJS

43. © 2017 Synopsys, Inc. 43
Summary
• JavaScript is a wonderful and weird language
• Learn types of issues well, to be able to detect them easier
• You have to be concerned of JavaScript on the Client and the Server
• Learning the underlying process of static analysis can help you identify issues easier and
quicker
• Use and extend tools but do NOT rely on them

44. Thank You