WebView2AutoIt - AutoIt WebView2 Component (COM Interop)

[ioa747]

WebView2AutoIt

AutoIt WebView2 Component (COM Interop)

Integrating WebView2 into AutoIt has proven to be somewhat complicated.
To simplify this process, I decided to create a COM object in C# that serves as a bridge for AutoIt, facilitating the interaction.
I must admit that I have no prior experience in this area, but I am eager to learn and am open to any comments or suggestions.
I am sharing this project publicly, in the hope that it can be improved over time to fill this notable gap left by Internet Explorer.

In today's rapidly evolving technological landscape, AutoIt - it is my vehicle - needs to evolve and be always on the go,
allowing for the integration of advanced functionality into AutoIt scripts. 
So new rims and tires
 

Purpose of this project
WebView2, based on Chromium, offers fast and secure web browsing capabilities, unlocking new opportunities for applications that desire a modern look and functionality.
As an AutoIt user, I have the desire to be able to integrate these features directly into my scripts.
 

The Approach: Creating a COM Bridge
The idea was simple but ambitious: develop a C# library that acts as an intermediary between AutoIt and WebView2.
Using COM (Component Object Model), I created an object that allows calling AutoIt functions from JavaScript code in WebView2 and vice versa.
 

 

This project enables you to render modern HTML5, CSS3, and JavaScript directly inside your AutoIt applications.

Html_Gui.au3

expandcollapse popup

;~ #AutoIt3Wrapper_UseX64=y
; Html_Gui.au3
#include <GUIConstantsEx.au3>
#include <WindowsConstants.au3>
#include <Array.au3>

; Global objects
Global $oManager, $oBridge
Global $oEvtManager, $oEvtBridge

; Global error handler for COM objects
Global $oMyError = ObjEvent("AutoIt.Error", "_ErrFunc")

; Global variables for data management
Global $aMessages[0][3]
Global $sFilePath = @ScriptDir & "\messages.csv"
Global $hGUI

Main()

Func Main()
    ; Create GUI with resizing support
    $hGUI = GUICreate("WebView2 Theme Switcher", 500, 450, -1, -1, BitOR($WS_OVERLAPPEDWINDOW, $WS_CLIPCHILDREN))
    GUISetBkColor(0x1E1E1E)

    Local $idBlue = GUICtrlCreateLabel("Blue Theme", 10, 10, 100, 30)
    GUICtrlSetFont(-1, 12, Default, $GUI_FONTUNDER, "Segoe UI")
    GUICtrlSetColor(-1, 0x0078D7)

    Local $idRed = GUICtrlCreateLabel("Red Theme", 120, 10, 100, 30)
    GUICtrlSetFont(-1, 12, Default, $GUI_FONTUNDER, "Segoe UI")
    GUICtrlSetColor(-1, 0xFF0000)

    ; Get the WebView2 Manager object and register events
    $oManager = ObjCreate("NetWebView2.Manager")
    $oEvtManager = ObjEvent($oManager, "Manager_", "IWebViewEvents")

    ; Get the bridge object and register events
    $oBridge = $oManager.GetBridge()
    $oEvtBridge = ObjEvent($oBridge, "Bridge_", "IBridgeEvents")

    ; ⚠️ Important: Enclose ($hGUI) in parentheses to force "Pass-by-Value".
    ; This prevents the COM layer from changing the AutoIt variable type from Ptr to Int64.
    $oManager.Initialize(($hGUI), "", 0, 50, 500, 400)

    ; Register the WM_SIZE message to handle window resizing
    GUIRegisterMsg($WM_SIZE, "WM_SIZE")

    ;GUISetState(@SW_SHOW)

    ; Main Application Loop
    While 1
        Switch GUIGetMsg()
            Case $GUI_EVENT_CLOSE
                $oManager.Cleanup()
                Exit

            Case $idBlue
                ; Update CSS variables dynamically via JavaScript
                $oManager.ExecuteScript("document.documentElement.style.setProperty('--accent-color', '#4db8ff');")
                $oManager.ExecuteScript("document.documentElement.style.setProperty('--btn-color', '#0078d7');")

            Case $idRed
                ; Update CSS variables dynamically via JavaScript
                $oManager.ExecuteScript("document.documentElement.style.setProperty('--accent-color', '#ff4d4d');")
                $oManager.ExecuteScript("document.documentElement.style.setProperty('--btn-color', '#d70000');")
        EndSwitch
    WEnd

EndFunc   ;==>Main

; Handles data received from the WebView2 Manager
Func Manager_OnMessageReceived($sMessage)
    Local Static $bIsInitialized = False
    If $sMessage = "INIT_READY" And Not $bIsInitialized Then
        $bIsInitialized = True ; We note that we are finished.
        Local $sHTML = "<html><head><meta charset='UTF-8'>" & _FormCSS() & "</head><body>" & _FormHTML() & "</body></html>"
        $oManager.NavigateToString($sHTML)
        GUISetState(@SW_SHOW, $hGUI)
    EndIf
EndFunc   ;==>Manager_OnMessageReceived

; Handles data received from the JavaScript 'postMessage'
Func Bridge_OnMessageReceived($sMessage)
    ConsoleWrite("$sMessage=" & $sMessage & @CRLF)

    ; Check for the specific form submission prefix
    If StringLeft($sMessage, 12) = "SUBMIT_FORM:" Then
        ; Extract the JSON portion from the message
        Local $sJsonRaw = StringTrimLeft($sMessage, 12)
        Local $oJson = ObjCreate("NetJson.Parser")

        ; Parse the raw JSON string
        If $oJson.Parse($sJsonRaw) Then
            ; Extract values using their JSON keys
            Local $sName = $oJson.GetTokenValue("name")
            Local $sEmail = $oJson.GetTokenValue("email")
            Local $sMsg = $oJson.GetTokenValue("message")

            If $sName <> "" And $sEmail <> "" Then
                ; Add data to global array for internal tracking
                _ArrayAdd($aMessages, $sName & "|" & $sEmail & "|" & $sMsg)

                ; Append data to CSV file safely
                Local $hFile = FileOpen($sFilePath, 9) ; 1 (Write) + 8 (Create Path)
                If $hFile <> -1 Then
                    ; Clean the message string for CSV compatibility (remove line breaks)
                    Local $sCleanMsg = StringReplace($sMsg, @CRLF, " ")
                    FileWriteLine($hFile, $sName & "," & $sEmail & "," & $sCleanMsg)
                    FileClose($hFile)
                EndIf

                ShowWebNotification("Data Saved Successfully!")
            Else
                ; Trigger a visual notification inside the WebView
                ShowWebNotification("Please enter valid data", '#d70000')
            EndIf
        EndIf
    EndIf
EndFunc   ;==>Bridge_OnMessageReceived

; Generates the CSS block with dynamic variables
Func _FormCSS()
    Local $sTxt = "<style>" & @CRLF & _
            ":root {" & @CRLF & _
            "  --bg-color: #1e1e1e; --form-bg: #2d2d2d;" & @CRLF & _
            "  --accent-color: #4db8ff; --btn-color: #0078d7; --txt-color: #e0e0e0;" & @CRLF & _
            "}" & @CRLF & _
            "body { background-color: var(--bg-color); color: var(--txt-color); font-family: 'Segoe UI', sans-serif; padding: 20px; margin: 0; }" & @CRLF & _
            "#contactForm { max-width: 400px; background-color: var(--form-bg); padding: 20px; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,0.5); }" & @CRLF & _
            "label { display: block; margin-bottom: 5px; font-weight: bold; color: var(--accent-color); }" & @CRLF & _
            "input, textarea { width: 100%; padding: 10px; background-color: #3d3d3d; border: 1px solid #555; border-radius: 4px; color: #fff; box-sizing: border-box; margin-bottom: 15px; }" & @CRLF & _
            "button { background-color: var(--btn-color); color: white; border: none; padding: 12px 20px; border-radius: 4px; cursor: pointer; width: 100%; font-size: 16px; }" & @CRLF & _
            "</style>"
    Return $sTxt
EndFunc   ;==>_FormCSS

; Generates the HTML form and JavaScript logic
Func _FormHTML()
    Local $sTxt = "<form id='contactForm'>" & @CRLF & _
            "  <label>Name:</label><input type='text' id='name'>" & @CRLF & _
            "  <label>Email:</label><input type='email' id='mail'>" & @CRLF & _
            "  <label>Message:</label><textarea id='msg'></textarea>" & @CRLF & _
            "  <button type='button' onclick='submitToAutoIt()'>Send Message</button>" & @CRLF & _
            "</form>" & @CRLF & _
            "<script>" & @CRLF & _
            "  function submitToAutoIt() {" & @CRLF & _
            "    const formData = {" & @CRLF & _
            "      name: document.getElementById('name').value," & @CRLF & _
            "      email: document.getElementById('mail').value," & @CRLF & _
            "      message: document.getElementById('msg').value" & @CRLF & _
            "    };" & @CRLF & _
            "    " & @CRLF & _
            "    // postMessage to autoit" & @CRLF & _
            "    window.chrome.webview.postMessage('SUBMIT_FORM:' + JSON.stringify(formData));" & @CRLF & _
            "    " & @CRLF & _
            "    document.getElementById('contactForm').reset();" & @CRLF & _
            "  }" & @CRLF & _
            "</script>"
    Return $sTxt
EndFunc   ;==>_FormHTML

; Injects a temporary notification box into the web page
Func ShowWebNotification($sMessage, $sBgColor = "#4CAF50", $iDuration = 3000)
    ; We use a unique ID 'autoit-notification' to find and replace existing alerts
    Local $sJS = _
            "var oldDiv = document.getElementById('autoit-notification');" & _
            "if (oldDiv) { oldDiv.remove(); }" & _
            "var div = document.createElement('div');" & _
            "div.id = 'autoit-notification';" & _ ; Assign the ID
            "div.style = 'position:fixed; top:20px; left:50%; transform:translateX(-50%); padding:15px; background:" & $sBgColor & _
            "; color:white; border-radius:8px; z-index:9999; font-family:sans-serif; box-shadow: 0 4px 6px rgba(0,0,0,0.2); transition: opacity 0.5s;';" & _
            "div.innerText = '" & $sMessage & "';" & _
            "document.body.appendChild(div);" & _
            "setTimeout(() => {" & _
            "   var target = document.getElementById('autoit-notification');" & _
            "   if(target) { target.style.opacity = '0'; setTimeout(() => target.remove(), 500); }" & _
            "}, " & $iDuration & ");"

    $oManager.ExecuteScript($sJS)
EndFunc   ;==>ShowWebNotification

; Synchronizes WebView size with the GUI window
Func WM_SIZE($hWnd, $iMsg, $wParam, $lParam)
    If $wParam = 1 Then Return $GUI_RUNDEFMSG
    Local $iW = BitAND($lParam, 0xFFFF), $iH = BitShift($lParam, 16) - 50
    If IsObj($oManager) Then $oManager.Resize(($iW < 10 ? 10 : $iW), ($iH < 10 ? 10 : $iH))
    Return $GUI_RUNDEFMSG
EndFunc   ;==>WM_SIZE

; User's COM error function. Will be called if COM error occurs
Func _ErrFunc($oError)
    ; Do anything here.
    ConsoleWrite(@ScriptName & " (" & $oError.scriptline & ") : ==> COM Error intercepted !" & @CRLF & _
            @TAB & "err.number is: " & @TAB & @TAB & "0x" & Hex($oError.number) & @CRLF & _
            @TAB & "err.windescription:" & @TAB & $oError.windescription & @CRLF & _
            @TAB & "err.description is: " & @TAB & $oError.description & @CRLF & _
            @TAB & "err.source is: " & @TAB & @TAB & $oError.source & @CRLF & _
            @TAB & "err.helpfile is: " & @TAB & $oError.helpfile & @CRLF & _
            @TAB & "err.helpcontext is: " & @TAB & $oError.helpcontext & @CRLF & _
            @TAB & "err.lastdllerror is: " & @TAB & $oError.lastdllerror & @CRLF & _
            @TAB & "err.scriptline is: " & @TAB & $oError.scriptline & @CRLF & _
            @TAB & "err.retcode is: " & @TAB & "0x" & Hex($oError.retcode) & @CRLF & @CRLF)
EndFunc   ;==>_ErrFunc

 

  I hope someone with more knowledge
can shed some light on the thread.
 

https://github.com/ioa747/NetWebView2Lib

v1.3.0.zip

 

Please, every comment is appreciated!
leave your comments and experiences here!
Thank you very much 

Edited Friday at 07:33 PM by ioa747
update to v1.3.0

[argumentum]

27 minutes ago, ioa747 said:

This project enables you to render modern HTML5, CSS3, and JavaScript directly inside your AutoIt applications.

---------------------------
Error
---------------------------
Could not create WebView2 Manager. Please register the DLL.
---------------------------
OK
---------------------------

😭

[argumentum]

5 minutes ago, argumentum said:

😭

@argumentum, please run WebView2AutoIt_v0.1\NetWebView2Lib\WebView2AutoIt\register_web2.au3 and it should work after that.
Do place the project in a local drive 

[ioa747]

  There are two ways
either you will load "NetWebView2\WebView2AutoIt_v0.1\NetWebView2Lib\NetWebView2Lib.sln"
into Visual Studio and build
or you will run "\WebView2AutoIt_v0.1\NetWebView2Lib\WebView2AutoIt\register_web2.au3"

ah! there is also a "WebView2AutoIt_v0.1\README.md"

Edited Monday at 07:29 PM by ioa747

[argumentum]

If MsgBox(36, "Confirm", "Exit Application?", 0, $hGUI) = 6 Then Exit  is better because it will disable the GUI while MsgBox() is active.

Is there a way to do all these without registering a DLL ?
- I hope someone with more knowledge can shed some light on the thread.
Ok, but, it would be nicer, even if not better than this way.

Thanks for the code  
 

[mLipok]

Nice thanks.

Will look into it, hope in next 2 month. My january schedule is full as always from 20years.

[SOLVE-SMART]

Interesting, thank you @ioa747 👌 . This could bring a large opportunity to AutoIt in cases of working witz the web (html, js etc.).

I will also have a look after the christmas days. I would also be interested in the .Net (C#) bridge that you build. Maybe you provide the code also in the zip file? Or separately?

In any case, thanks and enjoy the upcoming days with your beloved ones.

Best regards

Sven

[ioa747]

Τhank you SOLVE-SMART, every contribution is welcome
All files are in the zip file, in the first post
I am definitely still in the process of searching and enriching (according to my capabilities)
since new doors are opening

[bladem2003]

Thanks for sharing


Is there a way to integrate extension support?

coreWebView2.Profile.AddBrowserExtensionAsync("folder containing manifest.json");

 

https://learn.microsoft.com/en-us/dotnet/api/microsoft.web.webview2.core.corewebview2profile.addbrowserextensionasync?view=webview2-dotnet-1.0.3595.46

 

 

edit

i add this to WebViewManager.cs and compiled, but this is not working. 

i get only a white screen.

 

var options = new CoreWebView2EnvironmentOptions(userDataFolder);
options.AreBrowserExtensionsEnabled = true;
var path = @"D:\WebView2AutoIt_v0.1\uBOLite_2025.1224.1544.edge\";
await _webView.CoreWebView2.Profile.AddBrowserExtensionAsync(path);

 

WebViewManager.cs

Edited Thursday at 12:38 AM by bladem2003

[ioa747]

Update to Version 1.3.0  - (2025-12-25)

the main change is that now
.Initialize(hWnd, userDataFolder, x, y, width, height)
in the second parameter takes the userDataFolder, and not the url, as it was until now

Specifying the userDataFolder gives us the advantage of having multiple separate/isolated entities
e.g. 2 facebook accounts simultaneously side by side

Persistent Sessions: Cookies, Local Storage, and browser cache are now saved in a dedicated directory.
This means users stay logged into websites even after the application restarts.

Environment Isolation: By defining a specific path, you ensure that your application's data is isolated from other WebView2 instances or the system's default browser profile.

Improved Stability: It prevents permission conflicts. If the parameter is left as an empty string "", the engine defaults to the executable's directory.

However, providing a path like @AppDataDir ensures the application runs correctly even when installed in restricted folders like Program Files.

Νow supports loading unpacked Chromium extensions.
This allows you to enhance the browser's functionality with custom tools or third-party extensions.

Method: .AddExtension($sExtPath)
Requirement: The extension must be in an "unpacked" format (a folder containing the manifest.json file).
(analytical guide to WebView2AutoIt\Doc\How-To Using Extensions in NetWebView2.md)
Example   WebView2AutoIt\Examples\6-Multi-WebView2-Extension.au3

 

Other Improvements:

New Method: .IsReady()  A boolean check to confirm the browser engine has finished initializing before sending commands like .Navigate().

Enhanced Cleanup: The .Cleanup() method has been optimized to ensure all Chromium processes are terminated
and file locks on the userDataFolder are released immediately.

Template

expandcollapse popup

#AutoIt3Wrapper_UseX64=y
#include <GUIConstantsEx.au3>
#include <WindowsConstants.au3>

; =======================================================================================
; PROJECT: WebView2 .NET Manager - Starter Template
; DESCRIPTION: A clean skeleton for integrating Chromium (WebView2) into AutoIt.
; VERSION: 1.3.0
; =======================================================================================

OnAutoItExitRegister ("_ExitApp")

; Global objects for COM Interop
Global $oWeb, $oBridge
Global $oEvtManager, $oEvtBridge
Global $hGUI, $sURL = "https://www.google.com"
Global $oMyError = ObjEvent("AutoIt.Error", "_ErrFunc") ; Will be called if COM error occurs

; 1. Create the Main GUI
$hGUI = GUICreate("WebView2 v1.3.0 - Starter Template", 1024, 768, -1, -1, BitOR($WS_OVERLAPPEDWINDOW, $WS_CLIPCHILDREN))
GUISetBkColor(0x1E1E1E, $hGUI)

; 2. Initialize the COM Objects
_InitWebView()

; 3. Main Application Loop
GUISetState(@SW_SHOW)

While 1
    Switch GUIGetMsg()
        Case $GUI_EVENT_CLOSE
            Exit
    EndSwitch
WEnd

; =======================================================================================
; CORE FUNCTIONS
; =======================================================================================

Func _InitWebView()
    ; A. Create the Manager Instance
    $oWeb = ObjCreate("NetWebView2.Manager")
    If Not IsObj($oWeb) Then Return MsgBox(16, "Error", "WebView2 DLL not registered!")

    ; B. Register Manager Events (Navigation, Status, Core Messages)
    $oEvtManager = ObjEvent($oWeb, "WebView_", "IWebViewEvents")

    ; C. Setup the JavaScript Bridge (Communication from JS to AutoIt)
    $oBridge = $oWeb.GetBridge()
    $oEvtBridge = ObjEvent($oBridge, "Bridge_", "IBridgeEvents")

    ; D. Initialize the browser engine
    
    ; Browser Data Directory (Cache, Cookies, Session).
    ; Ensures that settings and logins persist after closing the application.
    ; - If left blank "", the folder will be automatically created next to the executable.
    ; - ⚠️ WARNING: If you are running the script from Scite (C:\Program Files (x86)\AutoIt3),
    ; make sure you have write permissions to the folder, otherwise set a path
    ; to another location (e.g. @AppDataDir & "\MyApp").
    Local $sProfilePath = @ScriptDir & "\UserDataFolder"
    
    ; ⚠️ IMPORTANT: Enclose ($hGUI) in parentheses to force "Pass-by-Value" (COM requirement).
    ; Parameters: (hWnd, profilePath, x, y, width, height)
    $oWeb.Initialize(($hGUI), $sProfilePath, 0, 0, 1024, 768)

    ; E. Wait for the engine to be ready before navigating
    Do
        Sleep(50)
    Until $oWeb.IsReady

    ; F. Navigate to the starting URL
    $oWeb.Navigate($sURL)

    ConsoleWrite("> WebView2 is Ready and Navigating..." & @CRLF)
EndFunc

Func _ExitApp()
    ; ⚠️ IMPORTANT: Cleanup must be called to release file locks on the Profile Folder
    ; and to terminate msedgewebview2.exe processes.
    If IsObj($oWeb) Then $oWeb.Cleanup()

    $oWeb = 0
    $oBridge = 0
    Exit
EndFunc

; =======================================================================================
; EVENT HANDLERS (CALLBACKS)
; =======================================================================================

; Listen for Manager Events (System-level messages)
; Common messages: INIT_READY, NAV_STARTING, NAV_COMPLETED, URL_CHANGED, TITLE_CHANGED
Func WebView_OnMessageReceived($sMsg)
    ConsoleWrite("+> [WebView Manager]: " & $sMsg & @CRLF)
EndFunc

; Listen for JavaScript Bridge Events (Custom messages from the webpage)
; Triggered by: window.chrome.webview.postMessage("your_data_here");
Func Bridge_OnMessageReceived($sMsg)
    ConsoleWrite(">> [JS Bridge]: " & $sMsg & @CRLF)

    ; Example: Simple logic based on JS message
    If $sMsg == "close_window" Then _ExitApp()
EndFunc

; =======================================================================================
; User's COM error function. Will be called if COM error occurs
Func _ErrFunc($oError)
    ; Do anything here.
    ConsoleWrite(@ScriptName & " (" & $oError.scriptline & ") : ==> COM Error intercepted !" & @CRLF & _
            @TAB & "err.number is: " & @TAB & @TAB & "0x" & Hex($oError.number) & @CRLF & _
            @TAB & "err.windescription:" & @TAB & $oError.windescription & @CRLF & _
            @TAB & "err.description is: " & @TAB & $oError.description & @CRLF & _
            @TAB & "err.source is: " & @TAB & @TAB & $oError.source & @CRLF & _
            @TAB & "err.helpfile is: " & @TAB & $oError.helpfile & @CRLF & _
            @TAB & "err.helpcontext is: " & @TAB & $oError.helpcontext & @CRLF & _
            @TAB & "err.lastdllerror is: " & @TAB & $oError.lastdllerror & @CRLF & _
            @TAB & "err.scriptline is: " & @TAB & $oError.scriptline & @CRLF & _
            @TAB & "err.retcode is: " & @TAB & "0x" & Hex($oError.retcode) & @CRLF & @CRLF)
EndFunc   ;==>_ErrFunc

 

Please, every comment is appreciated!
leave your comments and experiences here!
Thank you very much 

 

 

Edited Thursday at 03:13 PM by ioa747

[mLipok]

@ioa747 could you be so nice and share yours CS code over github ?

[ioa747]

I will make an attempt, as I have made an account, but I do not use it and I have no experience. 
For information, in the zip file the folder WebView2AutoIt\NetWebView2Lib is the solution folder from visual studio

Edited Friday at 05:46 PM by ioa747

[ioa747]

2 hours ago, mLipok said:

@ioa747 could you be so nice and share yours CS code over github ?

Done, I replaced it in the first post