A dynamic analysis framework for front-end JavaScript. It allows you to plug in your analysis code to analyse JavaScript code running in any real-world websites. This framework is programmable and extensible. Like Pin, Valgrind, Dynamorio for C\C++, Jalangi Firefox extension instrument JavaScript code in webpage to facilitate different kinds of program analysis, for example, profiling, taint analysis, object allocation tracking, finding bugs, detecting performance issues, or even heavy weight analysis like symbolic execution or concolic execution. Please check out our project website: https://www.eecs.berkeley.edu/~gongliang13/jalangi_ff/

1. Liang Gong
alangi Firefox Extension:
A Lightweight Dynamic Analysis Framework
for Frontend JavaScript
gongliang13@berkeley.edu
Advisor: Koushik Sen
ksen@cs.berkeley.edu

2. alangi Firefox Extension:
A Framework for frontend Javascript analysis
Check out our project website
https://www.eecs.berkeley.edu/~gongliang13/jalangi_ff/index.html
Or Simply Google: Jalangi online demo

3. alangi: A Selective Record-Replay and
Dynamic Analysis Framework for JavaScript
With hooks you can do:
• Dynamic analysis
• Symbolic execution
• Test case generation
• Bug finding
• Performance analysis
• Monitoring dynamic behaviors
• Debugging
• Modifying program behavior
• Profiling

4. alangi Firefox Extension:
A Framework for frontend Javascript analysis

5. alangi Firefox Extension:
A Framework for frontend Javascript analysis
Limitations of Original Jalangi:
• Offline instrumentation of JS
• Unable to handle live webpages
• Unable to instrument JS embedded in HTML
• Record on browser and analyze on node.js during replay
• No live debugging or analysis
• Did not work for Firefox JS engine
• Due to function hoisting
• Limited to V8 and node.js
Jalangi Firefox extension removes these limitations
Supports live light-weight analysis of webpages
Instrument all JS code: better accuracy

6. Instrument almost all JavaScript code
Different places that may imports Javascript code
• Inline, between <script> and </script>
• External file: src attribute of a <script> tag
• HTML event handler attribute, such as onclick or onmouseover
• URL: javascript: protocol
• Ajax: jQuery.getScript() or importScript()
• Generated by Script: src_elem.innerHTML = “function(){}”
More Complex Code Execution Model/Environment:
• Js Code may be triggered at different time
(page loading, specific events, asynchronous call)
• Different JS Context:
• Firefox Extension JS Context
• Webpage Js Context
• HTML5 Webworker Js Context (multithreading)

7. How Jalangi Extension Works
Jalangi Extension
Observe requests & intercepts responses
that contain Js and webpages

8. Interesting Analysis Applications(Toolbox)
Check NaN:
• Find a bug in jQuery-1.8.3
• Find strange operations in real-world websites
Modifying Code Behavior:
• Modify frontend dynamic effects
• For program understanding purposes
• Graphviz online
• AttackMap
Runtime Call Graph
Analyze Performance Issue:
• Function or operation counter
Check JIT Compiler Unfriendly Statements:
• Polymorphic Statements

9. Detect a NaN in After diagnosing, confirm that is a bug.
Check NaN Bug [ < 100 Loc]
[object Object].d <= undefined
c <= undefined
[object Object].refcount <= NaN
Found interesting operations in the following website’s homepage
Simply loading the Facebook homepage, the analysis
detects hundreds of this kind of interesting operations.
Operating uninitialized variable
[object Object].now = end – start;
NaN
“30% 0”

10. Thank you!
Check out our project website
https://www.eecs.berkeley.edu/~gongliang13/jalangi_ff/index.html