読者です 読者をやめる 読者になる 読者になる

yfj2’s Automatic Web Test Related Blog

yfj2のWEBテスト自動化に関わるブログ

【入門】Geb+SpockではじめるWebテスト / [Introduction] Let's start Web Browser Automation Testing using Geb, Spock and Groovy

【入門】Geb+SpockではじめるWeb自動テスト / [Introduction] Let's start Web Browser Automation Testing using Geb, Spock and Groovy

著者:ふじさわゆうき
Author: Yuki Fujisawa

更新日:2015/10/25
Updated date:2015/10/25

Mac版はこちら(2016/11/13 作成)

super-apparel-engineer.hatenablog.com

目次 / Table of contents

  1. Gebとは / What's Geb ?
  2. Gebのメリット / Why we have to use Geb ?
  3. 開発環境構築(Groovy Mars) / Development Environment Building (Groovy Mars)
  4. サンプルプログラム実装(Geb+Spock+Maven) / Sample program implementation (Geb + Spock + Maven)
  5. クロスブラウザテストの設定と実行 / Setting up and running of the cross-browser test
  6. テスト失敗時のスクリーンショット出力 / How to output screen-shot of test failure? (2014/11/09 update)
  7. Mavenコマンドによるテスト実行 / How to run test by Maven command?(2014/11/29 update)
  8. "GitHub + Jenkins"によるWEBテストの自動化 / Automation of WEB tests by use to the "GitHub + Jenkins"(2014/11/30 update)
  9. GebとSpockによるWebテストTips集 / Web test Tips collection about Geb and Spock(2015/01/25 update)

1. Gebとは / What's Geb ?

  • Groovy言語で書かれたWebテスト自動化フレームワーク / Web test automation framework written in Groovy language
  • SeleniumWebDriverで挙がっている問題(例えば、ログインボタンを押すだけでもおおくの記述が必要など)を解決している / Geb solved Selenium Web Driver problems , for example we need only even many description press the login button

2. Gebのメリット / Why we have to use Geb ?

3. 開発環境構築(Eclipse Mars) / Development Environment Building (Eclipse Mars)

Java JDK 8のインストール / Installation of Java JDK 8

  1. Download jdk-8u60-windows-x64.exe(2015/10/25 time)
  2. Install
    • C:\Program Files\Java\jdk1.8.0_66
  3. Environment variable settings
    • New Variable
      • JAVA_HOME : C:\Program Files\Java\jdk1.8.0_66
    • Path
      • %JAVA_HOME%
    • f:id:yfj2:20150906125450p:plain
    • f:id:yfj2:20150906125455p:plain

Eclipseのインストール / Installation of Eclipse

  1. 下記、URLから"Eclipse Mars for Java and DSL Developers Windows 64-bit版"をダウンロード / First You download the "Eclipse Mars for Java and DSL Developers Windows 64-bit version" from URL.

Eclipseのメモリ設定 / Memory setting of Eclipse

  • eclipse-dsl-mars\eclipse.ini
  • Xms256m -> Xms512m
  • Xmx1024m -> Xmx2048m
-startup
plugins/org.eclipse.equinox.launcher_1.3.100.v20150511-1540.jar
--launcher.library
plugins/org.eclipse.equinox.launcher.win32.win32.x86_64_1.1.300.v20150602-1417
-product
org.eclipse.epp.package.dsl.product
--launcher.defaultAction
openFile
--launcher.XXMaxPermSize
256M
-showsplash
org.eclipse.platform
--launcher.XXMaxPermSize
256m
--launcher.defaultAction
openFile
--launcher.appendVmargs
-vmargs
-Dosgi.requiredJavaVersion=1.7
-Xms512m
-Xmx2048m

Eclipse起動 / Start Eclipse

  1. eclipse.exeを実行する / You run eclipse.exe
    • eclipse-dsl-mars\eclipse.exe
  2. Select of workspace
    • (ex)C:\gebworkspace

Groovy Pluginのインストール / Installation of Groovy Plugin

  1. Help > Install New Software... > Add...

Java JDK 8の設定 / Setting of Java JDK 8

  1. f:id:yfj2:20150906130849p:plain
  2. f:id:yfj2:20150906130827p:plain
  3. f:id:yfj2:20150906131100p:plain

4. サンプルプログラム実装(Geb+Spock+Maven) / Sample program implementation (Geb + Spock + Maven)

GoogleWikipediaTest Projectの新規作成とMavenの設定 / GoogleWikipediaTest Project New Create and setting of Maven

  1. File > new > other... > Maven > Maven Project
    • f:id:yfj2:20150906122408p:plain
    • f:id:yfj2:20150906122419p:plain
    • f:id:yfj2:20150906122425p:plain
  2. pom.xmlの編集 / setting of pom.xml
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
	<modelVersion>4.0.0</modelVersion>
	<groupId>mygroup</groupId>
	<artifactId>GoogleWikipediaTest</artifactId>
	<version>0.0.1-SNAPSHOT</version>
	<name>GoogleWikipediaTest</name>
	<dependencies>
		<dependency>
			<groupId>org.codehaus.groovy</groupId>
			<artifactId>groovy-all</artifactId>
			<version>2.4.3</version>
		</dependency>
		<dependency>
			<groupId>org.spockframework</groupId>
			<artifactId>spock-core</artifactId>
			<version>1.0-groovy-2.4</version>
		</dependency>
		<dependency>
			<groupId>org.gebish</groupId>
			<artifactId>geb-spock</artifactId>
			<version>0.12.2</version>
		</dependency>
		<dependency>
			<groupId>org.seleniumhq.selenium</groupId>
			<artifactId>selenium-firefox-driver</artifactId>
			<version>2.48.2</version>
		</dependency>
		<dependency>
			<groupId>org.seleniumhq.selenium</groupId>
			<artifactId>selenium-support</artifactId>
			<version>2.48.2</version>
		</dependency>
		<dependency>
			<groupId>org.seleniumhq.selenium</groupId>
			<artifactId>selenium-chrome-driver</artifactId>
			<version>2.48.2</version>
		</dependency>
		<dependency>
			<groupId>org.seleniumhq.selenium</groupId>
			<artifactId>selenium-ie-driver</artifactId>
			<version>2.48.2</version>
		</dependency>

	</dependencies>
	<build>
		<plugins>
			<plugin>
				<groupId>org.apache.maven.plugins</groupId>
				<artifactId>maven-surefire-plugin</artifactId>
				<version>2.18</version>
				<configuration>
					<includes>
						<include>**/*Test.class</include>
						<include>**/*Spec.class</include>
					</includes>
				</configuration>
			</plugin>
			<plugin>
				<artifactId>maven-compiler-plugin</artifactId>
				<configuration>
					<encoding>UTF-8</encoding>
					<source>1.8</source>
					<target>1.8</target>
				</configuration>
			</plugin>
			<plugin>
				<groupId>org.codehaus.gmavenplus</groupId>
				<artifactId>gmavenplus-plugin</artifactId>
				<version>1.5</version>
				<executions>
					<execution>
						<goals>
							<goal>addSources</goal>
							<goal>addTestSources</goal>
							<goal>generateStubs</goal>
							<goal>compile</goal>
							<goal>testGenerateStubs</goal>
							<goal>testCompile</goal>
							<goal>removeStubs</goal>
							<goal>removeTestStubs</goal>
						</goals>
						<configuration>
							<providerSelection>1.8</providerSelection>
							<sourceEncoding>UTF-8</sourceEncoding>
						</configuration>
					</execution>
				</executions>
				<dependencies>
					<dependency>
						<groupId>org.codehaus.groovy</groupId>
						<artifactId>groovy-all</artifactId>
						<version>2.4.3</version>
					</dependency>
				</dependencies>
			</plugin>
		</plugins>
		<pluginManagement>
			<plugins>
				<!--This plugin's configuration is used to store Eclipse m2e settings 
					only. It has no influence on the Maven build itself. -->
				<plugin>
					<groupId>org.eclipse.m2e</groupId>
					<artifactId>lifecycle-mapping</artifactId>
					<version>1.0.0</version>
					<configuration>
						<lifecycleMappingMetadata>
							<pluginExecutions>
								<pluginExecution>
									<pluginExecutionFilter>
										<groupId>org.codehaus.gmavenplus</groupId>
										<artifactId>gmavenplus-plugin</artifactId>
										<versionRange>
											[1.5,)
										</versionRange>
										<goals>
											<goal>addSources</goal>
											<goal>addTestSources</goal>
											<goal>generateStubs</goal>
											<goal>compile</goal>
											<goal>testGenerateStubs</goal>
											<goal>testCompile</goal>
											<goal>removeStubs</goal>
											<goal>removeTestStubs</goal>
										</goals>
									</pluginExecutionFilter>
									<action>
										<ignore></ignore>
									</action>
								</pluginExecution>
							</pluginExecutions>
						</lifecycleMappingMetadata>
					</configuration>
				</plugin>
			</plugins>
		</pluginManagement>
	</build>
</project>

Groovyプロジェクトへの変換 / Convert to Groovy Project

  • GoogleWikipediaTest Project > Configure > Convert to Groovy Project

Maven Update Project

  • GoogleWikipediaTest Project > Maven > Update Project

Gebスクリプトの作成 / Creating Geb script

  • 下記のようなフォルダとファイルを作成します / Create a folder and files, such as the following
    • GoogleWikipediaTest/src/main/groovy/GoogleWikipediaMain.groovy
    • GoogleWikipediaTest/src/main/groovy/module/GoogleSearchModule.groovy
    • GoogleWikipediaTest/src/main/groovy/page/GoogleHomePage.groovy
    • GoogleWikipediaTest/src/main/groovy/page/GoogleResultsPage.groovy
    • GoogleWikipediaTest/src/main/groovy/page/WikipediaPage.groovy
    • GoogleWikipediaTest/src/test/groovy
    • f:id:yfj2:20150906133642p:plain
  • Java Build Pathの設定もします / You also set Java Build Path
    • GoogleWikipediaTest > Properties > Java Build Path > Add Folder...
      • src/main/groovy , src/test/groovy
    • f:id:yfj2:20150906171638p:plain
  • GoogleWikipediaMain.groovy
import geb.Browser
import page.GoogleHomePage
import page.GoogleResultsPage

Browser.drive {
	to GoogleHomePage
	search.field.value("wikipedia")
	waitFor { at GoogleResultsPage }
	firstResultLink.click()
}
  • GoogleSearchModule.groovy
package module

import geb.Module

class GoogleSearchModule extends Module {
	// a parameterised value set when the module is included
	def buttonValue

	// the content DSL
	static content = {
		// name the search input control “field”, defining it with the jQuery like navigator
		field { $("input", name: "q") }
	}
}
  • GoogleHomePage.groovy
package page

import geb.Page
import module.GoogleSearchModule

class GoogleHomePage extends Page {

	// pages can define their location, either absolutely or relative to a base
	static url = "http://google.com/ncr"

	// “at checkers” allow verifying that the browser is at the expected page
	static at = { title == "Google" }

	static content = {
		// include the previously defined module
		search { module GoogleSearchModule, buttonValue: "Google Search" }
	}
}
  • GoogleResultsPage.groovy
package page

import geb.Page
import module.GoogleSearchModule

class GoogleResultsPage extends Page {
	static at = { title.endsWith "Google Search" }
	static content = {
		// reuse our previously defined module
		search { module GoogleSearchModule}

		// content definitions can compose and build from other definitions
		results { $("div.g") }
		result { i -> results[i] }
		resultLink { i -> result(i).find("a") }
		firstResultLink { resultLink(0) }
	}
}
  • WikipediaPage.groovy
package page

import geb.Page

class WikipediaPage extends Page {
	static at = { title == "Wikipedia" }
}

Gebの実行 / Execution of Geb

  1. GoogleWikipediaMain.groovy > Run As > Groovy Script
    • f:id:yfj2:20150906173401p:plain
  2. 'http://en.wikipedia.org/wiki/Main_Page'が起動すればOK / If you can invoke the 'http://en.wikipedia.org/wiki/Main_Page' , This test is OK .

Spockの実装 / Creating spock script

  • 下記のようなフォルダとファイルを作成します / Create a folder and files, such as the following
    • GoogleWikipediaTest/src/test/groovy/GoogleWikipediaMainTest.groovy
    • f:id:yfj2:20150906211840p:plain
  • GoogleWikipediaMainTest.groovy
import geb.spock.GebSpec
import page.GoogleHomePage
import page.GoogleResultsPage
import page.WikipediaPage

class GoogleWikipediaMainTest extends GebSpec {

	def "first result for wikipedia search should be wikipedia"() {
		given:
		to GoogleHomePage

		expect:
		at GoogleHomePage

		when:
		search.field.value("wikipedia")

		then:
		waitFor { at GoogleResultsPage }

		and:
		firstResultLink.text() == "Wikipedia"

		when:
		firstResultLink.click()

		then:
		waitFor { at WikipediaPage }
	}
}

Spockの実行 / Execution of Geb

  1. GoogleWikipediaMainTest.groovy > Run As > JUnit Test
  2. テストが成功すればOK / If the test is successful OK

5. クロスブラウザテストの設定と実行 / Cross-browser test setting and running

以下、記事を参考に設定&実行する
【入門】Geb+SpockではじめるWebテスト~クロスブラウザテスト編~ / Setting up and running of the cross-browser test - yfj2’s Automatic Web Test Related Blog

6. テスト失敗時のスクリーンショット出力 / How to output screen-shot of test failure?

以下、記事を参考に設定&スクリーンショット出力する
【入門】Geb+SpockではじめるWebテスト~スクリーンショット編~ - yfj2’s Automatic Web Test Related Blog

7. Mavenコマンドによるテスト実行 / How to run test by Maven command?

以下、記事を参考にMavenコマンドでテストを実行する。
Mavenコマンドでテスト実行をできるようにしておくことでJenkinsとの連携が可能となる。
【入門】Geb+SpockではじめるWebテスト~Maven編~ / How to run test by Maven command using Geb+Spock? - yfj2’s Automatic Web Test Related Blog

8. "GitHub + Jenkins"によるWEBテストの自動化 / Automation of WEB tests by use to the "GitHub + Jenkins"

以下、記事を参考に"GitHub + Jenkins"によるWEBテストの自動化を実現する
【入門】Geb+SpockではじめるWebテスト~GitHub + JenkinsによるWEBテスト自動化編~ - yfj2’s Automatic Web Test Related Blog

9. GebとSpockによるWebテストTips集 / Web test Tips collection about Geb and Spock

以下、記事を参考にしつつ、自分でテストコードを作成してみてレベルアップする
GebとSpockによるWebテストTips集 - yfj2’s Automatic Web Test Related Blog