Windows 10 - HTMLViewer background image issue

I compiled myapplication for TargetWindows using Mac with Xojo 2019r3.
The HTMLViewer is not displaying the background image on Windows 10.
The same code is displaying background image correctly in Mac.
So I tried to verify the html code and saved it to a .html file and opened it with the browser and the background image is showing correctly. So I know the HTML code is correct.
Looks like this is a bug in Xojo running on Windows. Does anyone have the same issue?

Here is the HTML code:

<!DOCTYPE html>
<html><head><meta http-equiv="Content-Type"content="text/html; charset=utf-8"><script language="JavaScript">
<!--This disables right click.-->
<!--

var message="!";
///////////////////////////////////
function clickIE()

{if (document.all)
{(message);return false;}}

function clickNS(e) {
if
(document.layers||(document.getElementById&&!document.all))
{

if (e.which==2||e.which==3) {(message);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else
{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}

document.oncontextmenu=new Function("return false")
// -->
</script>
<style>.para1 { font-size: 12px; color:#00FF80}.para2 { font-size: 16px; color:#00FF80}
body { background-image: url('file:///C:/Users/Johnny/Pictures/LifeFrame/1.jpg');}
<body class="para2"  ><ol>
<li> Good Morning. This is the first line. </li><br>
<li> Simple test, second line . </li><br>
</ol>
</body></html>

Any one from Xojo can answer?

It’s likely a local file loading issue. Which renderer are you using? Does the CancelLoad event fire for the background image? I’d be willing to bet that you’re using the WebKit renderer and it’s being blocked, so you might see about:blank#blocked as a URL in CancelLoad.

A workaround might be to convert the desired picture to BASE64 and use that instead of the file path.

I think you can’t mix content, that is:

  • Loading a URL based page (http or https) can’t include file based files (file://) and vice-versa

You can try to load your html from a FILE using HTMLViewer.LoadPage(aFile) and then inject file based paths file:// it should work (make sure on MacOS you have the correct plist entries if required)

Or you load a url (HTMLViewer.LoadURL(“http://someurl.com”))http or https and include files from other urls http or https.

Don’ try to mix it, it could cause mixed content.
An HTMLViewer is NOT a browser, you can’t compare both. HTMLViewer is a sandboxed limited tool to view html based content or url based html content.

Let me be more clear. The issue is HTMLViewer displays the text but not the background image.

I am using the HTMLViewer.LoadPage(aFile). I have used the same HTMLViewer.LoadPage(aFile) in the past and it used to work, and it is no longer working on 2020 and 2019r 3.2.

The same html code is working fine when I compile and run on Mac. The same project is not rendering background image in Windows.

Try this simple code and tell me if it is working on Windows (for me it did not work. I cross compile from Mac for Windows):
<html> <head> </head> <body background="1.jpg"> Hello world! </body> </html>

BTW, I am not using WebKit.

I’ll try WebHTMLViewer instead…

It works for me here, can you post up a demo project in a zip with the html and image and I’ll see if I can see the problem.

1 Like

@anon20074439 Thank you for your help.
I am using 2019 r3.2 to compile this project.
I have two targets in the project. The Mac works. Windows does not render background image.
Strangely this project does not work in with 2020 on Mac.

I don’t know how I attach my project to this ticket.
So here is the project & background image:
http://www.mediafire.com/file/gw3rnibmm5l6nkr/sample.xojo_binary_project/file

All I had to do was to delete the HTMLViewer from the project and drop it again from the current Xojo IDE. It looks like the HTMLViewer inherited from previous IDE is behaving weird.

So that fixes the problem.

2 Likes