13
Daniel Herken [email protected] http://www.browseemall.com How To Automate Cross Browser Testing Automation

How To Automate Cross Browser Testing

Embed Size (px)

Citation preview

Page 1: How To Automate Cross Browser Testing

Daniel [email protected]://www.browseemall.com

How To Automate Cross Browser Testing

Automation

Page 2: How To Automate Cross Browser Testing

Today we will cover

1. When to automate?2. Static page testing3. Dynamic page testing

Introduction

Page 3: How To Automate Cross Browser Testing

Creating these automation tasks takes time and resources so make sure that:

• you need to support a high number of browsers• you need to do regression tests multiple times• you have a suitable test execution environment• you have a clear plan when and how to execute the tests

When to automate?

Automation makes sense if the test need to be repeated often!

Page 4: How To Automate Cross Browser Testing

Define to number of browsers that need testing in advance.

When to automate?

Which browsers need testing?

Page 5: How To Automate Cross Browser Testing

• How to install a Selenium Grid• Install ImageMagick for picture comparison

When to automate?

Requirements:

Page 6: How To Automate Cross Browser Testing

o Develop by using a known-good browsero Use Selenium to take a known-good screenshoto Use Selenium to take screenshots in all other browsers that need testingo Use ImageMagick to compare these screenshots for problemso Manually review the screenshot comparison for real problems

Static Page Testing

How to automate?

Page 7: How To Automate Cross Browser Testing

Static Page Testingpublic static void TestGoogleHomepage() {      // Create a screenshot with a known good browser first      IWebDriver chromeDriver = new RemoteWebDriver(TestParameter.SeleniumHubUrl, DesiredCapabilities.Chrome());      GetPageScreenshot(chromeDriver, Path.Combine(basePath, "chrome.png"));     

// Create screenshots in the other browsers we need to support      IWebDriver firefoxDriver = new RemoteWebDriver(TestParameter.SeleniumHubUrl, DesiredCapabilities.Firefox());      GetPageScreenshot(firefoxDriver, Path.Combine(basePath, "firefox.png"));     

// Create screenshot comparison      ScreenshotHelper.CreateComparison(Path.Combine(basePath, "chrome.png"), Path.Combine(basePath, "firefox.png"), Path.Combine(basePath, "firefox_compare.png")); }

private static void GetPageScreenshot(IWebDriver driver, string screenshotPath) {      // Change to the correct resolution      driver.Manage().Window.Size = new System.Drawing.Size(TestParameter.Width, TestParameter.Height);     

// Open Homepage      driver.Navigate().GoToUrl(TestUrl);     

// Take Screenshot      ScreenshotHelper.TakeScreenshot(driver, screenshotPath);      driver.Quit(); }

Page 8: How To Automate Cross Browser Testing

Static Page Testing

Demo

Page 9: How To Automate Cross Browser Testing

o Develop by using a known-good browsero Use Selenium to automate all user interactiono Take screenshots between each user interaction stepo Use ImageMagick to compare these screenshots for problemso Manually review the screenshot comparison for real problems

Dynamic Page Testing

How to automate?

Page 10: How To Automate Cross Browser Testing

Dynamic Page Testingpublic static void TestGoogleHomepage() {      // Create a screenshot with a known good browser first      IWebDriver chromeDriver = new RemoteWebDriver(TestParameter.SeleniumHubUrl, DesiredCapabilities.Chrome());      GetPageScreenshot(chromeDriver, Path.Combine(basePath, "chrome.png"));     

[…]

// Create screenshot comparison      ScreenshotHelper.CreateComparison(Path.Combine(basePath, "chrome.png"), Path.Combine(basePath, "firefox.png"), Path.Combine(basePath, "firefox_compare.png")); }

private static void GetPageScreenshots(IWebDriver driver, string screenshotPath) {      // Change to the correct resolution      driver.Manage().Window.Size = new System.Drawing.Size(TestParameter.Width, TestParameter.Height);     

// Open Homepage      driver.Navigate().GoToUrl(TestUrl);     

// Take Screenshot      ScreenshotHelper.TakeScreenshot(driver, screenshotPath[0], isFirefox);

// Do more user actions & take more screenshots      driver.Quit(); }

Page 11: How To Automate Cross Browser Testing

Dynamic Page Testing

Demo

Page 12: How To Automate Cross Browser Testing

TakeScreenshot();public static void TakeScreenshot(IWebDriver driver, string path) {      IJavaScriptExecutor jsExecutor = (IJavaScriptExecutor)driver;      ITakesScreenshot takesScreenshot = (ITakesScreenshot)driver;     

// Generate Bitmap      Image finalScreenshot = new Bitmap(TestParameter.Width, TestParameter.Height);     

// Scroll to top      jsExecutor.ExecuteScript("window.scrollTo(0,0);", new object[] { });     

byte[] screenshot = takesScreenshot.GetScreenshot().AsByteArray;     

using (MemoryStream stream = new MemoryStream(screenshot))      {          Bitmap originalScreenshot = (Bitmap)Bitmap.FromStream(stream);          Bitmap parsedScreenshot = ResizeBitmap(originalScreenshot, TestParameter.Width, TestParameter.Height);         

parsedScreenshot.Save(path, ImageFormat.Png);         

parsedScreenshot.Dispose();          originalScreenshot.Dispose();      } }

Page 13: How To Automate Cross Browser Testing

Questions?

Q & A