All About Automated Browser Compatibility Testing Ashwini Phalle, Sandeep Naik Fiserv India Pvt Ltd. STC 2012
Agenda Introduction to Browser Compatibility Testing Need of Test Automation Available solutions and Challenges Our Approach: Browser Compatibility Test Framework Benefits of BCTF Scope for enhancements 2
Introduction to Browser Compatibility Testing 3
The Web Application Story 4
How Web Application Works Web Application Developer Internet Client Side Compon nent Rendering 5
Which all browsers we should Test applications For Current market share for most popular Browsers and OS Top 5 browsers from Jan 2009 to Aug 2012 6
What To Test for Browser Compatibility Sr No Test Case Effect on Various browsers 1 Font size and font style 2 Controls alignment May change with browsers Bullets, radio buttons and checkboxes might not be correctly aligned on different browsers 3 HTML5 video format All browsers may not support all types of video formats. 4 Text alignment Some dropdown items will look good in Internet Explorer while in Safari they might appear too close to the upper margin 5 Plug-in developed by external sites jquery plug-in and ActiveX control might not work correctly 6 Java Scripts Java script interpreter varies from browser to browser 7 CSS styles CSS has moved to CSS 3, reporting major compatibility challenges 8 Session and Cookies How session and cookies are maintained across pages 7
Test Automation for Browser Compatibility 8
Need of Test Automation Testing efforts will be huge if all combinations of Browser and OS are tested Huge Efforts Complex Scope Definition Defining a scope with reduced number of Browser and OS combinations is Risk prone Control measurements, Colors, Fonts can not be tested accurately Accuracy Test Automation for Browser Compatibility Testing 9
Solution Available and Challenges Available Tools Challenges Browsers hots Sort site pro Security Risk Cloud Based Solutions Litmus iecapture BrowserP hoto BrowsrCam p IE NetRender er Manual Efforts Manual efforts for UI comparison and Application Navigation Browsersh ots CrossBro wsertesti ng Not Customizable Can not define customized UI standards 10
The image cannot be displayed. Your computer may not have enough memory to open the image, or the image may have been corrupted. Restart your computer, and then open the file again. If the red x still appears, you may have to delete the image and then insert it again. Our Approach 11
The image cannot be displayed. Your computer may not have enough memory to open the image, or the image may have been corrupted. Restart your computer, and then open the file again. If the red x still appears, you may have to delete the image and then insert it again. How Browser Compatibility Test Framework Works 12
BCTF Technical Architecture Web Browser AUT Selenium Server Selenium Core Classes Input File 1. Application Navigation script: Selenium 2. Configuration File: Excel ANT Java Classes Browser Compatibility Test Framework Classes Output Files Test Execution Reports : HTML TestNG Parallel Execution Java API 13
BCTF Features-Java Script Validation Java Script Validation Separate Script for JS validation Selenium scripts for test workflows involving Java scripts Following types covered Validation Type Field Validation Controls Popup Window Description Client side JavaScript validations like mandatory fields, Integer or string etc Controls developed with JavaScript like grid control or list control Confirmation Window or message box JavaScript events Events like onclick, mouseover etc. 14
The image cannot be displayed. Your computer may not have enough memory to open the image, or the image may have been corrupted. Restart your computer, and then open the file again. If the red x still appears, you may have to delete the image and then insert it again. BCTF Features cntd Testing Configurations: Project specific configurations for browser compatibility testing as Base and Target browsers Test Cases in the scope Acceptable deviation limits Parallel Execution: Parallel execution of the test scripts on multiple browsers with Selenium Grid 15
The image cannot be displayed. Your computer may not have enough memory to open the image, or the image may have been corrupted. Restart your computer, and then open the file again. If the red x still appears, you may have to delete the image and then insert it again. BCTF Features cntd Detailed Test Execution Reports: Detailed execution reports with control details on each page, comparison with base browser along with screen prints 16
BCTF Features cntd Support for wide range of application platforms: BCTF can be used for testing on all the browsers supported by Selenium Browsers: IE, Firefox, Safari, Chrome OS: Windows, Mac, Android Can be deployed as reusable component: BCTF components can be added to automated application Navigation flow 17
The image cannot be displayed. Your computer may not have enough memory to open the image, or the image may have been corrupted. Restart your computer, and then open the file again. If the red x still appears, you may have to delete the image and then insert it again. Approach Benefits 18
Benefits of BCTF Accurate Results Pixel by Pixel comparison of control positions for each screen Optimal Test Coverage Reduced Manual Testing Efforts Time saving With BCTF, applications can be tested on most of Browsers and OS combinations with available testing window Complete process of application navigation, comparison with base browser along with screen shots is automated Parallel execution on multiple test environments No Investment in Tool Cost Application independent framework Highly Customizable Based on open source tool Can be used for any Web Application Application specific navigation flows can be added Acceptable deviation limits can be configured 20
Scope for Enhancements BCTF can be enhanced for the support the following ActiveX control, Ajax controls or Silverlight controls Video or Audio files Zoom in, Zoom out functionality Browsers not supported by Selenium 21
References http://www.tablefy.com/compare/2656/test-your-browser-across- Different-Browsers,-OS,-and-Screen-Resolutions http://www.w3schools.com/browsers/browsers_stats.asp http://gs.statcounter.com/ 22
The image cannot be displayed. Your computer may not have enough memory to open the image, or the image may have been corrupted. Restart your computer, and then open the file again. If the red x still appears, you may have to delete the image and then insert it again. Questions?
Thank You Ashwini Phalle, Sandeep Naik Fiserv India Pvt Ltd. STC 2012