如何使用Swift为WkWebView加载的网页预填充指定textfield内容

• 该输入框基于AngularJS开发，绑定了ng-model双向绑定规则，同时加载了ui-mask掩码插件，直接修改DOM的value属性不会触发框架和插件的状态同步，赋值不会被页面业务逻辑识别
• 原测试代码填入的是16位卡号，页面校验规则要求必须为19位纯数字，不符合规则的赋值会被拦截

// 拼接完整的执行逻辑
let fillCardJs = """
(function() {
    const cardInput = document.getElementsByName('cardNumber')[0];
    if (!cardInput) return;
    // 填入符合19位要求的测试卡号
    cardInput.value = '9999999999999999999';
    // 主动触发input、change事件，通知框架值发生变更
    cardInput.dispatchEvent(new Event('input', {bubbles: true}));
    cardInput.dispatchEvent(new Event('change', {bubbles: true}));
    // 兼容特殊场景：手动同步AngularJS作用域值
    const ngScope = angular.element(cardInput).scope();
    if (ngScope) {
        ngScope.$apply(() => {
            ngScope.cardDetails.cardNumber = '9999999999999999999';
        })
    }
})();
"""
// 执行JS
webView.evaluateJavaScript(fillCardJs) { result, error in
    if let err = error {
        print("赋值执行失败：\(err)")
    }
}

• 必须在页面完全加载完成后执行上述JS代码，建议在WKNavigationDelegate的webView(_:didFinish:)回调方法中调用，避免DOM未渲染完成找不到输入框
• 若页面配置了Content Security Policy限制内联脚本执行，需要提前调整WKWebView的WKWebViewConfiguration配置，放开对应脚本执行权限

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