单元测试中的Javascript setSelectionRange行为不符合预期

时间:2012-08-15 16:43:42

标签: javascript jquery qunit

我正在使用qunit框架与我在Chrome中使用jquery(即var $ textarea = $(''))以编程方式创建的HTML进行单元测试交互。这是我用来更新textarea中的选择的代码。

    TextAreaView.prototype.setSelectionOffsets = function(cursor) {
    var input = this.$textarea.get(0);
    if (!input.setSelectionRange) {
        return;
    }
    if (cursor.start <= input.value.length && cursor.end <= input.value.length) {
        input.focus();
        input.setSelectionRange(cursor.start, cursor.end, "forward");
    }
}

我已经确认我在调用此方法时使用0&lt; cursor.start == cursor.end&lt; input.value.length。

当我单步执行调试器时,一切都显示正常 - 但是在它到达“input.setSelectionRange”行之后,输入元素的检查显示selectionEnd和selectionStart属性= 0,selectionDirection =“none”

我对这里发生的事情感到非常困惑。我在textarea元素上读过Mozilla's documentation,我相信我对setSelectionRange的调用是有效的。这可能与我以编程方式创建textarea并且实际上没有显示的事实有关吗?

1 个答案:

答案 0 :(得分:2)

在我输入问题时找到了答案,所以我想我会分享任何可能偶然发现这个问题的人。答案是显而易见的,我基本上在我的最后一句中遇到了:我正在用$('')创建一个textarea DOM元素并存储该对象,但我从未将该对象插入到文档中。将元素附加到正文后,setSelectionRange按预期更新选择。在我的情况下,我不希望在我的单元测试结果页面上显示实际的textarea,但通过调用$ textarea.hide()可以很容易地解决这个问题。