jQuery终端，Ember，QUnit -自动测试问题

Question

我正在开发一个将Ember和jquery-terminal相结合的应用程序来帮助用户学习。我为前面的冗长问题道歉！

我喜欢TDD风格的工作，但我很难做到这一点。

我想要做的是模拟用户输入到jquery-terminal，并断言正确的响应显示在终端中。我已经挖掘了源代码，也许我遗漏了一些东西，但是我似乎找不到添加用户输入的地方。终点站最后输出的是：-

<div id="terminal" class="terminal">
  <div class="terminal-output"></div>
  <div class="cmd" style="width: 100%;">
    <span class="prompt">TryRuby:&gt;&nbsp;</span>
    <span></span>
    <span class="cursor blink">&nbsp;</span>
    <span></span>
    <textarea class="clipboard"></textarea>
  </div>
</div>

用户输入的文本在第一个未命名的span中呈现，但是此处插入的文本不会使jquery-terminal在提交时获得相同的响应，就好像它是空的一样。

我想要模拟的是这个(伪代码)

test('user enters help and submits', function() {
  var input = $('#terminal') // find the right node / place to bind is my problem
  input.text = 'help'
  keyEvent(input, 'keydown', 13) // simulate hitting enter
  var match = /next: move to the next lesson/
  ok(match.test($('.terminal-output'), 'Expected to find "next: move to the next lesson"')
})

现在，如果我访问该页面并手动输入，所有这些都会很好地工作，但我希望通过编程完成。

欢迎任何建议！

Answer 1

下面是输入文本并按enter键的代码：

terminal.insert("Hello");
var e = $.Event("keydown");
e.ctrlKey = false;
e.which = e.keyCode = 13;
$(document.documentElement || window).trigger(e);

与terminal::insert不同，您还可以使用jQuery事件模拟输入文本：

function enter(text) {
    var e;
    var $root = $(document.documentElement || window);
    for (var i=0; i<text.length; ++i) {
        e = $.Event("keypress");
        e.which = text.charCodeAt(i);
        $root.trigger(e);
    }
}

注意:绑定keypress和keydown的代码在末尾的cmd插件中：

$(document.documentElement || window).bind('keypress.cmd', function(e) {

    ...

}).bind('keydown.cmd', keydown_event);

keydown_event是处理所有捷径和按键的主要功能，是输入文本。

如果您想测试终端内部的内容，最后一次回显文本将出现在：

 terminal.find('.terminal-output div:last').html()

前面的行是您输入的提示符+文本(我应该为这些行添加特定的类)。

另外，如果您想处理终端格式，您需要查看$.terminal.format函数中的格式化规则，它为每种格式创建span，并带有内联样式、类和属性。测试html而不是文本将给您更好的结果，我认为。提示符行将不具有格式设置，因为它们显示为文本。