Cross browser testing using BrowserStack
2 likes2,711 views
This document discusses cross browser testing using BrowserStack. BrowserStack allows testing websites across 700+ desktop and mobile browsers without maintaining actual devices. It offers virtualization for different operating systems and browsers. Users can set capabilities like OS, browser, version, and screen resolution. BrowserStack supports automated testing using Selenium and provides screenshots and responsive testing features.
![Cross browser testing using BrowserStack
© RapidValue Solutions 9
@BeforeTest
public void setUp() throws MalformedURLException
{
DesiredCapabilities caps = new DesiredCapabilities();
caps.setCapability("browser", "Firefox");
caps.setCapability("browser_version", "35.0");
caps.setCapability("os", "Windows");
caps.setCapability("os_version", "7");
caps.setCapability("resolution", "1024x768");
caps.setCapability("browserstack.debug", "true");
driver = new RemoteWebDriver(new URL(URL), caps);
driver.navigate().to("http://www.gmail.com");
System.out.println(driver.getTitle());
wait=new WebDriverWait(driver, 10);
}
@Test
public void gudlyWebTest() throws InterruptedException, IOException
{
sendEmail();
}
Public void sendEmail()throws InterruptedException
{
//getting email textbox
WebElement Username= driver.findElement(By.xpath("//input[@id='Email']"));
Username.sendKeys("rvs4test@gmail.com ");
//getting password textbox
WebElement Password= driver.findElement(By.xpath("//input[@id='Passwd']"));
Password.sendKeys("Rapid123");](https://image.slidesharecdn.com/crossbrowsertestingusingbrowserstackbyrapidvaluesolutions-151125054233-lva1-app6892/85/Cross-browser-testing-using-BrowserStack-9-320.jpg)
![Cross browser testing using BrowserStack
© RapidValue Solutions 10
//clicking signin button
WebElement signin= driver.findElement(By.xpath("//input[@id='signIn']"));
signin.click();
System.out.println("your logging in");
//clicking compose button
WebElement compose= driver.findElement(By.xpath("//div[@class='T-I J-J5-Ji T-I-KE L3']"));
compose.click();
System.out.println("Loading Composer");
//entering „to‟ address field
WebElement toAddress= driver.findElement(By.name("to"));
toAddress.sendKeys("sparkqatest@gmail.com");
//entering subject of mail
WebElement subject = driver.findElement(By.name("subjectbox"));
subject.sendKeys("Automated email");
//switch to frame
driver.switchTo().frame(driver.findElement(By.xpath("//iframe[contains(@tabindex,'1') and
contains(@frameborder,'0')]")));
//entering text into email body
driver.findElement(By.xpath("//*[@id=':ak']")).sendKeys("Hi" +"n"+ " Sending an automated mail
");
//switching back from frame
driver.switchTo().defaultContent();
//clicking send button
driver.findElement(By.xpath("//div[text()='Send']")).click();
driver.manage().timeouts().implicitlyWait(100, TimeUnit.SECONDS);
System.out.println("Sending email");
}
}
}](https://image.slidesharecdn.com/crossbrowsertestingusingbrowserstackbyrapidvaluesolutions-151125054233-lva1-app6892/85/Cross-browser-testing-using-BrowserStack-10-320.jpg)
Cross browser testing using BrowserStack
- 1. CROSS BROWSER TESTING USING BROWSERSTACK By: Mary Geethu. C. A Automation Test Engineer, RapidValue Solutions
- 2. Cross browser testing using BrowserStack © RapidValue Solutions 2 Contents Introduction ....................................................................................................................................................................3 How does it work?..........................................................................................................................................................4 BrowserStack Live .........................................................................................................................................................5 BrowserStack Automate.................................................................................................................................................6 Setting your operating system, browser, and screen resolution.....................................................................................7 Run tests on mobile browsers........................................................................................................................................7 Screenshots .................................................................................................................................................................11 Responsive ..................................................................................................................................................................11 Conclusion ...................................................................................................................................................................12
- 3. Cross browser testing using BrowserStack © RapidValue Solutions 3 Introduction BrowserStack is a cross-browser testing tool which allows users to test websites in 700+ desktop and mobile browsers. BrowserStack offers virtualization for: Windows XP, 7 and 8 OSX Snow Leopard, Lion and Mountain Lion iOS Android Opera Mobile Depending on the operating system you choose, BrowserStack offers a number of supported browsers for the specific OS.
- 4. Cross browser testing using BrowserStack © RapidValue Solutions 4 How does it work? Browser stack follows a „pay as service‟ model and the pricing is reasonable. The registered users can sign and will be allowed to access the dashboard, which offers a quick start dialogue. This allows you to, easily, enter the URL, you'd like to test via the dropdowns, the target OS and browser version. You can fine tune things via the left panel which offers screen resolution choices and page rendering speed simulation. Clicking “start” commences the process of establishing the connection, via Flash, to the remote server and rendering the virtualized browser. You have full access to the web page's functionality including menus, buttons, and so on. This also, includes the developer tools that come with browsers. You have access to tools like Firefox Web Developer Tools, the IE F12 Tools and the Chrome Developer Tools.
- 5. Cross browser testing using BrowserStack © RapidValue Solutions 5 So, not only can you see how your pages will render across browsers but you can also, use the existing tools to debug common issues. BrowserStack Live The main area allows you to specify a public address or even use it to test internal applications on your network. The dropdown menus on the upper left of the page allows you to choose the operating system and browser. The dropdown menus on the upper left of the page allow you to choose the operating system and browser.
- 6. Cross browser testing using BrowserStack © RapidValue Solutions 6 BrowserStack Automate BrowserStack Automate provides a platform to run automated browser tests using, either, the Selenium or JavaScript testing framework. Tests can be customized, using capabilities, which are a series of key- value pairs used to pass values to the tests. Selenium has a set of default capabilities, whereas BrowserStack has created specific capabilities to increase the customization available to users. BrowserStack supports various languages like Python, Ruby, Java, Perl, C# and Node js. Automate test scripts in Java: Running your Selenium tests on BrowserStack requires a username and an access key. To obtain your username and access keys, sign up for a „free trial‟ or „purchase‟ a plan. BrowserStack supports Selenium automated tests, and running your tests on our cloud setup is simple and straightforward. //Download java driver bindings from http://www.seleniumhq.org/download/ Configuring Capabilities To run on BrowserStack, the Selenium capabilities have to be changed. In this example, the browser is Firefox. WebDriver driver = new RemoteWebDriver(
- 7. Cross browser testing using BrowserStack © RapidValue Solutions 7 new URL("http://USERNAME:[email protected]/wd/hub"), DesiredCapabilities.firefox() ); Setting your operating system, browser, and screen resolution You can run your Selenium test scripts on any browser by specifying the browser name, version and resolution in the input capabilities. Parameter override rules: When specifying both default and BrowserStack-specific capabilities, the following rules define any overrides that take place: If browser and browserName, both, are defined, browser has precedence (except if browserName is Android, iPhone, or iPad, in which cases browser is ignored and the default browser on those devices is selected). If browser_version and version, both, are defined, browser_version has precedence. If OS and platform, both, are defined, OS has precedence. Platform and os_version cannot be defined together, if os has not been defined os_version can, only, be defined when OS has been defined. The value ANY, if given to any parameter, is same, as the parameter preference is not specified. Default browser is chrome, when no browser is passed by the user or the selenium API (implicitly). The following example has Firefox selected as browser, 35.0 as browser version and 1024x768 as resolution. caps.setCapability("browser", "Firefox"); caps.setCapability("browser_version", "35.0"); caps.setCapability("os", "Windows"); caps.setCapability("os_version", "7"); caps.setCapability("resolution", "1024x768"); Run tests on mobile browsers You can run your Selenium test scripts on iOS and Android devices by specifying the version and device in the input capabilities. These capabilities are browserName and device. The following example has iPhone selected as the browserName, and iPhone 5 as the device. DesiredCapabilities caps = new DesiredCapabilities(); caps.setCapability("browserName", "iPhone");
- 8. Cross browser testing using BrowserStack © RapidValue Solutions 8 caps.setPlatform(Platform.MAC); caps.setCapability("device", "iPhone 5"); Example: Sending an Email with Gmail package com.rvs.automation; import java.io.File; import java.io.IOException; import java.net.MalformedURLException; import java.net.URL; import java.util.List; import org.apache.commons.io.FileUtils; import org.openqa.selenium.By; import org.openqa.selenium.OutputType; import org.openqa.selenium.WebElement; import org.openqa.selenium.chrome.ChromeDriver; import org.openqa.selenium.remote.DesiredCapabilities; import org.openqa.selenium.remote.RemoteWebDriver; import org.openqa.selenium.support.ui.ExpectedConditions; import org.openqa.selenium.support.ui.WebDriverWait; import org.testng.annotations.AfterTest; import org.testng.annotations.BeforeTest; import org.testng.annotations.Test; public class SendMail{ WebDriverWait wait; RemoteWebDriver driver; public static final String USERNAME = "geethuca2"; public static final String AUTOMATE_KEY = "9Cqqo4xnu497CS3YTUXE"; public static final String URL = "http://" + USERNAME + ":" + AUTOMATE_KEY + "@hub.browserstack.com/wd/hub";
- 9. Cross browser testing using BrowserStack © RapidValue Solutions 9 @BeforeTest public void setUp() throws MalformedURLException { DesiredCapabilities caps = new DesiredCapabilities(); caps.setCapability("browser", "Firefox"); caps.setCapability("browser_version", "35.0"); caps.setCapability("os", "Windows"); caps.setCapability("os_version", "7"); caps.setCapability("resolution", "1024x768"); caps.setCapability("browserstack.debug", "true"); driver = new RemoteWebDriver(new URL(URL), caps); driver.navigate().to("http://www.gmail.com"); System.out.println(driver.getTitle()); wait=new WebDriverWait(driver, 10); } @Test public void gudlyWebTest() throws InterruptedException, IOException { sendEmail(); } Public void sendEmail()throws InterruptedException { //getting email textbox WebElement Username= driver.findElement(By.xpath("//input[@id='Email']")); Username.sendKeys("[email protected] "); //getting password textbox WebElement Password= driver.findElement(By.xpath("//input[@id='Passwd']")); Password.sendKeys("Rapid123");
- 10. Cross browser testing using BrowserStack © RapidValue Solutions 10 //clicking signin button WebElement signin= driver.findElement(By.xpath("//input[@id='signIn']")); signin.click(); System.out.println("your logging in"); //clicking compose button WebElement compose= driver.findElement(By.xpath("//div[@class='T-I J-J5-Ji T-I-KE L3']")); compose.click(); System.out.println("Loading Composer"); //entering „to‟ address field WebElement toAddress= driver.findElement(By.name("to")); toAddress.sendKeys("[email protected]"); //entering subject of mail WebElement subject = driver.findElement(By.name("subjectbox")); subject.sendKeys("Automated email"); //switch to frame driver.switchTo().frame(driver.findElement(By.xpath("//iframe[contains(@tabindex,'1') and contains(@frameborder,'0')]"))); //entering text into email body driver.findElement(By.xpath("//*[@id=':ak']")).sendKeys("Hi" +"n"+ " Sending an automated mail "); //switching back from frame driver.switchTo().defaultContent(); //clicking send button driver.findElement(By.xpath("//div[text()='Send']")).click(); driver.manage().timeouts().implicitlyWait(100, TimeUnit.SECONDS); System.out.println("Sending email"); } } }
- 11. Cross browser testing using BrowserStack © RapidValue Solutions 11 @AfterTest public void terminatetest() { driver.quit(); } } Screenshots Screenshots are used to conduct rapid layout testing of websites. It can instantly generate screenshots of a website across a range of 650+ browsers, by selecting 25 browsers at a time. The screenshots can, then, be downloaded for comparison and future reference. BrowserStack also provides API access for headless creation of screenshots over a selection of operating systems and browsers. Screenshots has two third-party tools: ScreenShooter and Python API wrapper. Responsive Responsive is a feature used to test the responsiveness of website layouts and designs. Responsive comes bundled with screenshots, and it operates in a similar way. It can generate screenshots over a range of screen sizes, where the screen sizes are true to the devices, and have the actual resolutions and viewports set. BrowserStack provides the following devices in Responsive: Device Resolution Size Viewport iPhone 5S 640x1136 4 320x568 Galaxy S5 Mini 720x1280 4.5 360x640 Galaxy S5 1080x1920 5.1 360x640 Note 3 1080x1920 5.7 360x640 iPhone 6 750x1334 4.7 375x667 Nexus 4 738x1280 4.7 384x640 iPhone 6 Plus 1080x1920 5.5 414x736 Kindle Fire HDX 7 1200x1920 7 600x960 iPad Mini 2 1536 x 2048 7.9 768 x 1024 iPad Air 1536x2048 9.7 768 x 1024 Galaxy Tab 2 800x1280 10.1 800x1280 Windows 7 1280x1024 N/A 1280x1024 OS X Yosemite 1920x1080 N/A 1920x1080
- 12. Cross browser testing using BrowserStack © RapidValue Solutions 12 Conclusion You can create URLs with the testing options as parameters. This helps you to, instantly, start a browser on BrowserStack. You can integrate these URLs into your application, bookmark them and also, share them with others. Local testing allows you to test your private and internal servers, along with public URLs, using the BrowserStack Cloud. The BrowserStack Cloud has support for firewalls, proxies and Active Directory.
- 13. Cross browser testing using BrowserStack © RapidValue Solutions 13 About US RapidValue is a leading provider of end-to-end mobility, omnichannel and cloud solutions to enterprises worldwide. Armed with a large team of experts in consulting and application development, along with experience delivering global projects, we offer a range of mobility and cloud services across industry verticals. RapidValue delivers its services to the world‟s top brands and Fortune 1000 companies, and has offices in the United States and India. Disclaimer: This document contains information that is confidential and proprietary to RapidValue Solutions Inc. No part of it may be used, circulated, quoted, or reproduced for distribution outside RapidValue. If you are not the intended recipient of this report, you are hereby notified that the use, circulation, quoting, or reproducing of this report is strictly prohibited and may be unlawful. © RapidValue Solutions www.rapidvaluesolutions.com/blogwww.rapidvaluesolutions.com +1 877.643.1850 [email protected]