11 Comments

image

The WebBrowser control in Windows Phone 8 has one serious problem: It sometimes forgets to render the HTML. This happens with the NavigateToString-method, Navigate-method works fine. Unfortunately though this problems also affects the Windows Phone 7 apps deployed to Windows Phone 8 phones.

After the repro, the bottom part of this post shows one hack which gets around this problem.

Repro

Here’s a simple repro of the problem. The program can display the HTML page either by navigating to the URL or by downloading the content to string and using the NavigateToString. The same app has been deployed to both the Windows Phone 7 and Windows Phone 8 emulators (this problem is visible also on the real devices).

The code:

public partial class MainPage 
{ 
    private const string url = "http://assets.softwaremk.org/temp/NotWorking.html"; 

    public MainPage() 
    { 
        InitializeComponent(); 
    }

    private async void NavigateStringClick(object sender, RoutedEventArgs e) 
    { 
        var client = new WebClient(); 
        var content = await client.DownloadStringTaskAsync(url);

        WebBrowser.NavigateToString(content); 
    }

    private void NavigateUrlClick(object sender, RoutedEventArgs e) 
    { 
        WebBrowser.Navigate(new Uri(url)); 
    } 
}

The HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
</head>
<body>
    Some content
</body>
</html>

Test results

Windows Phone 7 & Navigate

OK

image

Windows Phone 7 & NavigateToString

OK

image

Windows Phone 8 & Navigate

OK

image

Windows Phone 8 & NavigateToString

BROKEN

image

Observations

The problem seems to be related to the HTML meta tags. The test HTML has two meta tags and if either of them is removed, the page is displayed correctly.

Solution

Here’s a solution which gets around this problem. It’s not beautiful by any means but it seems to do the trick.

  1. Download the HTML content as string
  2. Store it to the IsolatedStorage
  3. Use WebControl to navigate to the isolated storage
var client = new WebClient(); 
var content = await client.DownloadStringTaskAsync(url);

var store = IsolatedStorageFile.GetUserStoreForApplication();

using (var writeFile = new StreamWriter(new IsolatedStorageFileStream("htmlcontent.html", FileMode.Create, FileAccess.Write, store))) 
{ 
    writeFile.Write(content); 
    writeFile.Close(); 
}

var uri = new Uri("htmlcontent.html", UriKind.Relative);

WebBrowser.Navigate(uri);

Result:

image

Comments

Comment by Paresh Mayani

Hi,

I did same as you have mentioned in solution part but still the issue is same.


Actually i am getting HTML data in web service response, so once i got then i did as per your solution part. please help me out.

Comment by susant sahu

i was facing same kind of problem
i tried ur solution it didn't worked for me, then tried something like this

System.Net.WebUtility.HtmlDecode( Data.Replace(Environment.NewLine, ""))

where Data is nothing but your complete htmlContent

let me know if this works fine for u guys ....

susant sahu
Comment by Ranjan Dailata

It works perfectly with NavigateToString in Win 8. How come you have that problem ?

Comment by Jaakko Koskenkorva

Thanks! Had exactly this problem, and the workaround worked nicely.

Jaakko Koskenkorva
Comment by Jeremy

I had the problem your describe here and your solution works for me. Thanks for sharing :-)

Jeremy
Comment by roschler

Thank you Mikael. That worked great.

Comment by Fred

I'm having problems because DownloadStringTaskAsync
doesn't have an assembly reference. I thought it would be covered by System.Net.WebClient. Anyone know how I can get rid of the horrible red squiggly line?

Fred
Comment by aloisdg

Thank you ! This is perfect !

aloisdg
Comment by Kevin

Thank you very much !! This really helps

Kevin