Notas sobre el uso del componente TWebBrowser en Delphi 7

Empecé a usar el componente TWebBrowser para mostrar el tema de ayuda en mis programas. En esta versión, es bastante simple: colocamos los archivos html habituales en una carpeta y, si es necesario, llamamos a WebBrowser.Navigate(HelpDir + ‘index.html’);
html ya contiene todo lo que su corazón desea, con imágenes, referencias cruzadas y scripts disponibles para Internet Explorer.

Todo se volvió mucho más interesante cuando quería mostrar información de la base de datos a través de ella y también hacer cambios mediante programación en la página mostrada. Al final resultó que, todo esto es posible.

La inserción de CSS se resuelve de serie en la web, por ejemplo añadiendo antes del cuerpo:

<style type="text/css">
table {
  border-collapse: collapse; 
  border-color: #E0E0E0;
  font-size:x-small;
}
td {
  border: 1px solid;
  padding: 2px;
}
</style>

Muestra cualquier código HTML que se pasa a TWebBrowser. Esto se hace así:

var
  Doc: Variant;
begin
  if NOT Assigned(wBrowser.Document) then
    wBrowser.Navigate('about:blank');
  Doc := wBrowser.Document;
  Doc.Clear;
  Doc.Write('Hello World');
  Doc.Close;
end;

Rebobine la página hasta el final inmediatamente después de la descarga. Esto se resuelve agregando JavaScript al final de la página (es posible después del cuerpo):

<script>window.scrollTo(0,document.body.scrollHeight);</script>

Ejecute el código JavaScript:

var
  Doc: Variant;
begin
  if NOT Assigned(wBrowser.Document) then
    wBrowser.Navigate('about:blank');
  Doc := wBrowser.Document;
  Doc.parentWindow.execScript('alert("Hello World");', 'JavaScript');

Leer valor de atributo como este:

function GetElementIdValue(WebBrowser: TWebBrowser; TagName, TagId, TagAttrib: string):string;
var
  Document: IHTMLDocument2;
  Body: IHTMLElement2;
  Tags: IHTMLElementCollection;
  Tag: IHTMLElement;
  I: Integer;
begin
  Result:='';
  if not Supports(WebBrowser.Document, IHTMLDocument2, Document) then
    raise Exception.Create('Invalid HTML document');
  if not Supports(Document.body, IHTMLElement2, Body) then
    raise Exception.Create('Can''t findelement');
  Tags := Body.getElementsByTagName(UpperCase(TagName));
  for I := 0 to Pred(Tags.length) do begin
    Tag:=Tags.item(I, EmptyParam) as IHTMLElement;
    if Tag.id=TagId then Result := Tag.getAttribute(TagAttrib, 0);
  end;
end;

// EXAMPLE OF USE OF THE FUNCTION:
Result := GetElementIdValue(WebBrowser1, 'input', 'result', 'value');

Y al fin lo más interesante - ¿cómo pasar del código javascript en la página al evento o la información en el código Delphi? Para hacer esto, puede hacer clic en el enlace dentro de HTML e interceptar este evento en el controlador OnBeforeNavigate2, luego analizar la URL y extraer la información necesaria de esta línea. Es natural no olvidar "Cancel: = true;" si no necesita el navegador para seguir este enlace. Es mejor para este método de transferencia de información y eventos proporcionar un prefijo especial en la dirección, por cuya presencia es necesario determinar si se procede. Controlador de ejemplo:

procedure TMyForm.WebBrowserBeforeNavigate2(Sender: TObject; const pDisp: IDispatch; var URL, Flags, TargetFrameName, PostData, Headers: OleVariant; var Cancel: WordBool);
var
  pre: string;
  p: Integer;
begin
  p := pos(':', URL);
  if p > 0 then begin
    pre := Copy(URL, 1, p-1);
    if pre = 'event' then begin
      ShowMessage(Copy(URL, p+1, length(URL)-p));
      Cancel := TRUE;
    end;
  end;
end;

El código que envía información aquí puede ser por ejemplo:

<input id="testButton" type="button" value="test" />