http://posl.kyushu-u.ac.jp/~fose2012/ FOSE 2012にて発表．投稿した論文の内容に加えて，FASE 2013の投稿内容を追加しました． IEEE Computer Society Japan Chapter FOSE Young Researcher Award，FOSE貢献賞を受賞．

1. 第19回 ソフトウェア工学の基礎ワークショップ
FOSE 2012 in 湯布院
2012年 12月14日
早稲田大学 情報理工学研究科 坂本 一憲
グーグル株式会社 海津 智宏
グーグル株式会社 波村 大悟
早稲田大学 情報理工学部 鷲崎 弘宜
早稲田大学 情報理工学部 深澤 良彰

2. 研究概要と貢献内容
• Webアプリの統合テストの成否(成功/失敗)判定の処理
– 何をもってWebアプリが正しく動作していると判断するか
例）ページタイトルの内容？ 特定要素の表示の有無？
貢献内容
1. 成否判定で確認すべき箇所を定義
2. 定義に基づいたカバレッジの提案
3. カバレッジに基づいたテスト生成
4. カバレッジと生成ツールの評価
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 2

3. 背景：テンプレートエンジン
• HTML文書中の可変/固定部分を混在させて記述
• 多くの近代的なWebフレームワークで搭載
– Closure Templates, Razor, Smarty, Django, eRuby
{template .addition} 計算ページ
<p> + = 計算
{$l}+{$r}={$ans}</p>
計算結果ページ 計算結果ページ
{/template}
Closure Templates (JavaScript) 1+2=3 2+3=5
入力によって
• HTML文書中の可変部分を確認すべき 内容が変化する
– テンプレート中に埋め込まれた変数・式
– 固定部分における欠陥の検出は容易、既存研究が存在(*)
*) Ali Mesbah and Arie van Deursen, “Invariant-based automatic testing of
AJAX user interfaces,” ICSE 2009.
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 3

4. WB単体テストとBB統合テスト
WB(ホワイトボックス)単体テスト BB(ブラックボックス)統合テスト
クライアントサイド Android OS, クライアントサイド
iOSでも動くか
Webブラウザ Webブラウザ
Sele
プラットフォーム nium プラットフォーム
HTML Selenium HTML
JUnit テスト
HTMLテンプレート HTMLテンプレート
JUnitテスト
サーバプログラム サーバプログラム
本番環境で
DB Web 認証 動作確認 DB Web 認証
サーバ サーバ サーバ サーバ サーバ サーバ
サーバサイド サーバサイド
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 4

5. WB単体/BB統合テストの例
{template .addition}
• テスト対象 <p>{$l}+{$r}={$ans}</p>
– 加算結果ページ {/template}
• ホワイトボックス(WB)単体テスト
テスト成否 @Test void test() { JavaとJUnitによるWB単体テスト
判定処理を
テストオラ
int ans = add(1, 2); // テストシナリオ
クルと呼ぶ assertEquals(ans, is(3)); };
• ブラックボックス(BB)統合テスト
@Test void test() { JavaとSeleniumによるBB統合テスト
// 計算結果ページを開く（省略）
WebElement p = d.css_selector(“p”);
assertEquals(“1+2=3”, p.getText()); };
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 5

6. BB統合テストにおける問題
問題1: テストオラクルが不明瞭
解決1: テンプレート可変部分の抽出
問題2: テストオラクルの評価指標がない
解決2: テンプレート可変部カバレッジの提案
問題3: テストコードの記述コストが高い
解決3: スケルトンテストコードの生成
問題4: テストコードの保守コストが高い
解決4: 変数名に基づくDOM要素へのアクセス
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 6

7. 問題1: テストオラクルが不明瞭
問題2: オラクルの評価指標がない
• 成否判定で確認すべき箇所（可変部分）が不明瞭
• 従来のカバレッジではオラクルを評価できない
固定部分
可変部分 状況に応じて異なる内容が
表示され欠陥の検出が困難
（成否判定で確認が必要）
どうやってWebページ中の可変部分を発見するか？
どうやって抜けや漏れがなく可変部分を確認するか？
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 7

8. 問題3,4: テストコードの記述/保守コスト
• HTML文書の構造に依存するテストコード
– デザイン変更時にテストが壊れやすい 保守コスト
drv.findElement(By.cssSelector(“p > div”));
{template .addition} {template .addition}
<p>{$l}+{$r}= <p>{$l}+{$r}=
<div>{$ans}</div> <span>{$ans}</span>
</p>{/template} </p>{/template}
• 対策：要素への印付け（ID属性など） 記述コスト
– 可変部分の全てに手動で印を付けるのは困難
drv.findElement(By.id(“ans”));
<div id=“ans”>{$ans} <span id=“ans”>{$ans}
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 8

9. テンプレート可変部カバレッジ
• 確認した可変部分の割合に基づくカバレッジ
– Ctmp = Vtest / Vall：確認済み可変部分 / 全可変部分
– 対象：{$left}, {$(x * 2)}, {$(”ab” + “c”)}など
– HTMLに直接出力されない箇所は無視($histories)
{template .result} Closure Template
<p>{$left}+{$right}=<div>{$answer}</div></p>
<ul>{call .items} {param list : $histories /}{/call}</ul>
{/template}
@Test void test() { テストケース（Selenium + JUnit）
WebElement answer = ... // div要素を取得 カバレッジの
assertEquals(“3”, answer.getText()); }; 測定値：33%
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 9

10. グレーボックス統合テスト
クライアントサイド • テンプレートを入力
Webブラウザ – BB以上の情報を利用
Sele
nium プラットフォーム – ソースコードは不要
Selenium HTML – 本番環境で統合テスト
テスト
HTMLテンプレート • 解析情報の活用
サーバプログラム – テストコード生成
• 提案ツール:POGen
DB Web 認証
サーバ サーバ サーバ
– カバレッジ算出
サーバサイド • AspectJによる監視
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 10

11. POGenが生成するコード
<p> 元のHTMLテンプレート @Test void test() { テストケース
（人が記述）
{$left}+{$right}= WebDriver d = ...
<div>{$answer}</div> // 1+2を実行するシナリオ(省略)
</p> AdditionPage p = ... 生成コード
Closure assertEquals(“3”, を利用
Templatesの POGen p.getTextOfAnswer()); }
テンプレート
<p id=“_po0”> class AdditionPage exnteds AbstractPage {
{$left}+{$right}= /* ---- GENERATED CODE START ---- */
@FindBy(id = “_po1”)
<div id=“_po1”> WebElement _answer;
{$answer}</div> WebElement getElementOfAnswer(){..}
<!-- _po {$left} --> String getTextOfAnswer() {..} // 省略
... /* ---- GENERATED CODE END ---- */
</p> // 必要であればここでユーザが追記可能
変形テンプレート } 生成したテストコード（ページオブジェクト）
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 11

12. POGenを用いたテストプロセス
可変部分中の変数名・ ~~---- 可変部分中の変数名・式から
式に基づくDOM要素と ~--~~
DOM要素にアクセスできるよ
~~~~
文字列表現を取得する --~~~ うに，目印の属性を挿入
アクセサメソッド
修正HTML
~~~~
~~~~ テンプレート
Web
pass
~~~~
~~~~
サーバー fail
pass
Webアプリ
POGen テスト結果
HTML Selenium
テンプレート
~~~~
~~~~
~~~~
~~~~
JUnit
Test
ユーザ ~~~~
Test case2
log
0110 case1
0011 スケルトン
1000 テストコード 実行ログ 75%
0001 テスト
監視ツール
コード カバレッジ
カバレッジ
算出用の情報 AspectJ
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 12

13. POGenのアーキテクチャ
解析部を
HTML
~~~~ ~~----
~~~~ 追加可能 ~--~~ 目印の属性を
~~~~ Templates ~~~~
埋め込む
~~~~ 解 Closure --~~~
析
Closure 部 テ テ 修正HTML 変数名による
Templates ン 00110
テンプレート
01000
変ン アクセサ
HTML
プ 00010
形プ
レ 部レ テス
~~~~
ー 解析情報 ー ~~~~
生スケ
00110 ~~~~
~~~~
ト
~~~~ 解 ト 01000
成トル
ejs
~~~~ 00010
析 解 部 コ ト スケルトン
01000
部 析
00010
解析情報 ー ン テストコード
ejs
カバレッジ情報 ド
部
HTML構造よりもテンプレート中の変数名・式のほうが堅牢
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 13

14. 評価：カバレッジの妥当性
Seam Frameworkのサンプル(宿泊予約)でミューテーション解析
仮説：カバレッジが高ければ検出した欠陥数も多い
Simple Jesterで生成したミュータント
25 15
のうち検出できた欠陥の割合[%]
ピアソン検定 ピアソン検定
相関:0.930 2 tests 相関:0.657
20 p値:0.0007 p値:0.076
4 tests
6 tests
10
15
8 tests
10 10 tests
5
12 tests
5 16テストケース中から 16テストケースから
抽出数を変えランダム 14 tests ランダムに2つを選び
0 に選び3回測定の中央値 16 tests 0 測定した結果
0 10 20 30 40 0 10 20 30
テンプレート可変部カバレッジ[%]
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 14

15. 評価：コード生成によるコスト削減
ソースコードのオンライン実行Webアプリへの適用実験
コード行数（空白やコメントを除く）
500 68%のコード
は自動生成
400
デザイン変更時の 38 143
300 人が記述
保守作業は不要
したコード
200
13 304 105 304 使用した
12
100 7 6 0 生成コード
82 88
0 47 44 43
0
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 15

16. 評価：コード生成によるコスト削減
• 学生6名に3テストケース群を2種類記述（穴埋め式）
• 記述時間:左、テストが確認する可変部分の箇所数:右
70
p値:0.021 p値:0.135 10
60
テストケース群の記述に
テストコードが検査する
学生A 8 8
かかった時間 [分]
可変部分の箇所数
50
学生B
40 学生C 6 6.3
38.3 36.3 学生D
30
学生E
4 4
20 学生F 3.6
平均
10 12.3 2
8.3 p値:0.008 p値:0.047
0
0
テストケース群1 テストケース群2 テストケース群1 テストケース群2
ツール有:左, 無:右 ツール有:左, 無:右 ツール有:左, 無:右 ツール有:左, 無:右
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 16

17. 関連研究
• Staats et al., “Programs, tests, and oracles: the
foundations of testing revisited,” ICSE 2011.
– 過去の研究に対してオラクルの品質を考慮すべきと提言
• Schuler et al., Assessing Oracle Quality with
Checked Coverage, ICST 2011.
– オラクルが検証する値に依存する命令に絞った命令網羅
• Sreedevi et al., “Coverage Criteria for Testing Web
Applications,” TechnicalPaper 2005. オラクル評価がない
– ページ単位のコントロール／データフローのカバレッジ
• 小高ら, アスペクト指向を利用したWebアプリケー
ションテストの自動化, SIGSE 2007. 検査方法が限定的
– JSPの可変部分が期待値と等しいかテストするツール
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 17

18. まとめと今後の展望
• テンプレート可変部カバレッジの提案
– テンプレート中の可変部分を確認した割合
• POGen：テストコード自動生成ツール
– テンプレート中の可変部へのアクセサメソッド
• 評価結果
– 欠陥検出能力と相関性あり、コスト削減に成功
• 今後の展望
– JavaScriptコードを解析した可変部分の検出
– 動的解析を用いた可変部分の検出手法の提案
2012/12/14 第19回 ソフトウェア工学の基礎ワークショップ 18