填写一个非文本类型的输入字段，并在CasperJS中触发事件

Question

我必须在网站上进行自动化测试，我想使用CasperJS来学习。出于专有原因，我无法提供太多代码。

以下是我要填写的输入示例：

<input data-bind="value: firstname, valueUpdate: ['blur'], css: {valid:(firstname.isValid() )} " title="" class="valid" aria-required="true" id="firstname" name="firstname">

如您所见，此输入不是text类型，也没有value属性。因此，我无法使用casper.fill()方法。此外，如果我使用evaluate()进入网页范围并使用document.querySelector更改输入值，则更改将不会是永久性的，因为附加到输入上的文本更改的事件将不会被触发。

这是我的代码：

this.waitForSelector('#memberTitle', function then(){
    var testname = 'thisIsNotPermanent';
    this.evaluate(function(testname){
        document.querySelector('#firstname').value = testname;
    }, testname);
});

如果我立即捕捉屏幕，我会在输入框中看到我的文字。但是，如果我等待500毫秒并进行另一次捕获，那么文本就会消失，因为我认为事件被触发或刚刚清理，因为它实际上无法正确触发。

附加到输入的事件是Blur，Change和Keypress。

使用CasperJS，我怎样才能使用键盘模仿用户，并充分利用现有网站的功能？

这些测试的重点在于使用现有的测试。我们的想法是不必手动浏览网站的JavaScript。

Answer 1

这正是casper.sendKeys(selector, keys)函数的作用，它将发送 native 按键并（希望）触发该文本元素上的事件：

this.waitForSelector('#memberTitle', function then(){
    var testname = 'thisIsNotPermanent';
    this.sendKeys('#firstname', testname);
}).wait(20, function(){
    this.capture('screenshot.png');
});

没有<input>属性的

type元素默认为Text类型。

Answer 2

这个答案是从另一个角度完成问题的。正如Artjom B.提到的，填充输入和触发其事件的正确方法是使用sendKeys（）函数。但是，如果你有一个像我这样的情况，事件不会触发或需要一定的时间，请知道你可以手动触发这些事件。

如果您使用firefox检查器工具，您将看到您的输入或标记将附加一个标记为ev的事件。如果您选择它，您将按顺序触发所有事件的细分。

您可以看到将调用jQuery click（）事件。在casperjs中，您可以从评估范围执行此操作：

this.evaluate(function(){
    $(".discard-answer").click();
})

从那里，你可以链接jQuery事件，就像在我的情况下我必须.blur（）。change（）。click（）;

了解事件是否为jQuery非常重要。

希望这有帮助。