As reported by Storey in her review on program comprehension theories, tools and methods [114], tools for program comprehension usually include three categories of features: extraction, analysis and presentation. Extraction tools include parsers and data gathering tools to collect both static and dynamic data. Analysis tools support activities such as clustering, concept assignment, feature identification, slicing, or similar ones.
Presentation tools include code editors, browsers, hypertext viewers, and visualizations.
The set of features included in software comprehension and reverse engineering environments usually depends on the purposes of these tools, which may vary from aiding top-down or bottom-up comprehension processes, to supporting reverse engineering, maintenance, or testing activities.
Table 7.1: Ajax Analysis Features offered by the considered tools
Firebug Ajax Toolkit Framework Venkman DynaTrace Selenium DynaRIA
JS debugging Y Y Y N N P
DOM change inspecting Y Y N N N Y
Network Monitor Y Y N Y N Y
User Session Tracing N N N Y Y Y
User Session Replaying N N N N Y Y
Performance Analysis Y N P Y N P
Code Coverage N N N N N Y
UML diagrams abstraction N N N N N Y
123
The DynaRIA tool has the purpose of supporting comprehension, quality assessment and testing activities involving the client-side of Ajax applications. The tool‘s features and its architecture are described in the following sub-section.
7.3.1 DynaRIA’s program comprehension features
The DynaRIA tool provides the following extraction, analysis and visualization features.
As to the extraction, it gathers dynamic data from the run time behaviour of an Ajax application. To this aim, the tool provides an integrated Web browser where a user can interact with a Web application while all relevant data about this user session are captured and stored. Collected data include: the sequence of user events fired on DOM objects of the user interface, the JavaScript functions that are activated by user event handlers, the executed lines of code of JS functions, exceptions and errors occurred at run time. At the same time, the tool keep tracks of the changes (such as add, delete, or change) on DOM objects resulting from a given event management, analyses the network traffic, and monitors message exchanges between client and server.
The class diagram in Figure 7.1 shows the conceptual model of collected data.
The tool provides some session analysis functions that have been designed to support code artifact discovery, or to display relevant attributes of the retrieved items. As an example the tool analyses the run-time behaviour and provides the sequence of events that were
Figure 7.1: The Conceptual Model of collected data
User Session
124
fired, the associated JS function call-tree, the set and number of executed JS functions (distinguishing among application‘s functions, functions from development frameworks, and dynamically generated ones), the set of server requests made by a JS function and server callbacks, the set of DOM changes it made and summary data and metrics about JS function executions (such as minimum, maximum, and average execution time, # of server requests it made, percentage of executed lines of code, etc). Moreover, the tool is able to abstract an Event-flow-graph [47] that reports the flow of events fired along a user session and UML sequence diagrams at various levels of detail and abstraction from each user session or from its parts. The high-level sequence diagrams show the observed interactions among three layers of the application, e.g., the browser, the Ajax engine, and the server side. The low-level sequence diagrams report the observed interactions between the Web browser, the single JavaScript modules making up the Ajax engine, and the server side.
The DynaRIA tool provides functions for exporting the abstracted diagram in XML format.
Finally, the tool provides several features of software visualization. Multiple views are offered both at the session level and at the JS function level, and cross-referencing functions are provided for switching between views. At the session level, the tool provides both UML sequence diagram visualizations and Event-flow-graph visualizations. At the JS function level, views reporting details about JS function code, JS executed lines of code, JS call tree, DOM changes, network traffic and exceptions are provided. A view on the DOM before and after the management of a given event is also offered by the tool. In next sections some examples of these views and of the cross-reference mechanisms are reported.
7.3.2 DynaRIA’s Testing features
As to the testing activity support, the DynaRIA tool provides functionalities for recording user sessions and replaying them automatically. Capture and Replay tools, such as the Selenium IDE, or similar ones, already provide this type of functionality; however the DynaRIA tool offers additional features for test suite error detection and coverage
125
evaluation. Indeed, during user session replay, the tool traces the JS code execution, keeps track of performed network traffic and detects any JS error or network warning occurred at run-time.
Moreover, with respect to a replayed user session, the tool computes several code coverage metrics such as the percentage of executed JS functions with respect to the defined JS functions and the percentage of executed JS function LOC with respect to the defined JS function LOC. These coverage metrics can be used for evaluating the effectiveness of test suites obtained from user sessions.
7.3.3 DynaRIA’s quality assessment features
The dynamic analysis performed by the DynaRIA tool provides insights into the internals of an Ajax application that can be used for expressing a judgment about the application‘s internal quality too. As an example, the DynaRIA tool is able to compute some complexity and coupling metrics about the JS code that is contained either in HTML pages or in js files of the application (hereafter, JS modules).
These metrics are all computed by the tool based on the data that are retrieved with respect to a given set of executions of the application. The complexity metrics include:
# JavaScript modules making up the Ajax engine;
JavaScript module size (in LOC);
JavaScript module size (in # JS function);
JavaScript function size (in LOC).
As to the coupling between modules, the following metrics can be evaluated:
Fan-in of a JS module (that is the number of distinct calls to JS functions of the subject module);
Fan-out of a JS module (that is the number of distinct calls to external JS functions made by functions of the subject module);
Call Coupling between JS modules (that is given by the number of distinct calls to JS functions made by functions of the first module to the second module functions);
126
Server Coupling of a module (that is given by the number of distinct HTTP requests to the server that are made by a given module);
DOM coupling (that is the number of distinct DOM change instructions that are executed by a given JS module).
These metrics can be used for assessing several quality aspects of the RIA, such as its maintainability or testability. As an example, in a maintenance process the complexity metrics can be used to detect the modules whose changes potentially require greater effort (due to their size or coupling to other modules of the application). Analogously, in a testing process, the Server Coupling metric may be exploited for counting the number of different server stubs that at least must be developed for the unit testing of that module;
hence it provides a testability indicator for that module.
7.3.4 The architecture of the DynaRIA tool
The DynaRIA tool has been developed using Java technologies. The architecture of the tool includes six main packages and eighteen sub-packages that are illustrated by the UML package diagram reported in Figure 7.2.
Figure 7.2 The DynaRIA tool Architecture
In particular, the DynaRIA GUI package implements the graphical user interface of the tool and has been developed using the Java SWT libraries [64]. It offers an embedded Mozilla Web Browser, a ‗Session Manager‘ GUI for recording user sessions and analysing or replaying them, and a ‗Session Monitor‘ window providing views on session‘s events, executed JavaScript code, DOM changes, Client-Server communication details, etc..
dynaRIA
127
The DynaRIA Observer package is responsible for capturing all run-time data such as user events triggered on the interface, the JavaScript code loaded and executed at runtime, DOM changes, and the Client-Server message exchanges. This package has been developed using the APIs of the JavaXPCOM library [66].
The DynaRIA Engine package is the core component of the tool that implements all the business logic of the application and coordinates the execution of all the other tool‘s packages.
The DynaRIA Abstractor package is responsible for performing the abstraction functions regarding the Web application run-time. The output of these functions is stored in XML files (representing the sequence diagrams), DOT files (providing the EFG graphs in the dotty software format [74]) and text files reporting summary data about the overall Web application execution. Figure 7.2 also reports the DynaRIA Sequence Diagram Viewer tool that is responsible for visualizing the sequence diagrams produced by DynaRIA. This tool has been developed in Visual Basic .NET 2008, and using the Windows Presentation Foundation (WPF) library.