4

I am using a TWebBrowser to display a web page that is created in Vue, but I currently have no way to debug situations where functionality of the page works in a browser (IE and Chrome) but does not work from the TWebBrowser. I am looking for a way to access the web console or dev tools from within Delphi when displaying a TWebBrowser so that I can determine what exactly is preventing functionality of a page from working.

I have tried to implement a TDeveloperConsoleMessageReceiver class that uses the IDeveloperConsoleMessageReceiver interface. This class is created when the TWebBrowser is initialized. Then on TWebBrowserDocumentComplete I implemented the following function:

procedure TTTWebBrowser.WebBrowserDocumentCompleted(ASender: TObject; const pDisp: IDispatch; const URL: OleVariant);
var
   Target : IOleCommandTarget;
   Action : Cardinal;
   Params : OleVariant;
const
   IDM_ADDCONSOLEMESSAGERECEIVER = 3800;
   CGID_MSHTML: TGUID = '{DE4BA900-59CA-11CF-9592-444553540000}';
begin
   CallUserDocumentCompletedEvent(pDisp, URL);
   if Assigned(WebBrowser.Document) then begin
     Target := IOleCommandTarget(WebBrowser.Document);
     Action := IDM_ADDCONSOLEMESSAGERECEIVER;
     Params := EmptyParam;
     Target.Exec(@CGID_MSHTML, Action, OLECMDEXECOPT_DODEFAULT, IDeveloperConsoleMessageReceiver(DeveloperConsole), Params);
   end;
end;

Where DeveloperConsole is the DeveloperConsoleMessageReceiver class created on initialization. When the above function is run I get an access violation on the Exec.

How would I properly utilize DeveloperConsoleMessageReceiver or is there another way to debug a TWebBrowser from within Delphi?

Ken White
  • 123,280
  • 14
  • 225
  • 444
PleaseHelpMePlease
  • 41
  • 2
  • Not an answer but normally functionality between The activeX component (Twebbrowser is a wrapper) and IE is the same. One caveat is that TWebbrowser starts in IE7 mode, causing most modern webpages to malfunction. You must set the FEATURE_BROWSER_EMULATION flag to change this mode. More info can be found here – whosrdaddy Dec 24 '20 at 08:29
  • And don't forget about the good old `alert()` function. – Olivier Dec 24 '20 at 08:51
  • @Olivier: Yes, but that will only work if you have the webpage contents under control. – whosrdaddy Dec 24 '20 at 10:04
  • By Default TBwebBrowser is working in IE7 Compatibility Mode. In order to make it run in Full Mode you need to opt in to the Browser emulation. You can read on how to do this [here](https://stackoverflow.com/a/25843958/3636228). After this webapges should be working in TWebBroswer same as they do in Internet Explorer. – SilverWarior Dec 25 '20 at 03:37
  • I verified the browser is in IE11 mode and made sure the FEATURE_BROWSER_EMULATION registry is set to 11000. Almost all functionality is the same between IE and the Delphi browser. Alerts, Tables, Etc show up just fine but I am trying to leverage this draggable library found [here](https://sortablejs.github.io/Vue.Draggable/#/simple) and the actual dragging of components is what works in IE but not in the Delphi browser. – PleaseHelpMePlease Dec 28 '20 at 15:13

1 Answers1

0

I use NavigateComplete2 event and it works. Here is my code:

procedure TMainForm.WBNavigateComplete2(ASender: TObject;
  const pDisp: IDispatch; var URL: OleVariant);
const
  CGID_MSHTML: TGUID = '{DE4BA900-59CA-11CF-9592-444553540000}';
  IDM_ADDCONSOLEMESSAGERECEIVER = 3800;
var
  vin, vout: OleVariant;
begin
  if FDebugConsole then // Call it only once
    Exit;
  vout := Null;
  vin := Self as IDeveloperConsoleMessageReceiver;
  (WB.Document as IOleCommandTarget).Exec(@CGID_MSHTML, IDM_ADDCONSOLEMESSAGERECEIVER, OLECMDEXECOPT_DODEFAULT
    ,vin, vout);
  FDebugConsole := True;
end;

You have to call IDM_ADDCONSOLEMESSAGERECEIVER only once and later you can navigate to other pages and console messages will continue to arrive. My main form implements IDeveloperConsoleMessageReceiver interface.

user1439838
  • 111
  • 5