在 DOM 元素上模拟按键

Question

我正在尝试使用 WebView2 使用 C# 自动化 Web 条目表单。

Web 输入表单具有三个 DOM 元素：输入（UserName/Password）和输入按钮（已禁用）。

如果您通过键盘（手动）向输入区域输入值，则启用输入按钮。但是发送 Java 脚本来设置输入框的值不会启用此按钮。当然，禁用此页面的自动化是一种保护...

有没有办法使用 java 脚本启用输入按钮？

页面图片如下：

Answer 1

似乎网站所有者已经安排了 'Entry Button' 的操作将只能通过按键启用。防范自动化...

要模拟击键动作，您可以为每个 DOM 元素使用以下代码：

document.getElementById('USERNAME').focus();
document.execCommand('insertText', false, 'YourName');
document.getElementById('PASSWORD').focus();
document.execCommand('insertText', false, 'Password');
document.getElementById('ENTRY').click();

这将通过像击键一样粘贴数据来激活 'Entry Button'...

Answer 2

对于那些感兴趣的人，我刚刚发布了 WebView2.DevTools.Dom to NuGet.org。任何人都可以免费使用。

Readme

中有更多详细信息和示例

 await webView.EnsureCoreWebView2Async();
 
// Add using WebView2.DevTools.Dom; to access the CreateDevToolsContextAsync extension method
 await using var devToolsContext = await webView2Browser.CoreWebView2.CreateDevToolsContextAsync();

// Get element by Id
// https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector
var userName = await devtoolsContext.QuerySelectorAsync("#USERNAME");

//Type text in an input field
await userName.TypeAsync("myusername");

var password = await devtoolsContext.QuerySelectorAsync("#PASSWORD");

//Type text in an input field
await password.TypeAsync("mypassword");

var button = await devtoolsContext.QuerySelectorAsync("#BUTTON");

//Click The element
await button.ClickAsync();

这将模拟按键和鼠标move/clicks。

在 DOM 元素上模拟按键

Simulating Key Press On DOM element

c#

html

asp.net

dom-events

webview2