WPF WebBrowser not render external html content properly - c#

In WPF application the WebBrowser control doesn't render external html url properly.
While source assigned with external url, page get loaded.
But html hover effects & svg animations are not working.
Stuck at this point (VisualStudio 2015 environment).
Help me to step up.
Thanks in advance.
<StackPanel>
<WebBrowser Source="https://www.amcharts.com/demos/simple-pie-chart/"
OverridesDefaultStyle="False" MaxHeight="500"/>
</StackPanel>

If I understand correctly, you can not modify the HTML content of the web page.
You can use the following trick instead:
In registry:
Go to HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Internet Explorer\MAIN\FeatureControl\FEATURE_BROWSER_EMULATION for 64-bit or 32-bit only machines.
Create a new DWORD key, and name it the name of your application e.g. "myapp.exe" and then edit the value of the key. There are many different values you can add depending on the IE version you want to emulate. I entered 11001 (as a decimal value - 0x2AF9 in HEX) which emulates IE 11 (many more values located at: http://msdn.microsoft.com/en-us/library/ee330730%28v=vs.85%29.aspx#browser_emulation).

Related

C# WPF Selenium3 with Geckofx newest Version

Hi what I like to do is:
Create in WPF xaml a Grid like that: <_Grid Name="gridWeb">
Open a GeckoFX45 Firefox Browser in this Grid (add the created Geckofx Window as Child to the grid)
Automate this exact Browser in my Grid with Selenium.
I have made a lot of researches on that Problem and I found some articles like https://nhabuiduc.wordpress.com/2014/09/18/geckofx-net-webbrowser-setup-and-features/ on how to solve my issue. With that article I had success to solve point 1 and 2 but with old Version of Geckofx.
I have tried out tons of things, but nothing which included all requirements for my Tool.
Does anyone know if this is even possible?
If yes, does anyone know on how to combine all those 3 requirements with an actual version of Geckofx 45?
Is there any particular reasony why you want to add this browser to Selenium IWebDriver? (like e.g. lots existing code written for IWebDriver?)
If not and you simply want to have an automated browser then you can do much more automation using GeckoFx API.
For example:
GeckoWebBrowser Browser => GetBrowserInstanceSomehow();
...
//get element reference
GeckoInputElement textBox =
this.Browser.Document.GetElementsByClassName("inputBox").FirstOrDefault() as GeckoInputElement;
//set value
textBox.Value = "Something";
GeckoHtmlElement btn = this.Browser.Document.GetElementById("submitButton") as GeckoHtmlElement;
//interact
btn.Click();
You can do virtually everything with it - execute scripts, send POST requests, override CSS, evaluate / change / remove nodes, navigate, handle navigation events etc.

How can I get the WebBrowser control to show modern contents?

I've created a Winforms app that uses a WebBrowser control; I dynamically assign its Uri. It worked fine for awhile, but now I'm getting this msg:
You seem to be using an unsupported browser. Older browsers can put your security at risk, are slow and don't work with newer Google Maps features. To access Google Maps, you'll need to update to a modern browser.
The last two words are a link, and following that link, I see:
You are currently using...
IE 11
So, okay, the WebBrowser component uses IE 11; how can I change that?
My machine is set to use Chrome as its browser; perhaps the control should use whatever your current browser is? I don't know if that's possible/feasible.
UPDATE
Okay, I'm willing to give Reza's suggestion a try. But when I navigate to the specified spot in regedit, and right-click in the right pane to add a New entry, it has three options:
Key, String Value, Binary Value
I reckon the string values are the ".exe" strings, and the Binary values are the "dword" vals, but what should the "Key" values be?
Note: The post is about WebBrowser control, however, for all the new
.NET projects the main solution is using
WebView2.
To learn more, take a look at this post:
Getting started with WebView2.
WebBrowser Control
The WebBrowser control uses the same Internet Explorer version which is installed on your OS but it doesn't use the latest document mode by default and shows content in compatibility mode.
Symptom - As a symptom, the site works properly in Internet Explorer or other browsers, but WebBrowser control doesn't show the site well and for some sites it shows script errors.
Solution - You can tell the WebBrowser control to use the latest document mode without compatibility mode in WebBrowser control. You can follow instructions here to disable the setting using registry.
[Reference: Browser Emulation]
Apply Browser Emulation setting using code
If you want to apply the settings using code, run the following code once:
using (var key = Microsoft.Win32.Registry.CurrentUser.OpenSubKey(
#"Software\Microsoft\Internet Explorer\Main\FeatureControl\FEATURE_BROWSER_EMULATION",
true))
{
var app = System.IO.Path.GetFileName(Application.ExecutablePath);
key.SetValue(app, 11001, Microsoft.Win32.RegistryValueKind.DWord);
key.Close();
}
In above code, I've used 11001 which means IE11 Edge mode.
Internet Explorer 11. Webpages are displayed in IE11 edge mode,
regardless of the declared !DOCTYPE directive. Failing to declare a
!DOCTYPE directive causes the page to load in Quirks.
Apply the Browser Emulation setting manually
Open Registry editor and browse HKEY_CURRENT_USER, go to the following key:
Software\Microsoft\Internet Explorer\Main\FeatureControl\FEATURE_BROWSER_EMULATION
Add the following values:
"YourApplicationFileName.exe"=dword:00002af9
"YourApplicationFileName.vshost.exe"=dword:00002af9
(In older versions of Visual Studio you needed to add vshost.exe value as well, when you run your program in Visual Studio.)
To create entries right click on an empty area of the right pane, then in the window which appears after selecting dword value, choose hexadecimal and enter 2af9:
In above steps, I've used 11001 which means IE11 Edge mode.
Use WebViewCompatible Control for Windows Forms
You can also use the new WebViewCompatible control for Windows Forms. You can see simple steps to use here: Replace WebBrowser control by new WebView Compatible control for Windows Forms.
WebViewCompatible uses one of two rendering engines to support a broader set of Windows clients:
On Windows 10 devices, the newer Microsoft Edge rendering engine is used to embed a view that renders richly formatted HTML content from a remote web server, dynamically generated code, or content files.
On devices running older versions of Windows, the System.Windows.Controls.WebBrowser is used, which provides Internet Explorer engine-based rendering.
Note: WebView2 is a replacement for WebView and WebViewCompatible.
Set X-UA-Compatibile meta tag
In case that you have access to the html content of the page and you can change the content (for example it's a local html file, or the site belong to yourself) then you can set X-UA-Compatibile meta tag in the head like: <meta http-equiv="X-UA-Compatible" content="IE=Edge" />.
Use other Browser Controls
You can rely on other browser controls like CefSharp.
In my case for embedded custom protocol on an application, I will allow only to browse pages served by the application, and no content from the outside, so I wanted to skip saving to the Windows Registry. When I tested after following Reza Aghaei answer and found that you can change the compatibility mode from within the content page. This will skip the need to configure a registry key, but you will have to add it to every page.
For changing the compatibility mode of a page, you must add a meta tag for it to be applied by the rendering engine:
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
</head>
<body>
...
</body>
</html>
The below procedures will add the correct key and remove it again.
Call the CreateBrowserKey upon loading the form that your web browser is in.
Then when closing the form, call the RemoveBrowserKey
Private Sub CreateBrowserKey(Optional ByVal IgnoreIDocDirective As Boolean = False)
' Dim basekey As String = Microsoft.Win32.Registry.CurrentUser.ToString
Dim value As Int32
' Dim thisAppsName As String = My.Application.Info.AssemblyName & ".exe"
' Value reference: http://msdn.microsoft.com/en-us/library/ee330730%28v=VS.85%29.aspx
' IDOC Reference: http://msdn.microsoft.com/en-us/library/ms535242%28v=vs.85%29.aspx
Select Case (New WebBrowser).Version.Major
Case 8
If IgnoreIDocDirective Then
value = 8888
Else
value = 8000
End If
Case 9
If IgnoreIDocDirective Then
value = 9999
Else
value = 9000
End If
Case 10
If IgnoreIDocDirective Then
value = 10001
Else
value = 10000
End If
Case 11
If IgnoreIDocDirective Then
value = 11001
Else
value = 11000
End If
Case Else
Exit Sub
End Select
Microsoft.Win32.Registry.SetValue(Microsoft.Win32.Registry.CurrentUser.ToString & BrowserKeyPath, _
Process.GetCurrentProcess.ProcessName & ".exe", _
value, _
Microsoft.Win32.RegistryValueKind.DWord)
End Sub
Private Sub RemoveBrowserKey()
Dim key As Microsoft.Win32.RegistryKey
key = Microsoft.Win32.Registry.CurrentUser.OpenSubKey(BrowserKeyPath.Substring(1), True)
key.DeleteValue(Process.GetCurrentProcess.ProcessName & ".exe", False)
End Sub
The C# WebBrowser class is a basically a IE wrapper and because of this it cannot be changed.
See this link:
The WebBrowser control is a managed wrapper around a component installed with Internet Explorer.
For alternatives you can check out
WebKit.NET
GeckoFX

How to display HTML article in app? WinRT

I'm creating client-side WP 8.1(appx) app for one website.
Well, let's say that I got html code of some article(with images, lists etc), only article(without site's header etc).
I want to display that article in my WP 8.1 app with article's formatting and images.
How can I do that?
I tried using WebView but it's not what I need, because text in WebView is really small and needs zooming and so on.
* for Tamás Deme *
<RichTextBlock>
<common:Properties.Html>
<![CDATA[ <img width="100" height = "100" src="https://www.google.com/images/srpr/logo11w.png"/> ]]>
</common:Properties.Html>
</RichTextBlock>
It displays p, b tags properly, the only problem is images.
* for Tamás Deme *
You could use the HtmlAgilityPack to parse the page, and then rerender the article's contents in a RichTextBlock.
To do the conversion these two links I found might help: http://blogs.msdn.com/b/tess/archive/2013/05/13/displaying-html-content-in-a-richtextblock.aspx and https://github.com/MacawNL/WinRT-RichTextBlock.Html2Xaml
have you tried the JavaScript Windows Store App templates (available in VS2013)?
you can find some good tutorials here: https://msdn.microsoft.com/en-us/library/windows/apps/br211385.aspx?f=255&MSPPError=-2147217396

WPF WebBrowser Control will not load video in a locally hosted HTML page

I have a WPF application written in C#. This application has two WPF WebBrowser controls next to each other. Each one navigates to a different locally-hosted HTML file. Each HTML file has a video element which points to an .mp4 video file stored in the same directory.
My problem is that the video content does not render in the WebBrowser controls. If I use the exact same URL and put it into Internet Explorer 11 on the same PC, the video content runs perfectly fine. I know the actual navigations of the WebBrowser controls are working because the page half-renders. I can see the background color show correctly but that is it. If I right-click inside one of the controls and view the source, I can see the correct HTML there.
Attempting to apply the recommendation in an answer to this question to Internet Explorer 11, I tried having the WebBrowser controls in my executable run like IE11 using the information in this link with no success.
I'm not sure if this is relevant, but I already have "Allow active content to run in files on My Computer" checked in Internet Options on Internet Explorer.
Here is the HTML markup for the video:
<div id="video_holder">
<video id="video" width="1200" height="900" autoplay>
<source src=".\FANCY.mp4" type="video/mp4">
</video>
</div>
And here is the code that calls the Navigate() method of the WebBrowser controls (the constructor for this Form receives the urls from another class - I'm pretty sure the problem isn't here, though, as I can see that the actual navigation seems to be working and the HTML starts to render):
public partial class TwoPaneWindow : Window
{
private string leftUrl;
private string rightUrl;
public TwoPaneWindow(string left, string right)
{
leftUrl = left;
rightUrl = right;
}
public void StartWindow()
{
InitializeComponent();
this.Show();
LeftBrowser.Navigate(leftUrl);
RightBrowser.Navigate(rightUrl);
}
}
Can anyone tell what is going on? I am hosting this on IIS installed on Windows 8.1. Thank you in advance for any help you can offer.
Finally figured this out. Even though I said I tried the answer to this question, I was actually using the FEATURE_BROWSER_EMULATION key incorrectly. I attempted to add FEATURE_BROWSER_EMULATION to HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Internet Explorer\Main\FeatureControl, when in fact it needs to be modified at HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\Main\FeatureControl\FEATURE_BROWSER_EMULATION. Once I created a new DWORD entry for my application (sharing its name) with a value of 0x2AF8, the WebBrowser controls immediately started working correctly. A newbie mistake I'm sure, but hopefully this helps someone else in the future.

C# WebBrowser won't display embedded object

This may be a dumb question, but I just can't get it to work. I'm trying to embed a pdf file into a webbrower in a c# program. Simple right? I thought so, but it proved otherwise.
Here's the html code:
<object classid="" type="application/pdf" width="400" height="300" id="pdf1">
<param name="src" value="Test.pdf" />
<div style="text-align:center; color:#CCCCCC" >No Preview Available.</div>
</object>
And that's all thats in the html file. The funny thing is, this works perfectly in IE (which as I understand is what the WebBrowser uses). I've tried implementing the object tag the non-IE way, with an src attribute and whatnot, but it did the same thing. What's happening is the WebBrowser control is just displaying No Preview Available meaning that the pdf was not successfully embedded. Here's the c# code:
wbPreview.Navigate("I:/Documents/Visual Studio 2008/Projects
/PlanReferenceDatabase/test.html");
Can someone tell me why the web browser in c# cannot display the pdf, but the other browser can?
Try formatting the tag like this:
<object type="application/pdf" data="myPdfFile.pdf" class="yourPdfClass" width="550px" height="800px"/>
Include the data attribute in the tag and it seems to work just fine - just tried this in my browser control on a IE8 / IE9 machine and it displays inline.
I solved my problem. Just in case anyone else has the same one, here's what I did:
First I set the "target platform" property under the build tab in visual studio to x86 because as it turns out, 64bit IE can't render PDFs.
Second I used the embed tag instead of the object tag, because IE requires you to use "classid" and all sorts of Active X stuff you don't want when you use the object tag.

Categories

Resources