最近在優化以前的項目，重寫一些地方，由於這些數據都是從客戶端行情獲取，自己也沒有做測試的習慣，運行的時候，數據一直出不來，也不報錯，這就俺們神奇的客戶端。沒辦法，一步一步還原調試，最后找出來了，一個函數的參數，我調用的時候，參數的首字母變成大寫了。可能最近霧大，哥每天吸收太多，變痴呆了！還有一個地方value 寫成val。於是決定用單元測試，湯姆大叔曾經提到過qunit，自己搜一下，原來是jquery團隊開發的，所有jquery的代碼均由其測試。
我自己看了一下，自己深深的愛上了他，只需引用兩個文件就行了
<link rel="stylesheet" href="/resources/qunit.css"> <script src="/resources/qunit.js"></script>
非常簡單！
隨便看一個簡單的例子
test( "hello test", function() { ok( 1 == "1", "Passed!" );});
ok( state, message ) state 會轉換成true or false， 如果是true 則通過，反則失敗
還有一個是比較常用 equal
test( "a test", function() { equal( 1, "1", "String '1' and number 1 have the same value" );});
equal( actual, expected, message ) actual 是object類型，expected 也是object 適合數組，對象進行比較！
ok 和equal 屬於比較常用的斷言
下面是我自己做的例子
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>QUnit Example</title> <link rel="stylesheet" href="qunit/qunit.css"> <style> .myclass { color : red}; </style> </head> <body> <div id="qunit"></div> <div id="qunit-fixture"></div> <script src="qunit/qunit.js"></script> <script src="qunit/jquery-1.6.3.js"></script> <div id="mytest"></div> </body> </html> <script> function changeEl(el, text) { el.html(text); el.addClass('myclass'); } module('my first test'); test('測試插入的元素操作', function(){ var el = $('#mytest'); changeEl(el, '草') equal(el.text(), '草', '測試通過'); equal(el.hasClass('myclass'), true, '測試通過'); }) </script>
下面是測試界面
ok，洗洗睡了