探討Web ui自動化測試工具

探討Web UI自動化測試工具 Jimmy

Agenda

Why UI TestSeleniumSikuli

Why UI Test

這麼多size 怎麼測

現實生活中的測試方式

程式寫越多

通常Bug 就更多

請善用工具，做適當的測試

後端工程師，可以寫unit test

身為前端工程師，也來了解一下UI的測試可以怎麼測

Selenium

Selenium is

● Browser base Web Application testing tool

● Open Source License● Support Mobile Testing Android

/ IOS● Write Test case using Language

of Java,C#,Python,Ruby..

Selenium

Selenium

● Selenium Core● Selenium IDE● Selenium RC(Remote Control)● Selenium WebDrivers● Selenium Grid

Selenium IDE

Selenium RC

Selenium WebDrivers

Selenium Grid

Selenium IDE

● add-on for Mozilla Firefox● record, edit, and debug tests● recording the Script

Live Demo

Selenium WebDriver• WebDriver is designed in a simpler and more concise programming

interface along with addressing some limitations in the Selenium-RC API.

• WebDriver is a compact Object Oriented API when compared to Selenium1.0

• It drives the browser much more effectively and over comes the limitations of Selenium 1.x which affected our functional test coverage, like the file upload or download, pop-ups and dialogs barrier

• WebDriver overcomes the limitation of Selenium Rc's Single Host origin policy

Web Driver

Selenium WebDriverAndroidDriverChromeDriverEventFiringWebDriverFirefoxDriverHtmlUnitDriverInternetExplorerDriverPhantomJSDriverRemoteWebDriverSafariDriver

Selenium WebDriver supportJava C#PythonRubyPerlJavascript

Selenium WebDriver (以Java為例) @Before

public void setUp() throws Exception {driver = new FirefoxDriver();baseUrl = "http://autotest.localhost.com/";driver.manage().timeouts().implicitlyWait(30, TimeUnit.SECONDS);

}

@Testpublic void testLogin() throws Exception {

driver.get(baseUrl + "/index.php");driver.findElement(By.id("username")).clear();driver.findElement(By.id("username")).sendKeys("jimmy");driver.findElement(By.id("password")).clear();

….略..... }

@After

public void tearDown() throws Exception { driver.quit();

….略.....}

}

Live Demo

Selenium RC Architecture

Selenium RC Architecture

Selenium Client Driver

Selenium RC Setuphttp://seleniumhq.org/download

Extract the ZIP file. Start a Command Prompt or a console window and navigate to where

the ZIP file was extracted.

Run the command java –jar selenium-server-standalone.jar

sikuli

Why is sikuli?

• GUI test• Automate use Script(Python)• can be used to automate Flash Objects/ Flash Websites• Using Sikuli we can automate desktop application

Sikuli IDE

Live Demo

Sikuli API

• GUI test• Automate use Script(Python)• can be used to automate Flash Objects/ Flash Websites• Using Sikuli we can automate desktop application

How sikuli work?

最新版本Bug 注意

Mac 10.10 有 bughttps://bugs.launchpad.net/sikuli/+bug/1362011

修正

http://www.sikulix.com/

Other

其它幾個UI Test

• iMacro 與 sikuli 類以，都是在 firefox 上錄製，再進行測試

• Watir (web application test in ruby)• 使用ruby

• Robot Framework• python base• 可以參考 http://www.tonylin.idv.tw/dokuwiki/doku.php/rf:rf

•

心得

• 好的自動測試可以降低bug的產生，提高程式的品質

• 更熟悉流程的正確性

• 利用夜間排程，進行自動測試

參考資料來源

1. http://www.tonylin.idv.tw/dokuwiki/doku.php/rf:rf2. http://blog.mykhailo.com/