igor gershovich connected testing, inc
Post on 19-Dec-2015
219 views
TRANSCRIPT
Automating Web 2.0 Rich Internet Applications (RIA).
GWT – New Kid on the Block.
Igor GershovichConnected Testing, Inc.www.connectedtesting.com
Often feature a rich, user-friendly interface based Rich Internet Application (RIA) technologies such as Ajax, Flex, Silverlight.
Are Web Applications with some features of desktop applications
Communicate with server applications, and use a plug-in or browser technologies in addition to or instead of HTML and CSS.
Web 2.0 applications:
Adobe Flash/Flex Google Web Toolkit (GWT) Microsoft Silverlight dojo Curl jQuery And 200 or 300 others
RIA Frameworks/Toolkits
Most of Rich Internet are based on AJAX (Asynchronous JavaScript + XML) technology
Microsoft Silverlight and Adobe Flex have proprietary runtime technologies
RIA technologies
RIA Youtube.com relies on Adobe Flash for Video playback
AJAX is a technique that combines and exploits some long-standing Web technologies:◦ Using XHTML and Cascading Style Sheets (CSS) for
structure and presentation. ◦ Displaying and manipulating pages using the
Document Object Model (DOM). ◦ Using the browser's XMLHttpRequest object to
transfer data between the client and the server. ◦ Using XML as the format for the data flowing
between the client and the server. ◦ Using JavaScript to dynamically display and interact
with all of the above.
What is AJAX?
AJAX allows the server to update the current Web page as opposed to sending a new page
The single page interface increases user interactivity
Advantages of AJAX
Some search engines are not equipped for AJAX-based applications
Can be too much context on one page Bookmarks, Browser’s Back or Forward
navigation may not function as expected
Disadvantages of AJAX
Simple AJAX application
Clicking on Adelie
Information From Server
This is what happened behind the screen after clicking on link
Internet
ServerClient
4. Client processes XML Docusing JScript and updates Web page
3. Server sends HTTP Response With XML Data
1. Client creates XmlHttpRequestobject using JScript then sendsHTTP request
2. Server processes theHTTP request
Google Web Toolkit (GWT) is a framework for Java Developers to develop AJAX Web Applications
There are numerous widget libraries available for GWT
What is GWT?
The developer uses Google Web Toolkit (GWT) to write AJAX front-end in the Java programming language
When it is ready to deploy, GWT compiles Java source code into optimized, standalone JavaScript files.
How GWT works in a nutshell
GWT Application example
Custom or 3rd party Web controls No unique object properties Synchronization for AJAX Cascading Style Sheets (CSS) No common design framework between
GWT applications Can’t view HTML using View Source
Challenges
It is a Microsoft add-on for IE6 and IE7 that aimed to aid in design and debugging of web pages. It is included in IE8.
It allows to view DOM and CSS structures Firebug is a similar tool for Firefox
IE Developer toolbar
IE6/IE7 Developer Tools
Automated tools “see” all the objects in CSS-based applications, even if objects are hidden
CSS uses “display” property to hide parts of HTML page
To verify if object or part of HTML page is visible use “Style.display” and “CurrentStyle.display” propertiesCurrentStyle.Display = “block” ‘visible
CurrentStyle.Display = “none” ‘not visible
CSS considerations
By default GWT doesn’t generate the useful web object properties, like “html id” or “name” for object recognition mechanism of GUI test tools
It is highly recommended to work with development team to get a unique static value assigned to web objects
Object properties
Combobox is a collection of objects
<DIV> - WebElements (children)
<IMG> - Image
<INPUT> - WebEdit
<DIV> - WebElement (parent)
Custom controls: Grids, Comboboxes, Trees…
Tree
Grid
Browser’s Status Bar isn’t relevant for GWT applications since page is not getting reloaded
Verify that Object existIf .WeEdit(“”).Exist(seconds) …
Page sync – count number of objects on the page and verify that count doesn’t changed several times in a row
Use AJAX “Please Wait” Wheel object or similar objects
Dynamic Object contents – sync on object propertiesBrowser("").WebList("").WaitProperty,"items count", micGreaterThanOrEqual(5)
More on this topic (QTP info):http://relevantcodes.com/qtp-synchronization-for-ajax-applications/http://www.vidbob.com/qtp/ajax-and-javascript-toolkits.html
Synchronization for AJAX objects
EXT GWT(GXT) controls
Automating GWT-based applications
with HP QTP
Bonus Information
What people really want to ask:
Does QTP work with custom objects from
various JavaScript toolkits?
Does QTP support AJAX?
There are 2 ways to work with custom objects:◦ QTP Web-Extensibility add-in. It enables you to
develop custom support for third-party and custom Web controls that are not supported out-of-the-box
◦ Traditional approach – coding (Functions/Classes)
Working with Custom objects
To manipulate these objects we need to define custom methods and properties
Here are excellent articles on this topic:◦ AJAX and JavaScript tools – Web Extensibility
and Traditional approach examples for custom grids - www.vidbob.com
◦ “Web Extensibility Lesson – Building a toolkit Support” for combobox at www.advancedqtp.com
Custom controls: Grids, Combo-boxes, Trees…
Panels/Dialog boxes - no Web Extensibility
Dialog box Included in Object Hierarchy. ObjectRepository/Descriptive Programming approach
Dialog box excluded from Object Hierarchy
Dialog box Included in Object Hierarchy. ObjectRepository only approach. Btn_Tags object movedManually under Dialog box in OR hierarchy
HP QTP Web Extensibility
• “Out of the box” support for the most common Web 2.0 technologies, including: -Silverlight 3.0 - Ajax toolkits:-ASP.NET AJAX (from Microsoft) -GWT (from Google)-YUI (from Yahoo) -Dojo (open source) •New Extensibility Accelerator (EA) for Functional Testing to provide fast and easy FT add-in extensibility
Panels/Dialog boxes with Web Extensibility
It is very advanced – you need to know JavaScript and XML
Troubleshooting is difficult Distribution/Redistribution challenges –
Custom Add-in needs to be install/reinstall on each test box
Time Consuming
Problems with Web Extensibility add-in
10.0 Extensibility Accelerator
Setting.WebPackage("ReplayType")◦ 1 - Runs mouse operations using browser events. ◦ 2 - Runs mouse operations using the mouse.
Example enabling “Save” button:Setting.WebPackage("ReplayType") = 2‘ next line will enable “Save” button.WebList("class:=gwt-ListBox").Select “First”Setting.WebPackage("ReplayType") = 1If .WebButton("Save").GetRoProperty(“disabled”) Then….Another use of this technique – getting Tooltips from GWT
objects
Changing QTP Web ReplayType from Event to Keyboard/Mouse
Test Automation for Web 2.0 RIA applications is more challenging than automating traditional Web applications
Cooperation with development team is essential for automation success
RIA applications aren’t look alike because of variety of widget sets can be used for development
Advanced test automation expertise is required
Conclusions
Rich Seeley - “How to sort out Ajax and RIA frameworks”
Paul Tuohy - “What Is AJAX?” www.ajaxwith.com Wikipedia www.qaforums.com www.advancedqtp.com www.vidbob.com http
://download.instantiations.com/D2WBDoc/continuous/latest/docs/html/features/gwt/gxt.htm
Resources
Company: Connected Testing, Inc.E-Mail: [email protected]: 720-933-9395Website: www.connectedtesting.com
Igor Gershovich