RAD Studio 10.4 brings support for working with web content through a new Chromium-based Edge browser control in VCL applications. The new TEdgeBrowser component wraps the Microsoft WebView2 component. TEdgeBrowser supersedes TWebBrowser, which uses the Internet Explorer web browser control. However, TWebBrowser remains in the VCL and FMX component sets, with some notable changes & enhancements (see below).

TEdgeBrowser Requirements

Because TWebBrowser uses the Operating System-supplied Internet Explorer web browser control there is no preparation required – it will work wherever Windows has the Internet Explorer control available. On the contrary, Microsoft Edge is not an Operating System component (not yet, anyway). Also, it is still not officially released. Because of this, you need to ensure that these items are installed on your computer before you can run an application that uses it:

• The Microsoft Edge Chromium-based browser is currently available from Edge Insider channels (Update: the main Edge release uses Chromium now, but you still need the beta browser installed).
• The WebView2 control, currently available through NuGet or via the GetIt package manager

For the time being, the Edge Beta requirement applies to you compiling and executing the application on your development machine and also on the end user’s machine. As for the WebView2, all you need is the WebView2Loader.dll to be distributed along with your program. Both are Microsoft requirements, and they might change with the official release.

Once you have installed Edge (Beta version) to install the required Microsoft WebView2 SDK package you open the GetIt package manager window in the RAD Studio 10.4 IDE and search for the corresponding entry, as indicated below:

Once you have installed the package, it will copy in your RAD Studio redistributable folder the DLL required by your application, one for 32-bit apps and one for 64-bit apps (both are called WebView2Loader.dll). You will need to copy these DLLs in your build target folders or someone on the search path.

Using the Edge Browser component

You use the TEdgeBrowser component in much the same way as you would use a TWebBrowser, indeed a number of methods and properties are similar to those of TWebBrowser’s methods and properties. Drop the component on a VCL form and size it as appropriate, as in the simple case below:

To navigate to a URL simply pass that URL to the Navigate method:

That’s all, run the application and you see the following output:

And What About TWebBrowser?

The VCL TWebBrowser component still performs the same job as always, which is to render web content using the Internet Explorer TWebBrowser browser control. However, in addition to this default behavior it has a new property, SelectedEngine, which can be used to ask it to use the newer Edge (Chromium) WebView2 browser control instead if available on the target machine.

The advantage is to have a single browser control that can work on all Windows computers, and also a higher level of compatibility (in terms of browser component of methods and properties used) with the existing code. The advantage of the new Edge control is you have more power to customize this new engine.

Conclusion

I’m very happy RAD Studio introduced the TEdgeBrowser component in the 10.4 release, but this is not the only new VCL control in 10.4. We have been focusing a lot on our Windows component library for 10.4. I’m very happy with the outcome, and I know you will be too!

RAD Studio 10.4 Sydney is now available! Download your free 30-day trial from our website!