Skip to content

Instantly share code, notes, and snippets.

@s-hiroshi
Created Sep 24, 2012
Embed
What would you like to do?
JavaScript > Qunit QUnitを使ったハンドラのテスト
/*
* 名前空間を提供する。トップレベルオブジェクト
*
* <p>Christian Johansen(著),長尾高弘(翻訳)『テスト駆動JavaScript』ASCII
* 下記サイトで配布されているスクリプトを変更。</p>
* <p>http://tddjs.com/</p>
*/
function Common() {}
/**
* 名前空間を設定・管理する。
*
* <p>引数に対応する既存のオブジェクトが存在するときは
* そのオブジェクトを返す。存在しないときは空のオブジェクト作成・登録してして返す。
* </p>
*
* @param {String} name オブジェクト名
* @return {Object} 引数の文字列とマッチするオブジェクト
*/
Common.namespace = (function() {
var objectList = {};
return function(name) {
if (typeof objectList[name] == "undefined") {
objectList[name] = {};
}
return objectList[name];
};
}());
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>event test sample</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link rel="stylesheet" href="http://code.jquery.com/qunit/git/qunit.css" media="all">
<script src="http://code.jquery.com/qunit/git/qunit.js"></script>
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="common.js"></script>
<script src="handler.js"></script>
<script src="handler_test.js"></script>
</head>
<body>
<h1 id="qunit-header">event test sample</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="qunit-fixture">test markup, will be hidden</div>
</body>
</html>
jQuery(function($) {
var handler = Common.namespace('handler');
(function() {
// hrefの値が空文字以外の文字列のときはその文字列を返す。それ以外はfalseを返す。
function click(e) {
e.isDefaultPrevented();
e.stopPropagation();
var link = $(this).attr('href');
if (typeof link === 'string' && link !== '') {
return link;
}
if (typeof link === 'string' && link === '') {
return false;
}
return false;
}
/*
* クリックイベントの設定。
*
* @param {Element} elem
*/
function setClick(elem) {
// triggerHandlerで実行できるのはbindしたイベント。
// elem.onclick = click;はtriggerHandlerでは呼び出せない。
$(elem).bind('click', click);
}
// パブリックメソッドの設定
handler.setClick = setClick;
}());
});
jQuery(function($){
// Qunit test
test("イベントハンドラのテスト", function(){
var handler = Common.namespace('handler');
// テスト1
var a = $('<a>').attr('href', 'example.html');
handler.setClick(a.get(0));
// triggerHandlerはハンドラの戻り値を返す。triggerはオブジェクトチェーン用のオブジェクトを返す。
// http://phpjavascriptroom.com/?t=ajax&p=jquery_events_event_handling#a_jquery_events_triggerHandler
var result = a.triggerHandler('click');
equal(result ,'example.html', "clickイベントはhref属性の値が空文字''以外の文字列のときはその文字列を返す。");
// テスト2
a = $('<a>').attr('href', '');
handler.setClick(a.get(0));
var result = a.triggerHandler('click');
equal(result , false, "clickイベントはhref属性の値が空文字''のときはfalseを返す。");
// テスト3
a = $('<a>');
handler.setClick(a.get(0));
var result = a.triggerHandler('click');
equal(result , false, 'clickイベントはhref属性の値が設定されていないときはfalse返す。');
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment