无法使用 CasperJS 触发 GWT 列表框 ChangeHandler

Not possible to trigger GWT listbox ChangeHandler using CasperJS

我正在使用 CasperJS 为遗留 GWT (2.3) 代码编写测试。

我可以更改列表框的 selected 值。

document.querySelector('#id_of_select').selectedIndex = 1;

但这不会触发 ListBox 上更改处理程序的 onChange() 方法。

我已尝试在 select 元素上手动调度更改事件(jquery 在页面上不可用):

var evt = document.createEvent("manualchange");
        evt.initEvent("change", false, true);
document.querySelector('#id_of_select').dispatchEvent(evt);

我也试过这种方法

document.querySelector('#id_of_select').dispatchEvent(new Event('change', { 'bubbles': true }));

这两种方法都不会触发更改处理程序的 onChange 方法。任何人都可以建议一种方法来实现它吗?

jQuery 方式似乎适用于 such cases:

casper.fillSelect = function(selectSelector, id){
    this.evaluate(function(sel, id) {
        var select = jQuery(sel);
        select[0].selectedIndex = id;
        select.change();  
    }, selectSelector, id);
};

casper.fillSelect('#id_of_select', 1);

要实现这一点,您只需将 jQuery 加载到页面中,方法是将本地副本添加到 options.clientScripts or a remote copy into options.remoteScripts:

var casper = require("casper").create({
    clientScripts: [ "jquery.min.js" ],
    // or
    remoteScripts: [ "http://code.jquery.com/jquery-1.11.3.min.js" ]
});

还有 another way 通过在 select 字段上按下鼠标按钮并在特定选项上释放它来执行此操作:

casper.mouse.down("#id_of_select");
casper.mouse.up('#id_of_select > option:nth-child(2)'); // the second option