1
Qunitの新機能で、質問をしたいと思います。Qunitでjquery-ui datepickerをテストする方法
以下のようにdatepickerを使用するためのJavaScriptファイルを作成し、Qunitを使用してテストコードを作成しました。 私がしたいのは、カレンダーを表示して日付を選択し、日付が選択されていると主張することです。 私の問題は、私が.trigger("focus")
でカレンダーを見せても何も選択できなかったことです。
どのように私はこれを行うことができます知っていますか?
日付ピッカー-basic.js
$(function() {
$('#jquery-ui-datepicker').datepicker();
});
テストdatepicker.html
<!DOCTYPE html>
<html>
\t <head>
\t <meta charset="utf-8">
\t <meta name="viewport" content="width=device-width">
\t <title>test datepicker.js</title>
\t <link rel="stylesheet" href="jquery-ui/jquery-ui.css">
\t <link rel="stylesheet" href="qunit/qunit-2.0.1.css">
\t <script src="jquery/jquery-1.11.1.min.js"></script>
\t <script src="jquery-ui/jquery-ui.min.js"></script>
\t <script src="jquery-ui/i18n/datepicker-ja.js"></script>
\t <script src="qunit/qunit-2.0.1.js"></script>
\t <script src="../samples/jquery-ui/js/datepicker-basic.js"></script>
\t <script src="jquery.simulate/jquery.simulate.js"></script>
\t <script src="test-datepicker.js"></script>
\t </head>
\t <body>
\t <div id="qunit"></div>
\t <div id="qunit-fixture"></div>
\t <input type="text" id="jquery-ui-datepicker">
\t </body>
</html>
テストdatepicker.js
QUnit.test("basic", function(assert) {
// initiate input value
$("#jquery-ui-datepicker").val("");
// focus on input-textbox and select date on calendar
$("#jquery-ui-datepicker").trigger("focus").
\t simulate("keydown", { keyCode: $.ui.keyCode.ENTER });
// get selected date from input-textbox
var actual = document.getElementById("jquery-ui-datepicker").value;
// create expected value
var today = new Date();
var expected = formatDate(today);
// assert
assert.ok(actual === expected, "selected value from calendar correctly");
});