よちよち歩きのITエンジニアのメモ

Web技術など学んだ内容をメモしておくブログです。どんなにちっちゃくてもいいから、 一歩、ほんの小さな一歩でも夢や目標に近づくように頑張ります

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

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

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

更新日:2016/11/13
Updated date:2016/11/13

目次 / Table of contents

  1. Gebとは / What's Geb ?
  2. Gebのメリット / Why we have to use Geb ?
  3. 開発環境構築(IntelliJ IDEA) / Development Environment Building (IntelliJ IDEA)
  4. サンプルプログラム実装(Geb+Spock+Maven) / Sample program implementation (Geb + Spock + Maven)

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 ?

  • WebDriverと比較して、より短く、よりわかりやすいテストを記述することができる。Gebの提供するナビゲーターAPI(Navigator API)というjQueryのようなAPIがそれを可能にしている / Compared to WebDriver, shorter, and can be described more meaningful test. Navigator API like jQuery is allow it
  • Page Object patternをサポートしているので画面変更に強いテストを作成することができる / Since Page Object supports pattern, it is possible to create a test that we can handle screen change.
  • Mavenで提供されるのでテスト作成の環境構築が簡単にできる / It is possible to easily environment construction of test creation because it is provided by Maven
  • GroovyなのでJavaと互換性があり、SeleniumWebDriverの既存資産をそのまま利用することができる / Since using Groovy has Java-compatible, it is possible to directly utilize existing SeleniumWebDriver's assets
  • Moduleを使うことで共通部分を部品化することができる / By using the Module, it can be part of a common portion

3. 開発環境構築(IntelliJ IDEA) / Development Environment Building (IntelliJ IDEA)

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

$ brew update && brew cleanup
$ brew cask install java
$ vi ~/.bash_profile
JAVA_HOMEを追記する
↓
# JAVA_HOME
export JAVA_HOME=`/usr/libexec/java_home -v "11"`

IntelliJ IDEAのインストール / Installation of IntelliJ IDEA

本家サイトからダウンロード&イントールする
IntelliJ IDEA: The Java IDE for Professional Developers by JetBrains

Firefoxのインストール

Firefox47以上のバージョンだと動作しなかったので、45.4.0esrをインストールする
Directory Listing: /pub/firefox/releases/45.4.0esr/mac/ja-JP-mac/

2016/09/20 リリースの不具合修正版で安定して動作する
Firefox 45.4.0, See All New Features, Updates and Fixes

webdriverのインストール

$ brew install geckodriver
$ brew install chromedriver

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

IntelliJ IDEA起動 / Start IntelliJ IDEA

$ open /Applications/IntelliJ\ IDEA\ CE.app

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

Mavenプロジェクトの作成 / Create New Maven Project

f:id:yfj2:20161106101741p:plain
f:id:yfj2:20161106101948p:plain
f:id:yfj2:20161106102033p:plain

pom.xmlの編集 / setting of pom.xml
  • GoogleWikipediaTest/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>
    <properties>
        <groovyVersion>2.4.7</groovyVersion>
        <seleniumVersion>3.0.1</seleniumVersion>
    </properties>
    <dependencies>
        <dependency>
            <groupId>org.codehaus.groovy</groupId>
            <artifactId>groovy-all</artifactId>
            <version>${groovyVersion}</version>
        </dependency>
        <dependency>
            <groupId>org.spockframework</groupId>
            <artifactId>spock-core</artifactId>
            <version>1.1-groovy-2.4-rc-3</version>
        </dependency>
        <dependency>
            <groupId>org.gebish</groupId>
            <artifactId>geb-spock</artifactId>
            <version>0.13.1</version>
        </dependency>
        <dependency>
            <groupId>org.seleniumhq.selenium</groupId>
            <artifactId>selenium-firefox-driver</artifactId>
            <version>${seleniumVersion}</version>
        </dependency>
        <dependency>
            <groupId>org.seleniumhq.selenium</groupId>
            <artifactId>selenium-support</artifactId>
            <version>${seleniumVersion}</version>
        </dependency>
        <dependency>
            <groupId>org.seleniumhq.selenium</groupId>
            <artifactId>selenium-chrome-driver</artifactId>
            <version>${seleniumVersion}</version>
        </dependency>
        <dependency>
            <groupId>org.seleniumhq.selenium</groupId>
            <artifactId>selenium-ie-driver</artifactId>
            <version>${seleniumVersion}</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>
                            <sourceEncoding>UTF-8</sourceEncoding>
                        </configuration>
                    </execution>
                </executions>
                <dependencies>
                    <dependency>
                        <groupId>org.codehaus.groovy</groupId>
                        <artifactId>groovy-all</artifactId>
                        <version>${groovyVersion}</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>
                                </pluginExecution>
                            </pluginExecutions>
                        </lifecycleMappingMetadata>
                    </configuration>
                </plugin>
            </plugins>
        </pluginManagement>
    </build>
</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:20161113114007p:plain

src/main/groovyを"Sources Root", src/test/groovyを"Test Sources Root"にする

f:id:yfj2:20161106110941p:plain

  • src/main/groovy/GoogleWikipediaMain.groovy
import geb.Browser
import page.GoogleHomePage
import page.GoogleResultsPage

Browser.drive {
	to GoogleHomePage
	search.field.value("wikipedia")
	waitFor { at GoogleResultsPage }
	firstResultLink.click()
}
  • src/main/groovy/module/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") }
	}
}
  • src/main/groovy/page/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" }
	}
}
  • src/main/groovy/page/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") }

        resultLinks { results.find("a") }

        firstResultLink {
            resultLinks[0]
        }
    }
}
  • src/main/groovy/page/WikipediaPage.groovy
package page

import geb.Page

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

Gebの実行 / Execution of Geb

f:id:yfj2:20161113104443p:plain

Spockの実装 / Creating spock script

  • 下記のようなフォルダとファイルを作成します / Create a folder and files, such as the following
    • GoogleWikipediaTest/src/test/groovy/GoogleWikipediaMainTest.groovy

f:id:yfj2:20161113114110p: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

f:id:yfj2:20161113104820p:plain

  • テストが成功すればOK / If the test is successful OK

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

フォルダとファイルを作成します / Create a folder and files, such as the following

  • GoogleWikipediaTest/src/main/resources/GebConfig.groovy
//choose "firefox", "chrome"
driver = "chrome"

//$ brew install geckodriver
System.setProperty("webdriver.gecko.driver", "/usr/local/Cellar/geckodriver/0.11.1/bin/geckodriver")

//$ brew install chromedriver
System.setProperty("webdriver.chrome.driver", "/usr/local/Cellar/chromedriver/2.25/bin/chromedriver")

実行するブラウザの選択

  • firefoxの場合
driver = "firefox"
  • chromeの場合
driver = "chrome"