WebKitX ActiveX for CEF3

This is a Visual Studio 2015 C++11 MFC/ATL ActiveX that wraps Chromium Embedded Framework (CEF3) version 3.3202.1692 (Dec 2017) for use with OLE/COM languages such as Visual Basic 6.0 and VBA. Chromium Embedded Framework encapsulates WebKit Blink HTML5 Renderer and Google V8 JavaScript VM engine.

Downloads

Download WebKitX ActiveX for CEF3 version 1.0.5.1876 (19 Feb 2018)
MD5: b572cfd4536eedb1552625b84a04f1ce
SHA-1: c487fb1f64c0ff1b1991bc20884b2165a455b53d

Complete installation package for Windows 7, 8, 10 (x86, works on x64 too).
Includes WebKitX ActiveX 1.0.5.1876 (Feb 2018), CEF 3.3202.1692 binaries, and HTML5 Editor VB6 Sample (both source / binary).


CEF3 binaries bundle can be also downloaded separately from here:
http://opensource.spotify.com/cefbuilds/index.html#windows32_builds
* Tested with cef_binary_3.3202.1692.g18a939d_windows32


Microsoft x86 C++ 2015 Runtime must be installed on your computer. Can be also downloaded separately from here:
Microsoft Visual C++ 2015 Redistributable Update 3 RC


License Agreement:
mobileFX Software End-User License Agreement for WebKitX ActiveX Control

Release Notes

19 Feb 2018

12 Feb 2018

12 Jan 2018

Installation

Download the setup package and install it in a place like C:\Program Files (x86)\WebKitX and you are ready to start using the component.

Evaluation

You are welcome to evaluate WebKitX for as long as you want and feel free to contact us with your questions, your suggestions and your bounties!  During evaluation, when opening a URL and at random intervals WebKitX displays a message box informing you that it is a commercial product and that it requires a License, but it wont prevent you from using all its features.

Commercial License Activation

If you own a commercial license of WebKitX ActiveX control, you need to add in your program your License Key.
Add this line in your code: WebKitX1.Activate "your@email", "yourkey"

Commercial Distribution

If you distribute a LICENSED WebKitX ActiveX along with your applications, don't forget to include MS C++ 2015 x86 redistributables and CEF 3.x runtime. To register the ActiveX simply use: regsvr32 WebKitXCEF3.ocx. Obviously you are prohibited from distributing an unlicensed copy of WebKitX.

Key Features

Editions

Which WebKitX edition do I need?

WebKitX ActiveX ships in two flavors: HTML5 Browser-only for adding HTML5 browsing capabilities in your applications, and HTML5 Browser & Editor for adding HTML5 What-You-See-Is-What-You-Get editing capabilities to your applications. For checking-out WebKitX editing features we recommend running the compiled sample HTML5 Editor.

WebKitX Browser Edition

Please note that HTML5 Browser Edition of WebKitX allows you to open URLs, read/write HTML5, receive  HTML5 events in your application, but it does not support HTML manipulation, nor JavaScript injection, nor JavaScript execution (Eval, AddScript, AddCode). The intended use of the Browser Edition of WebKitX is to render HTML5 from within your application such as Web Sites, WebGL Games, Help Files and Documentation, Sales and other Reports, RSS and News Feeds, HTML5 Videos, Facebook, Twitter tweets, etc.

WebKitX Editor & Browser Edition

If your application requires HTML5 manipulation, rich text editing, and/or JavaScript injection and execution, please consider using the HTML5 Browser & Editor edition of WebKitX. Despite being an HTML5 Editor, the control offers you its Editing API even in Browser Mode.

Both WebKitX editions can launch Chrome Dev Tools, but they do not support Downloading of files, nor Popups.

WebKitX License

In a nutshell, a single License allows you to develop an unlimited numbder of applications linked with WebKitX ActiveX control and distribute them freely to an unlimited number of your customers. License Agreement: mobileFX Software End-User License Agreement for WebKitX ActiveX Control

Edition Commercial Use Price
WebKitX HTML5 Browser Yes £ 399
WebKitX HTML5 Editor Yes £ 999

Can I get the Source Code?

Yes you can! In fact we do not just give you the source code, we give you access to our git repository so that you can get all the latest fixes and features of our work in real-time.

Service Commercial Use Price
WebKitX Source Code Yes £ 25,000
Support Voucher / Bounty 1 hour £ 50

What is Support Voucher / Bounty?

If you desperately need a new feature implemented in WebKitX or immediately need a hotfix and can't wait until next release, you can contact us at info@mobilefx.com and negotiate with us a price, for which we will stop what we do and take care of what you need! The service is called a Bounty and applies only to existing Customers; for any edition of the ActiveX but only for its latest version (we do not branch per customer).

Just send us an email with what you need and our Account Manager will pass your request to our Tech Lead for Effort Estimation along with Technical Specs of the works to be done. Effort Estimation is in man hours and it is different from Duration. For example, to add a feature it might take our expects 8 hours to implement, but because we work on Sprints we might need a duration of one week to deliver.

The catch is that you participate in the process, being the primary Beta Tester! This phase is called User Acceptance Testing (UAT) and during this period you receive code-locked prototype revisions and provide us with valuable feedback, such as UAT observations and Defects. Once UAT is completed and you are satisfied with the result, you release us from the Bounty and we provide you with an Unlock Code as a token of our appreciation.

For corporate customers and long projects we collaborate using Jira.

WebKitX Architecture

WebKitX CEF3 ActiveX is a light-weight MFC ATL component for use with OLE/COM Programming Languages. At runtime the ActiveX starts CEF3XClient.exe process, passing to it its Window Handle (hWnd). 

CEF3XClient Process starts CEF3 Browser and Render sub-processes and establishes a seamless back-to-back Interprocess Communication Mechanism (IPC) between the ActiveX and all CEF3 processes. Chrome Browser is parented in ActiveX hWnd but lives in its own process.

All COM-based method and property calls between the ActiveX and CEF3XClients are marshalled using CoWaitForMultipleHandles, allowing your application's UI to be responsive. For time-consuming tasks, such as URL loading, COM events provide you callbacks when the tasks are finished. 

The important aspect of this architecture design is that all WebKit HTML5 rendering and V8 JavaScript execution are taking place outside your application, offering your application stability and isolation.

CSS3 Selector-based API

WebKitX provides you access to HTML DOM through a robust CSS3 selector-based API. (Selector example td:nth-of-type(3) > span:first-child). Selectors are used as arguments in editing and styling method calls and as targets in events. The ActiveX provides the selector of the currently selected element and the begin and end nodes of the current selection: ActiveElement, SelAnchorElement, SelFocusElement.

interface ISettings : IDispatch { // Client Process Settings WEBKITX_SETTING_BSTR(accept_language_list); WEBKITX_SETTING_BSTR(cache_path); WEBKITX_SETTING_BSTR(framework_dir_path); WEBKITX_SETTING_BSTR(javascript_flags); WEBKITX_SETTING_BSTR(locale); WEBKITX_SETTING_BSTR(locales_dir_path); WEBKITX_SETTING_BSTR(log_file); WEBKITX_SETTING_BSTR(resources_dir_path); WEBKITX_SETTING_BSTR(user_agent); WEBKITX_SETTING_BSTR(user_data_path); WEBKITX_SETTING_LONG(command_line_args_disabled); WEBKITX_SETTING_LONG(enable_net_security_expiration); WEBKITX_SETTING_LONG(ignore_certificate_errors); WEBKITX_SETTING_LONG(persist_session_cookies); WEBKITX_SETTING_LONG(persist_user_preferences); WEBKITX_SETTING_LONG(remote_debugging_port); WEBKITX_SETTING_LONG(uncaught_exception_stack_size); // Browser Settings WEBKITX_SETTING_BSTR(application_cache); WEBKITX_SETTING_BSTR(cursive_font_family); WEBKITX_SETTING_BSTR(default_encoding); WEBKITX_SETTING_BSTR(fantasy_font_family); WEBKITX_SETTING_BSTR(fixed_font_family); WEBKITX_SETTING_BSTR(sans_serif_font_family); WEBKITX_SETTING_BSTR(serif_font_family); WEBKITX_SETTING_BSTR(standard_font_family); WEBKITX_SETTING_LONG(default_fixed_font_size); WEBKITX_SETTING_LONG(default_font_size); WEBKITX_SETTING_LONG(minimum_font_size); WEBKITX_SETTING_LONG(minimum_logical_font_size); WEBKITX_SETTING_BOOL(databases); WEBKITX_SETTING_BOOL(file_access_from_file_urls); WEBKITX_SETTING_BOOL(image_loading); WEBKITX_SETTING_BOOL(image_shrink_standalone_to_fit); WEBKITX_SETTING_BOOL(javascript); WEBKITX_SETTING_BOOL(javascript_access_clipboard); WEBKITX_SETTING_BOOL(javascript_close_windows); WEBKITX_SETTING_BOOL(javascript_dom_paste); WEBKITX_SETTING_BOOL(local_storage); WEBKITX_SETTING_BOOL(plugins); WEBKITX_SETTING_BOOL(remote_fonts); WEBKITX_SETTING_BOOL(tab_to_links); WEBKITX_SETTING_BOOL(text_area_resize); WEBKITX_SETTING_BOOL(universal_access_from_file_urls); WEBKITX_SETTING_BOOL(web_security); WEBKITX_SETTING_BOOL(webgl); }; enum DOM_EVENTS { DOM_EVENT_NONE DOM_EVENT_CLICK DOM_EVENT_DBLCLICK DOM_EVENT_MOUSE_DOWN DOM_EVENT_MOUSE_MOVE DOM_EVENT_MOUSE_UP DOM_EVENT_KEY_DOWN DOM_EVENT_KEY_PRESS DOM_EVENT_KEY_UP DOM_EVENT_CUT DOM_EVENT_COPY DOM_EVENT_PASTE DOM_EVENT_SELECT DOM_EVENT_SELECTSTART DOM_EVENT_SELECTION_CHANGE DOM_EVENT_DOMFOCUSIN DOM_EVENT_DOMFOCUSOUT DOM_EVENT_DOMNODEINSERTED DOM_EVENT_DOMNODEREMOVED DOM_EVENT_DOMNODEINSERTEDINTODOCUMENT DOM_EVENT_DOMNODEREMOVEDFROMDOCUMENT DOM_EVENT_DOMSUBTREEMODIFIED DOM_EVENT_DOMCHARACTERDATAMODIFIED DOM_EVENT_EDITABLE_ELEMENT_CHANGED }; enum DOM_NODE_TYPES { DOM_NODE_TYPE_UNSUPPORTED = 0, DOM_NODE_TYPE_ELEMENT, DOM_NODE_TYPE_ATTRIBUTE, DOM_NODE_TYPE_TEXT, DOM_NODE_TYPE_CDATA_SECTION, DOM_NODE_TYPE_PROCESSING_INSTRUCTIONS, DOM_NODE_TYPE_COMMENT, DOM_NODE_TYPE_DOCUMENT, DOM_NODE_TYPE_DOCUMENT_TYPE, DOM_NODE_TYPE_DOCUMENT_FRAGMENT, }; enum EDIT_COMMANDS { EDIT_CMD_BACKCOLOR, EDIT_CMD_BOLD, EDIT_CMD_CONTENTREADONLY, EDIT_CMD_COPY, EDIT_CMD_CREATELINK, EDIT_CMD_CUT, EDIT_CMD_DECREASEFONTSIZE, EDIT_CMD_DELETE, EDIT_CMD_ENABLEINLINETABLEEDITING, EDIT_CMD_ENABLEOBJECTRESIZING, EDIT_CMD_FONTNAME, EDIT_CMD_FONTSIZE, EDIT_CMD_FORECOLOR, EDIT_CMD_FORMATBLOCK, EDIT_CMD_FORWARDDELETE, EDIT_CMD_HEADING, EDIT_CMD_HILITECOLOR, EDIT_CMD_INCREASEFONTSIZE, EDIT_CMD_INDENT, EDIT_CMD_INSERTBRONRETURN, EDIT_CMD_INSERTHORIZONTALRULE, EDIT_CMD_INSERTHTML, EDIT_CMD_INSERTIMAGE, EDIT_CMD_INSERTORDEREDLIST, EDIT_CMD_INSERTUNORDEREDLIST, EDIT_CMD_INSERTPARAGRAPH, EDIT_CMD_INSERTTEXT, EDIT_CMD_ITALIC, EDIT_CMD_JUSTIFYCENTER, EDIT_CMD_JUSTIFYFULL, EDIT_CMD_JUSTIFYLEFT, EDIT_CMD_JUSTIFYRIGHT, EDIT_CMD_OUTDENT, EDIT_CMD_PASTE, EDIT_CMD_REDO, EDIT_CMD_REMOVEFORMAT, EDIT_CMD_SELECTALL, EDIT_CMD_STRIKETHROUGH, EDIT_CMD_SUBSCRIPT, EDIT_CMD_SUPERSCRIPT, EDIT_CMD_UNDERLINE, EDIT_CMD_UNDO, EDIT_CMD_UNLINK, EDIT_CMD_UNSELECT, EDIT_CMD_USECSS, EDIT_CMD_STYLEWITHCSS, // CEFX - Table EDIT_CMD_TABLE_INSERT, EDIT_CMD_TABLE_DELETE, EDIT_CMD_TABLE_INSERT_ROW, EDIT_CMD_TABLE_INSERT_COL, EDIT_CMD_TABLE_REMOVE_ROW, EDIT_CMD_TABLE_REMOVE_COL, EDIT_CMD_TABLE_MERGE, EDIT_CMD_TABLE_SPLIT_HORIZ, EDIT_CMD_TABLE_SPLIT_VERT, // CEFX - Selection EDIT_CMD_SEL_GET_TYPE, EDIT_CMD_SEL_GET_COLLAPSED, EDIT_CMD_SEL_GET_CONTAINS_NODE, EDIT_CMD_SEL_GET_HTML, EDIT_CMD_SEL_SET_HTML, EDIT_CMD_SEL_GET_TEXT, EDIT_CMD_SEL_SET_TEXT, EDIT_CMD_SEL_GET_FONT_NAME, EDIT_CMD_SEL_GET_FONT_SIZE, EDIT_CMD_SEL_GET_FONT_COLOR, EDIT_CMD_SEL_GET_FONT_BACK_COLOR, EDIT_CMD_SEL_GET_FONT_STYLE, EDIT_CMD_SEL_GET_FONT_BOLD, EDIT_CMD_SEL_GET_FONT_ITALIC, EDIT_CMD_SEL_GET_FONT_UNDERLINE, EDIT_CMD_SEL_GET_FONT_STRIKETHROUGH, EDIT_CMD_SEL_SET_FONT_NAME, EDIT_CMD_SEL_SET_FONT_SIZE, EDIT_CMD_SEL_SET_FONT_COLOR, EDIT_CMD_SEL_SET_FONT_BACK_COLOR, EDIT_CMD_SEL_SET_FONT_BOLD, EDIT_CMD_SEL_SET_FONT_ITALIC, EDIT_CMD_SEL_SET_FONT_UNDERLINE, EDIT_CMD_SEL_SET_FONT_STRIKETHROUGH, EDIT_CMD_SEL_COLLAPSE_TO_END, EDIT_CMD_SEL_COLLAPSE_TO_START, EDIT_CMD_SEL_DELETE, EDIT_CMD_SEL_EMPTY, EDIT_CMD_SEL_EXTEND, EDIT_CMD_SEL_ALL_CHILDREN, // CEFX Other EDIT_CMD_GET_URL, }; dispinterface WebKitXCEF3 { properties: VARIANT_BOOL BrowserReady; VARIANT_BOOL Modified; DOM_EVENTS Events; BSTR HTML; BSTR URL; BSTR BaseURL; BSTR CurrentURL; OLE_HANDLE hWnd; OLE_HANDLE hWndBrowser; BSTR ActiveElement; BSTR SelAnchorElement; BSTR SelFocusElement; BSTR SelHTML; BSTR SelFontName; BSTR SelFontSize; BSTR SelFontColor; BSTR SelFontBackColor; BSTR SelText; BSTR SelType; VARIANT_BOOL SelCollapsed; VARIANT_BOOL SelFontBold; VARIANT_BOOL SelFontItalic; VARIANT_BOOL SelStrikeThrough; VARIANT_BOOL SelFontUnderline; VARIANT_BOOL ExecCommandSetFocus; VARIANT_BOOL SpellChecking; VARIANT_BOOL FormatUsingInternalSelectionAPI; BSTR DataSource; BSTR DataMember; BSTR DataField; VARIANT_BOOL UndoEnabled; LONG UndoSize; VARIANT_BOOL CanUndo; VARIANT_BOOL CanRedo; LONG RedoSize; VARIANT_BOOL UndoObserverEnabled; VARIANT_BOOL DownloadScripts; methods: void Create(); VARIANT_BOOL Activate(BSTR YourEmail, BSTR YourActivationKey); void Open(BSTR URL); void Edit(); void Preview(); void SaveHTML(BSTR FileName); void ShowDevTools(); void Repaint(); void ReplaceText(BSTR Find, BSTR Replace, VARIANT_BOOL IgnoreCase); void Print(); BSTR GetPreference(BSTR Name); void SetPreference(BSTR Name, BSTR Value); void NavigateBack(); void NavigateForward(); void StopLoading(); void AddScript(BSTR URL); void AddCode(BSTR JavaScript); BSTR Eval(BSTR Code); BSTR ExecCommand(EDIT_COMMANDS Command, BSTR Selector, BSTR Arguments); BSTR TidyHTML(BSTR HTML, BSTR Options); void AddEventListener(BSTR Selector, BSTR Event, LONG AddressOfEventHandler, VARIANT_BOOL UseCapture); void AddEventListenerEx(BSTR Selector, BSTR Event, IDispatch* vbObject, BSTR vbObjectFunctionName, VARIANT_BOOL UseCapture); void RemoveEventListener(BSTR Selector, BSTR Event, LONG AddressOfEventHandler, VARIANT_BOOL UseCapture); void RemoveEventListenerEx(BSTR Selector, BSTR Event, IDispatch* vbObject, BSTR vbObjectFunctionName, VARIANT_BOOL UseCapture); void SetAttribute(BSTR Selector, BSTR Name, BSTR Value); BSTR GetAttribute(BSTR Selector, BSTR AttrName); BSTR GetStyle(BSTR Selector, BSTR Setting, VARIANT_BOOL ComputedStyle); void SetStyle(BSTR Selector, BSTR Setting, BSTR Value); BSTR GetCssText(BSTR Selector, VARIANT_BOOL ComputedStyle); void SetCssText(BSTR Selector, BSTR CSSText); BSTR GetInnerHTML(BSTR Selector); void SetInnerHTML(BSTR Selector, BSTR HTML); BSTR GetOuterHTML(BSTR Selector); void SetOuterHTML(BSTR Selector, BSTR HTML); BSTR GetAttributes(BSTR Selector); void SetAttributes(BSTR Selector, BSTR Attributes); void RemoveAttribute(BSTR Selector, BSTR AttrName); void SelectElement(BSTR Selector, VARIANT_BOOL MoveCaret, VARIANT_BOOL SelectContents); void Deselect(); void SelCollapseToEnd(); void SelCollapseToStart(); VARIANT_BOOL SelContainsNode(BSTR Selector, VARIANT_BOOL PartialContainment); void SelDelete(); void SelEmpty(); void SelExtend(BSTR Selector, LONG Offset); void SelAllChildren(); void SelectTableColumn(BSTR TDSelector); void Delete(BSTR Selector); void SetSelection(LONG Offset, LONG Length); void GetSelection(BSTR Selector, LONG* Offset, LONG* Length); void DataBind(BSTR Selector); LONG Undo(); void ClearUndo(); LONG Redo(); LONG Commit(); }; dispinterface WebKitXCEF3Events { methods: void OnBrowserReady(); void OnLoadStart(); void OnLoadEnd(); void OnLoadError(LONG ErrorCode, BSTR ErrorMessage, BSTR FailedURL); void OnLoadingStateChange(VARIANT_BOOL IsLoading, VARIANT_BOOL CanGoBack, VARIANT_BOOL CanGoForward); void OnAddressChange(BSTR URL); void OnTitleChange(BSTR Title); void OnStatusChange(BSTR StatusText); void OnConsoleMessage(BSTR ConsoleMessage, BSTR Source, LONG Line); void OnTooltip(BSTR Tip); void OnFullscreenModeChange(BSTR Mode); void OnEvent(BSTR EventType, BSTR EventSelector, BSTR TargetSelector, BSTR TargetPath, BSTR EventData); void OnDeselect(); void OnUndo(BSTR HTML); void OnRedo(BSTR HTML); void OnUndoSave(); void OnScriptResourceCancelled(BSTR URL); void OnContextMenu(); void OnComPostMessage(VARIANT* Params); void OnCreate(ISettings* Settings, BSTR* CommandLineSwitches); };

WebKitX Initialization

Form_Load()

First you must activate WebKitX ActiveX by providing your License Key. If you are using early binding, a good place to do that is on Form_Load event. If you are using late binding you are advised to activate the control straight after its creation. This step applies only to license owners. During trial evaluation of WebKitX you may skip it.

Private Sub Form_Load()
    
    '*************************************************************
    'WebKitX1.Activate "your@email", "activation_key"
    '*************************************************************
    
    WebKitX1.Activate "epolitakis@mobilefx.com", "cd657adeafed48ff3e88a36ea9a327c3"
    
End Sub

WebKitX1_OnCreate(Settings, CommandLineSwitches)

Next you may control the creation of CEF3 Browser and Client Processes. OnCreate event provides you a Settings object that controls CEF3 Application and CEF3 Browser creation and initialization settings. The recommended defaults are preset in this object but you may want to provide your own settings such as Localization, Cache paths, Security settings, etc. The second parameter is CommandLineSwitches that are additional CEF3 preferences and even JavaScript flags that you want to provide to CEF3 Client Processes. 

For a list of command line switches please have a look here:  https://peter.sh/experiments/chromium-command-line-switches

Private Sub WebKitX1_OnCreate(ByVal Settings As WebKitXCEF3Lib.ISettings, CommandLineSwitches As String)

    ' Set the cache path
    Settings.cache_path = App.Path + "\MyCache"
    
    ' Set the application cache path
    Settings.application_cache = App.Path + "\MyAppCache"
    
    ' Enable cookies
    Settings.persist_session_cookies = 1
    
    ' Persistent user preferences
    Settings.persist_user_preferences = 1
    
    ' Additional switches, have a look here:
    ' https://peter.sh/experiments/chromium-command-line-switches/
    AddLog "CommandLineSwitches=" + CommandLineSwitches

End Sub

WebKitX1_OnBrowserReady()

OnBrowserReady event notifies you that CEF3 processes and WebKitX control have been successfully created and the Interprocess Communication Mechanism (IPC) is established. At this point you can define secondary behavioral parameters such as focus control, formatting APIs, script downloading control, etc. but most importantly after OnBrowserReady event you can successfully start loading URLs for browsing or editing.

On WebKitX you can either load a URL or feed it directly with HTML. Please note that providing a URL is recommended for successfully downloading relative resources such as Images, Style Sheets, Scripts, etc.

Private Sub WebKitX1_OnBrowserReady()
    
    ' Restore focus to WebKitX after a command is executed (form a menu or context menu)
    WebKitX1.ExecCommandSetFocus = True
    
    ' Enable mobileFX formatting vs. CEF3 formatting (Recommended)
    WebKitX1.FormatUsingInternalSelectionAPI = True
    
    ' Allow JavaScript download (sometimes scripts such as parallax mess with HTML5 styles)
    WebKitX1.DownloadScripts = True
    
    ' At this point we can open a URL!
    WebKitX1.Open "file:///my_path/index.html"
    
End Sub

WebKitX1_OnLoadEnd()

OnLoadEnd event is fired when your URL is completely downloaded. At this point you can enable HTML5 Editing or Preview (Browsing) and set the HTML DOM events you want WebKitX to subclass for every HTML Element on the document. After you receive this event you can start using the Selection and Formatting APIs.

Private Sub WebKitX1_OnLoadEnd()
    
    ' Control Edit or Preview
    If mnuEditable.Checked Then
        WebKitX1.Edit
        WebKitX1.Modified = False
    Else
        WebKitX1.Preview
    End If
    
    ' Hook HTML DOM Events (fires OnEvent)
    WebKitX1.Events = DOM_EVENT_SELECTSTART Or _
                      DOM_EVENT_DOMSUBTREEMODIFIED Or _
                      DOM_EVENT_DOMFOCUSIN Or _
                      DOM_EVENT_CLICK Or _
                      DOM_EVENT_EDITABLE_ELEMENT_CHANGED
    
End Sub

Setting CEF3 Preferences at Runtime

WebKitX offers GetPreference() and SetPreference() methods to read / modify CEF3 preferences at run-time. Please note that setting preferences causes CEF browser to recreate and it is time-costly, so use it with caution, especially when synchronizing WebKitX HTML with a Code Editor (like HTML5 Pad does). For example to enable / disable Spell Checking, WebKitX uses an internal Boolean latch in order to avoid browser recreation and you should use WebKitX1.SpellChecking = true instead of SetPreference("browser.enable_spellchecking", "true").

For a list of preference please have a look here: https://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/pref_names.cc?view=markup

HTML DOM to COM Events

Synchronization of COM and IPC

HTML DOM Events are generated by WebKit Blink Engine and are copied into an immutable format before they are transmitted from CEFXClient process to WebKitX ActiveX. Once WebKitX ActiveX receives an event notification through IPC, it fires a COM Event with the copied data of HTML DOM event. Thus, CEFXClient process does not block waiting for your client code to handle the event.  WebKitX DOM Events are Immutable, meaning that you can only read event data but you cannot cancel events, stop them from bubbling or prevent default behavior. 

For a single-threaded EXE and from a scheduling point of view, WebKitX DOM to COM Events are synchronous by design. Once a DOM Event is received in IPC WndProc, the COM event is  immediately fired on the Main Thread and the IPC channel is blocked until your event handler is executed. However, if your event handler needs to call WebKitX Methods, you might need to call DoEvents first to unblock the IPC.

Listening to HTML DOM Events

You can use addEventListener and removeEventListener for attaching and detaching on HTML DOM events. WebKitX offers two methods:

The signature of the public methods is defined by OnEvent event which is:

EventData are a JSON string representation of DOM Event:

{ "eventName": "click", "eventType": "[object MouseEvent]", "altKey": false, "bubbles": true, "button": 0, "buttons": 0, "cancelBubble": false, "cancelable": true, "clientX": 86, "clientY": 178, "composed": true, "ctrlKey": false, "currentTarget": "", "defaultPrevented": false, "detail": 1, "eventPhase": 1, "fromElement": "", "isTrusted": true, "layerX": 86, "layerY": 178, "metaKey": false, "movementX": 0, "movementY": 0, "offsetX": 86, "offsetY": 89, "originalTarget": "", "pageX": 86, "pageY": 178, "path": "#lga", "relatedTarget": "", "returnValue": true, "screenX": 566, "screenY": 415, "shiftKey": false, "srcElement": "#lga", "sourceCapabilities": {}, "target": "#lga", "timeStamp": 8625.205000000002, "toElement": "#lga", "type": "click", "which": 1, "x": 86, "y": 178, "region": null, }
{ "eventName": "mousemove", "eventType": "[object MouseEvent]", "altKey": false, "bubbles": true, "button": 0, "buttons": 0, "cancelBubble": false, "cancelable": true, "clientX": 136, "clientY": 1, "composed": true, "ctrlKey": false, "currentTarget": "", "defaultPrevented": false, "detail": 0, "eventPhase": 1, "fromElement": "", "isTrusted": true, "layerX": 136, "layerY": 1, "metaKey": false, "movementX": -1, "movementY": -2, "offsetX": 136, "offsetY": 1, "originalTarget": "", "pageX": 136, "pageY": 1, "path": "#viewport", "relatedTarget": "", "returnValue": true, "screenX": 616, "screenY": 238, "shiftKey": false, "srcElement": "#viewport", "sourceCapabilities": {}, "target": "#viewport", "timeStamp": 276604.28, "toElement": "#viewport", "type": "mousemove", "which": 0, "x": 136, "y": 1, "region": null, }

DOM Events Code Example

WebKitX Events Sample demonstrates handling DOM events and reading values from Input elements. In the following code fragment are demonstrated the three (3) different methods you can use. The generic method, the AddressOf method that requires a Module, and the IDispatch method that requires an Object. The sample loads a INPUT element and a BUTTON and when you click the button it fires an event which is handled by VB6. The event handler code in VB6 uses WebKitX API to read the value of the INPUT.



WebKitX Samples

WebKitX HTML5 Editor (VB6)

This is a simple, yet complete, sample of WebKitX CEF3 ActiveX control. The sample is shipped both as Visual Basic 6 source code project, as well as a complete binary bundle that includes CodeMax Editor ActiveX and CEF3 binaries. The sample demonstrates all WebKitX advanced features including FrontPage-like selection synchronization between HTML5 Designer and Source Editor, Table Editing, Selector API, and advanced CSS3 styling. The binary bundle can be used as a royalties-free stand-alone HTML5 Editor.





Simple Browser (VB6)

This sample demonstrates the WebKitX Browser Edition (no editing possible). You can embed WebKitX in your applications with just 3 lines of code!

History

On December 2014 mobileFX open sourced on GitHub WebKitX based on CEF1: Chromium Embedded Framework (CEF1) ActiveX Wrapper (Dec 2014). Since then we received tons of requests (and bounties) from Visual Basic 6 programmers for a CEF3 version of our ActiveX. Since CEF1 and CEF3 have completely different architectures, we decided to write the new ActiveX from scratch. At the same time we wanted CEF3 WebKitX to be suitable for commercial products and HTML5 Editors (such as Coconut2D) and designed several innovative features for it. 

On December 2017 we decided to finally implement the CEF3 version of WebKitX as an affordable commercial solution, with proper support. WebKitX for CEF3 has quite some unique innovations on it, such as the back-to-back COM-to-IPC bus implementation, care for multithreading and our own HTML5 editing and selection engine that we will keep evolving.