Developing and debugging your browser app with DOMView2 is far quicker and easier than having to inject javascript, then log and debug errors through devtools.
Inserting HTML into the DOM:
With DOMView, you can insert, change or query the DOM from .NET
VB
' Loop over queried elements and insert element
For Each Item In DomView.document.querySelectorAll("div.my-class")
Dim Elm As DVDiv = Domview.document.createElement("div");
Elm.innerText = "This is the inserted element";
Item.insertAdjacentElement("afterBegin", elm)
Next
C#
// Loop over queried elements and insert HTML
foreach(DVHTMLElement item in DomView.document.querySelectorAll("div.my-class")){
item.insertAdjacentHTML("afterBegin", "<div>This is the inserted element</div>")
}
DOM event handlers inside .NET:
Injecting events to be raised in .NET with WebView2
.NET
// Execute javascript to raise a single event
await browser.CoreWebView2.ExecuteScriptAsync(
"document.body.addEventListener('click', function(e){window.chrome.webview.postMessage(e.type)}"
)
In DOMView2 a single event is raised on the browser or individual elements for all DOM events.
VB
' DOMView event to receive all window events
Private Sub DOMView_DOMEvent(Sender As DVWindow, e As DVEvent) Handles DOMView.DOMEvent
If e.type = "click" Then
Select Case e.target.id
Case "button1"
Sender.document.location.href = "https://web-site/page1.html"
Case "button2"
Sender.document.location.href = "https://web-site/page2.html"
End Select
End If
End Sub
Raised to allow preventDefault() and stopPropagation() to be called on the native javascript event.
C#
// DOMView2 BeforeEvent allows events to be cancelled
private void Body_BeforeEvent(DVWindow Sender, DVBeforeEventArgs e)
{
if (e.type == "click")
// Click event is cancelled when script evaluates to true
e.EvalScript = "e.target==document.querySelector('a.aClass')";
}
