Delphi EdgeBrowser Sample Project Fails

[vmishka 0]

I have a local HTML file on my HDD that draws a chessboard (the pieces can be moved to new squares by dragging) using a javascript library (chessboard.js). It opens and runs correctly in my Microsoft Edge Browser (Version 88.0.705.74 (Official Build - 64-bit)) when I double-click on it (see attached "Local file opens in Edge Browser.jpg").

 

I am using Delphi 10.4 Sydney (RAD Studio) under Windows 10. I would like to open that local file as a web page in a Delphi VCL application (64-bit) and have it function just like it does in my Edge Browser.

 

When I compile and run the Delphi "EdgeBrowser" Sample Project from Samples\Object Pascal\VCL\WebBrowser\Edge, the Form opens but I get an error -- "Failed to initialise Edge browser control" (see attached "Delphi Sample Project Fails.jpg"). I tried the Internet Explorer Sample app, choosing use Edge if available, otherwise IE." It opened IE (I got a message saying that the browser is out of date) on the Bing home page. When I pasted in the URL address of my local file as copied from the real Edge browser where it works fine, "file:///D:/Javascript%20Chess/chessboardExample.html" it doesn't load in the IE sample project. The IE browser tries to change the file name to "http://file///D:/Javascript%20Chess/chessboardExample.html" and I get the "Can't reach this page" message.

 

I have several questions:

 

(1) Is there anything I can do to get the TEdgeBrowser component working so that I don't get the "failed initialization" error?

(2) If and when TEdgeBrowser is working correctly, will I be able to open the local file by accessing the address that works in the real Edge browser?

(3) If I can open the local file correctly, will I be able to access the Javascript variables and process them in my Delphi code (e.g., when you move chess pieces around the chessboard reports the new position in what is called "FEN notation")? If so, how do I go about getting access to the Javascript variables in Delphi?

 

Thank you very much for any help.

[Der schöne Günther 316]

Did you read this?

Using TEdgeBrowser Component and Changes to the TWebBrowser Component - RAD Studio (embarcadero.com)

 

TL;DR: You need to install the WebView2 runtime, or a beta version of Edge, or ship your own files. Also, you must place the "WebView2Loader.dll" in your project directory, as explained in the wiki article above.

[vmishka 0]

Thank you, Günter. Getting EdgeView2 from GetIt AND installing the Edge Canary build solved the first problem. The sample project opens the TEdgeBrowser component without giving an error.

 

Unfortunately, the 2nd problem still exists (not to mention that I don't know if I will be able to access the Javascript variables within the Delphi code even if it does work).

 

In my normal Edge browser and in the Edge Canary build, I can paste in the location of my local file ("file:///D:/Javascript%20Chess/chessboardExample.html") and it opens and runs. In the sample application, when I paste that location into the edit box, it tries to convert the file address to an http: URL in the form of "http://file///D:/Javascript%20Chess/chessboardExample.html" and says "can't reach this page." Trying to edit the URL in the edit box back to the version that works in the normal browsers doesn't accomplish anything useful.

 

[Der schöne Günther 316]

Well, that's a stupid limitation of Embarcaderos example project, but not Edge itself:

 

  if not StartsText('http', URL) then
    URL := 'http://' + URL;

RADStudio10.4Demos/MainFormU.pas · Embarcadero/RADStudio10.4Demos (github.com)

Edited February 24, 2021 by Der schöne Günther

[vmishka 0]

Thank you again, Günther. Obviously, when I comment out those two lines, I can open the local file in the TEdgeBrowser Component and the Javascript runs as expected.

 

That just leaves me with my last question. Does anyone know how I would gain access to the data in the Javascript variables in my Delphi code so that I can process them (or is that even possible)? For example, you can see when I open the developer tools in the browser and inspect the console, there is information being logged with each move played on the board.