White Papers
WebView2 - Copy Highlighted Text?
Gravatar is a globally recognized avatar based on your email address. WebView2 - Copy Highlighted Text?
  Steve
  All
  Aug 24, 2022 @ 11:49am

Hi Rick, I searched your Webview2 whitepaper but did not see an answer to this particular question. Just wondering, capturing the highlighted text with the old IE Control was easy with: ```txt

ThisForm.oBrowser.ExecWB(12, 2, 0, 0)

Is there a similar option for the WebView2 control?

TIA,
Steve

Gravatar is a globally recognized avatar based on your email address. re: WebView2 - Copy Highlighted Text?
  Rick Strahl
  Steve
  Aug 24, 2022 @ 12:27pm

No you can't do that in that fashion - you have to execute JavaScript code to capture the clipboard and then return the value.

What type of code am I looking at here? FoxPro? If so you can't instantiate a WebView control in FoxPro.

+++ Rick ---

Gravatar is a globally recognized avatar based on your email address. re: WebView2 - Copy Highlighted Text?
  Steve
  Rick Strahl
  Aug 24, 2022 @ 12:43pm

Yes, it's Foxpro. I'm using the AntView Control that is an ActiveX Wrapper for WebView. So far it's working fine. Very similar to your examples with the IE Control. Now trying to figure out how to capture the highlighted text to the clipboard. AntView support also mentioned using Javascript.

The scenario is:

  1. User highlights text in the AntView/Webview control and clicks a VFP button.
  2. When the button is clicked, I want to capture the highlighted text to the Clipboard and proceed.

The Javascript examples I've seen thus far don't make much sense, or capture the entire page. I need just the highlighted text. Any thoughts on how to do this with Javascript?

Thanks again,
Steve

Gravatar is a globally recognized avatar based on your email address. re: WebView2 - Copy Highlighted Text?
  Rick Strahl
  Steve
  Aug 24, 2022 @ 03:56pm

There's no direct DOM access through the WebView so everything that you do has to be done with scripting via ExecScript() (and callback events it looks like for the ActiveX version).

+++ Rick ---

Gravatar is a globally recognized avatar based on your email address. re: WebView2 - Copy Highlighted Text?
  Harvey Mushman
  Steve
  Aug 26, 2022 @ 05:58am

I'm getting to this thread late and have not used WebView2 or AntView control but having done a little work in this field a long time ago Optical character classification... I'm wondering a bit more about the question.

  1. Is the document being viewed a bitmap image or character based text?

  2. Does the application include creating the highlighted regions or do the documents get loaded into the application from unknown sources with highlights already embedded?

Assuming the document is HTML and is under your control at the time the highlighting occurs, using JavaScript to find the regions seems like a fairly straight forward search for any element that has an attribute with a CSS background-color set to anything other than the Body:background-color. Then find the matching ending element and apply a substr() extract for the characters between the start and end elements.

But the key is being in control of the element that is used to highlight the text.

If you are not in control of the creation of the highlight then you need to find someway to identify how the highlight occurs. For example, can you encounter bold or italic text (assuming < b > some highlight text < /b > or < i > some highlight text < /i > ) with a CSS attribute setting the background-color that is NOT the text you are looking for. It seems without knowing more about your application it is hard to guess how to locate the highlight regions but it seems on the cover to find the CSS background-color and then assume all elements with the class are highlighted and extract the text.

Sounds like fun, good luck!

Gravatar is a globally recognized avatar based on your email address. re: WebView2 - Copy Highlighted Text?
  Steve
  Harvey Mushman
  Aug 26, 2022 @ 09:24am

Hi Harvey,
Thanks for the input. I posed the same question to Antview Support and they provided a VB Sample that actually pointed me in the right direction. Turns out, it was fairly easy to do. Here is the call to ExecuteScript to capture the current user selected/highlighted text:

ThisForm.oAntView.ExecuteScript("window.getSelection().toString()")

The above line captures the highlighted text and sends it to oAntview.OnExecuteScript as Json. Then, within oAntview.OnExecuteScript(), I place VFP Code to capture the info in the Json object.

Per your questions, I have no control over the webpage. The user simply highlights the part number they need and then clicks a button on the VFP Form, the same form that hosts the Antview control. The VFP Form then calls the above command to capture the part number and continues with some other processing.

I used the old IE ActiveX control for years doing the same thing with the help of Rick's books and whitepapers. Now, more and more websites are starting to not work with the IE ActiveX control. So, now I am trying to do the same thing with Antview (Webview2 Wrapper).

Thanks,
Steve

Gravatar is a globally recognized avatar based on your email address. re: WebView2 - Copy Highlighted Text?
  Harvey Mushman
  Steve
  Aug 26, 2022 @ 05:28pm

Good to hear you solved it with a simple solution.

For what it is worth, I recently created a Browser application that needed a text editor and besides being a rich editor with highlighting TipTap stores the document in html. With JavaScript and a REST server it would be very easy to extract the highlighted text using the CSS className and then pass it back to the server.

© 1996-2022