VBA使用SeleniumBasic触发onchange事件不生效如何解决

问题场景 #

使用SeleniumBasic开展网页自动化开发时，尝试通过以下代码触发ID为notaFiscalCad.cdFornecedor元素的onchange事件，但操作未生效：

ChromoLink.FindElementById("notaFiscalCad.cdFornecedor").SendKeys  (onchange)

目标输入框对应的HTML源码如下：

<input type="text" name="notaFiscalCad.cdFornecedor" size="15%" id="notaFiscalCad.cdFornecedor" bindingReference="entity.promocaoPK.cdFornecedor" value="" formatType="NUMBER" formato="5" obrigatorio="true" rotulo="Fornecedor" allowZero="true" desformataOnSubmit="false" onkeypress="CN_KPS(this, event);" onblur="CN_BLR(this);" onkeydown="CN_KDN(this, event);" onmousemove="CN_MMOV(this, event);" onmouseout="CN_MOUT(this, event);" onmouseover="CN_MOV(this, event);" onfocus="CN_OFC(this, event);" onchange="IS_request('credorSomenteFornecedorComInputSelectHandler','/AjaxServlet.ajax', 'consCredorSomenteFornecedor', 'notaFiscalCad.cdFornecedor', this.value,'/sienge','spjGenericSearch.do?spwProxySearchURL=%2F%2FsearchCredorSomenteFornecedor.jsp&amp;moduleName=%2FCAD', 'null', 'Consulta de Fornecedores','400','700', '&amp;bind_entity.promocaoPK.cdFornecedor=notaFiscalCad.cdFornecedor&amp;bind_entity.credor.nmCredor=notaFiscalCad.credor.nmCredor', 'false', event, 'InputSelectAutoComplete', '','false'); " style="width:100%" id="notaFiscalCad.cdFornecedor" input-select="consCredorSomenteFornecedor" idIframe=""></td>

失败原因 #

• SendKeys方法的作用是向元素发送键盘按键输入，传入onchange属于无效参数，既不能合法输入内容，也不具备触发事件的能力
• 该输入框是自定义封装的带自动补全的选择组件，onchange事件触发逻辑和输入值变更、焦点丢失强绑定，单纯模拟无效按键不会满足事件触发条件

可行方案 #

优先选择模拟真实用户操作的方案，兼容性最好，不会被页面的自定义事件逻辑拦截：

• 模拟真实输入+失焦触发
  先向输入框填入目标值，再通过Tab键切走焦点，同时触发组件绑定的onblur和onchange逻辑：

  Dim targetInput As Object
  Set targetInput = ChromoLink.FindElementById("notaFiscalCad.cdFornecedor")
  ' 清空输入框原有内容
  targetInput.Clear
  ' 填入实际需要的供应商编码
  targetInput.SendKeys "填入你的目标供应商编码"
  ' 按Tab键切走焦点，触发原生事件链
  targetInput.SendKeys Keys.Tab
  ' 可加1-2秒等待，等异步请求完成、关联字段渲染后再执行后续操作
  

• JS手动派发change事件
  如果模拟键盘操作不生效，可以通过JS直接给元素赋值后派发标准change事件：

  Dim targetInput As Object
  Set targetInput = ChromoLink.FindElementById("notaFiscalCad.cdFornecedor")
  ' 先给元素设置value，避免接口请求拿到空值
  ChromoLink.ExecuteScript "arguments[0].value = '填入你的目标供应商编码';", targetInput
  ' 手动派发change事件
  ChromoLink.ExecuteScript "var changeEvent = new Event('change'); arguments[0].dispatchEvent(changeEvent);", targetInput
  

• 直接调用元素绑定的onchange方法
  以上两种方案都失效时，可以直接执行元素上已经绑定的onchange函数：

  Dim targetInput As Object
  Set targetInput = ChromoLink.FindElementById("notaFiscalCad.cdFornecedor")
  ChromoLink.ExecuteScript "arguments[0].value = '填入你的目标供应商编码'; arguments[0].onchange();", targetInput
  

注意：该输入框的onchange会触发异步接口查询供应商信息，触发事件后建议加短暂等待，等关联的供应商名称字段自动填充完成后，再执行后续表单提交等操作，避免出现值为空的校验错误。

内容的提问来源于stack exchange，提问作者Pedro