「QUnit」の版間の差分

提供:MonoBook
imported>Administrator
ページの作成:「'''QUnit'''とは、jQueryの中の人が作っているJavaScript単体テストユニットテスト)を行うためのテスティングフ...」
 
imported>Administrator
 
(同じ利用者による、間の5版が非表示)
1行目: 1行目:
'''QUnit'''とは、[[jQuery]]の中の人が作っている[[JavaScrip]]tの[[単体テスト]]([[ユニットテスト]])を行うためのテスティングフレームワークである。
'''QUnit'''とは、[[jQuery]]の中の人が作っている[[JavaScrip]]tの[[単体テスト]]([[ユニットテスト]])を行うためのテスティングフレームワークである。


[[ASP.NET MVC]]で簡単に使えるQUnit for ASP.NET MVCという[[NuGet]]パッケージも用意されている。
[[ASP.NET MVC]]で簡単に使える「QUnit for ASP.NET MVC」という[[NuGet]]パッケージも用意されている。


== 使い方 ==
=== テストを作る ===
<source lang="javascript">
test("a basic test example", function() {
  ok( true, "this test is fine" );
  var value = "hello";
  equal( value, "hello", "We expect value to be hello" );
});
</source>
test関数にok関数やequal関数による評価を含めたテスト関数を放り込んで使う。
=== テスト実行用のHTMLページを作る ===
<source lang="html5">
<!DOCTYPE html>
<html>
<head>
  <title>QUnit: JavaScript Unit Testing</title>
  <!-- ↓のパスは適宜書き換えること -->
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <link rel="stylesheet" href="http://code.jquery.com/qunit/git/qunit.css" type="text/css" media="screen" />
  <script type="text/javascript" src="http://code.jquery.com/qunit/git/qunit.js"></script>
</head>
<body>
  <h1 id="qunit-header">QUnit example</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>
    <!-- テスト対象 -->
    <script src="MyScript.js" type="text/javascript"></script>
    <!-- テスト -->
    <script src="MyScript.tests.js" type="text/javascript"></script>
</body>
</html>
</source>
=== テスト実行 ===
上で作ったテストページにブラウザで普通にアクセスするだけ。
Visual Studio 2010を使っている場合は、ソリューションエクスプローラーでテストページを右クリックして「ブラウザーで表示」を選ぶ。


== 関連項目 ==
== 関連項目 ==
* [[ASP.NET MVC]]
* [[ASP.NET MVC]]
* [[jQuery]]
* [[jQuery]]
* [[NUnit]]


== 外部リンク ==
== 外部リンク ==
http://docs.jquery.com/QUnit
* http://docs.jquery.com/QUnit


{{stub}}
{{stub}}

2012年3月7日 (水) 05:22時点における最新版

QUnitとは、jQueryの中の人が作っているJavaScript単体テストユニットテスト)を行うためのテスティングフレームワークである。

ASP.NET MVCで簡単に使える「QUnit for ASP.NET MVC」というNuGetパッケージも用意されている。

使い方[編集 | ソースを編集]

テストを作る[編集 | ソースを編集]

test("a basic test example", function() {
  ok( true, "this test is fine" );
  var value = "hello";
  equal( value, "hello", "We expect value to be hello" );
});

test関数にok関数やequal関数による評価を含めたテスト関数を放り込んで使う。

テスト実行用のHTMLページを作る[編集 | ソースを編集]

<!DOCTYPE html>
<html>
<head>
  <title>QUnit: JavaScript Unit Testing</title>
  <!-- ↓のパスは適宜書き換えること -->
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <link rel="stylesheet" href="http://code.jquery.com/qunit/git/qunit.css" type="text/css" media="screen" />
  <script type="text/javascript" src="http://code.jquery.com/qunit/git/qunit.js"></script>
</head>
<body>
  <h1 id="qunit-header">QUnit example</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>

    <!-- テスト対象 -->
    <script src="MyScript.js" type="text/javascript"></script>

    <!-- テスト -->
    <script src="MyScript.tests.js" type="text/javascript"></script>

</body>
</html>

テスト実行[編集 | ソースを編集]

上で作ったテストページにブラウザで普通にアクセスするだけ。 Visual Studio 2010を使っている場合は、ソリューションエクスプローラーでテストページを右クリックして「ブラウザーで表示」を選ぶ。

関連項目[編集 | ソースを編集]

外部リンク[編集 | ソースを編集]