After searching the web, I found that the DCEF3 sources already come with a demo on how to show these tools and also show them externally using Google Chrome (which of course must be installed for this to work).
It’s actually quite simple:
The first thing to do is set the port for remote debugging to something else but 0. This must be done before the Chromium Embedded library is being initialized, e.g. in the initialization section of the form that uses it.
initialization CefRemoteDebuggingPort := 9000;
Then you need a Chromium browser window to display the tools, that is, a second TChromium control which can reside either on the same form or on a different form, or even in a different application (like Google Chrome). I chose to go with the first option because it is the least hassle. My TChromium control was set to alClient, so I just added a TSplitter and another TChromium control, set to alBottom to it and set both to Visible=false by default.
Now, to show the Developer Tools, there is only very little code:
procedure TMyForm.SetDebugToolsEnabled(_Value: Boolean); begin chr_Debug.Visible := _Value; spl_Debug.Visible := _Value; if _Value then begin if not FDevToolLoaded then begin chr_Debug.Load(chr_Embedded.browser.Host.GetDevToolsUrl(True)); FDevToolLoaded := True; end; end; end;
Where chr_Embeeded is the TChromium control that displays the actual content my programs uses and chr_Debug is the TChromium control that shows the Developer Tools.
Much easier than I originally thought, but far from obvious if you don’t know that the Devoloper Tools are just another browser window (which I didn’t).