Welcome Guest Search | Active Topics | Sign In | Register

Delay render until after EvalScript has finished Options
Dave Covert
Posted: Wednesday, June 28, 2017 11:15:09 AM
Rank: Member
Groups: Member

Joined: 5/31/2011
Posts: 11
I am altering a web page with the following handler. It works fine except that the original version is visible for a moment at load. The page reloads every 10 seconds so the deleted <div> flashes onscreen every 10 seconds as well.

Code:

private void WebView1_LoadCompleted(object sender, LoadCompletedEventArgs e)
{
    webView1.EvalScript(@"
        document.getElementsByClassName('pull-left')[0].remove();
    ");
}


Is there a way to remove the <div> before the page is displayed?

Dave
eo_support
Posted: Wednesday, June 28, 2017 11:26:28 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,080
Hi,

There is no way to precisely control this, but you can try to use this property instead:

https://www.essentialobjects.com/doc/eo.webbrowser.webview.jsinitcode.aspx

You would use the same code as you do with EvalScript. However JSInitCode is triggered immediately after the document has been loaded inside the rendering engine. Where as it would take a while for the same event to travel from the browser engine to your .NET LoadCompleted event handler. So in theory WebView.JSInitCode would occur faster than EvalScript inside LoadCompleted event.

Thanks!
Dave Covert
Posted: Wednesday, June 28, 2017 11:36:30 AM
Rank: Member
Groups: Member

Joined: 5/31/2011
Posts: 11
Removing the LoadCompleted event handler and setting the JSInitCode property doesn't seem to work. The <div> is never removed at all.

Code:
webView1.JSInitCode = @"document.getElementsByClassName('pull-left')[0].remove();";


Dave
eo_support
Posted: Wednesday, June 28, 2017 11:45:54 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,080
Ah. My mistake. You need to do something like this:

Code: C#
webView1.JSInitCode = "window.addEventListener('load', function(){ your_original_code_here });


If you still have problems, you can replace your code with a something such as alert("test") to make sure it is called. If that is called but your code didn't work, then there might be some issue related to your code and your HTML (for example, the DIV you are looking for does not exist), in that case you can use the built-in DevTools's console window to find out what's wrong. For debugging purpose, you can use this method to show the debug UI when your application starts:

https://www.essentialobjects.com/doc/eo.webbrowser.webview.showdebugui.aspx

Thanks!

Dave Covert
Posted: Wednesday, June 28, 2017 11:54:50 AM
Rank: Member
Groups: Member

Joined: 5/31/2011
Posts: 11
The new code works, but the results are no different than using the LoadCompleted handler. Like you said, it was a theory...

Maybe I could load the page with a ThreadRunner, and make the changes there. How would I then push the modified document to the on-screen WebView?

Dave
eo_support
Posted: Wednesday, June 28, 2017 1:21:12 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,080
Hi,

No. You can not. You can transfer the HTML in between the two but they will always be two different WebView instance. So things won't work exactly the same.

Thanks!
Dave Covert
Posted: Wednesday, June 28, 2017 2:14:41 PM
Rank: Member
Groups: Member

Joined: 5/31/2011
Posts: 11
So... no solution? The unaltered page is always going to be shown before my script is applied?

Dave
eo_support
Posted: Wednesday, June 28, 2017 4:07:15 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,080
As we have mentioned in our first reply --- there is no way to precisely control this. All modern browser engine are optimized to display pages to the user as soon as it can, in fact it will start render BEFORE the page finishes loading. You will often see this in action when you load a page with images and the non-image contents are displayed, then the images are filled in as they finish loading. So no, there is no way to precisely do what you wanted to do unless you alter the contents up stream before it reaches the rendering engine, which usually means you must do it on the web server side.
Dave Covert
Posted: Thursday, June 29, 2017 10:36:49 AM
Rank: Member
Groups: Member

Joined: 5/31/2011
Posts: 11
It turns out that the entire page is not refreshing. The part of the page that contains the <div> I am removing is being refreshed by an ASP.NET timer:

Code:

Sys.Application.add_init(function() {
    $create(Sys.UI._Timer, {"enabled":true,"interval":15000,"uniqueID":"Timer3"}, null, null, $get("Timer3"));
});


It would seem that all I really need to do is disable the timer and my <div> would stay removed. To try and do that I am using the IsLoadingChanged handler:

Code:

private void WebView1_IsLoadingChanged(object sender, EventArgs e)
{
    if (!webView1.IsLoading)
    {
        webView1.EvalScript(@"                            
                console.log(""Finding timer..."");
                var timer3 = $find('<%= Timer3.ClientID %>');
                var interval = timer3.get_interval;
                console.log(interval);
                timer3._stopTimer();
            ");
    }
}


I get an error in the script console saying that I can't call get_interval on null. Obviously Timer3 is not being found.

Do you have any insight as to why Timer3 might not be found?

Dave
eo_support
Posted: Thursday, June 29, 2017 11:11:44 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,080
Hi,

You should not use IsLoadingChanged event for this kind of task. IsLoading can flip back and forth many times during the life cycle of a single page. Use JSInitCode mentioned in our previous reply for such task. If you still run into problems with JavaScript, you will need to resolve it yourself. We do not provide support on that.

Thanks!
Dave Covert
Posted: Thursday, June 29, 2017 11:45:17 AM
Rank: Member
Groups: Member

Joined: 5/31/2011
Posts: 11
So you see no reason why `var timer3 = $find('<%= Timer3.ClientID %>');` should fail to find the timer when run from JSInitCode? Any concerns about when JSInitCode runs vs. when ASP.NET timers become available?

Dave
eo_support
Posted: Thursday, June 29, 2017 11:54:21 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,080
The only thing we can tell you is JSInitCode is run BEFORE everything else runs in your page --- in fact it runs before the page is fully loaded. You will need to figure out the correct JavaScript code to achieve your goal from this starting point. For example, if you need to make a function available to your code, this is the perfect point to define the function since it will run before your code runs. However if you want to do something after your page is loaded, then you need to hook up the window object's onload hanlder here so that your handler will be called later when the page finishes loading. All these are your responsibilities. We are not in a position to figure out exactly what JavaScript you need to run to achieve your particular goal. If we were to do that, all our customers who run into problems with their page would run their problems through us. Obviously we can not afford to do that. As such we will not review or answer any questions related to your page, either ASP.NET or JavaScript. I hope you understand this.


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.