如何用Qunit測試jquery-ui datepicker

Question

我是Qunit的新手，想問一個問題。

我創建了一個JavaScript文件來簡單地使用如下所示的datepicker，並使用Qunit創建了一個測試代碼。 我想要做的是顯示日歷並選擇一個日期，並斷言已選擇日期。 我的問題是我能夠通過.trigger("focus")顯示日歷，但無法選擇任何內容。

有誰知道我怎么能這樣做？

日期選擇器，basic.js

 $(function () { $('#jquery-ui-datepicker').datepicker(); });

測試datepicker.html

 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>test datepicker.js</title> <link rel="stylesheet" href="jquery-ui/jquery-ui.css"> <link rel="stylesheet" href="qunit/qunit-2.0.1.css"> <script src="jquery/jquery-1.11.1.min.js"></script> <script src="jquery-ui/jquery-ui.min.js"></script> <script src="jquery-ui/i18n/datepicker-ja.js"></script> <script src="qunit/qunit-2.0.1.js"></script> <script src="../samples/jquery-ui/js/datepicker-basic.js"></script> <script src="jquery.simulate/jquery.simulate.js"></script> <script src="test-datepicker.js"></script> </head> <body> <div id="qunit"></div> <div id="qunit-fixture"></div> <input type="text" id="jquery-ui-datepicker"> </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"). 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"); });

Answer 1

哦，我想我找到了答案。 我不得不添加一個trigger.("focus") 。 這是我改變了，它起作用了。

之前：

  // focus on input-textbox and select date on calendar
  $("#jquery-ui-datepicker").trigger("focus").
      simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );

后：

  // focus on input-textbox
  $("#jquery-ui-datepicker").trigger("focus");
  // select date on calendar
  $("#jquery-ui-datepicker").trigger("focus").
      simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );

如何用Qunit測試jquery-ui datepicker

問題描述

1 個解決方案

解決方案1
0 2016-08-29 02:40:34

如何用Qunit測試jquery-ui datepicker

問題描述

1 個解決方案

解決方案1 0 2016-08-29 02:40:34

解決方案1
0 2016-08-29 02:40:34