cefsharp / CefSharp

.NET (WPF and Windows Forms) bindings for the Chromium Embedded Framework
http://cefsharp.github.io/
Other
9.89k stars 2.92k forks source link

ChromiumBrowser resize complete event #1208

Closed twilly86 closed 9 years ago

twilly86 commented 9 years ago

I'm using CefSharp.Offline to render screenshot images of html5 charts. Depending on the image, I can update the zoom and the browser size.

It looks like it takes cefsharp a little time to resize the browser to the correct size.

I tried adding in a javascript check to wait for the resize to happen, but the height and width from javascript don't match the ChromimBrowser.Size object. Any ideas why the dimensions are different or how to check the correctly?

Is there an event that I could tap into to check when the browser is done resizing?

View of debugger and different dimensions from javascript and ChromiumBrowser... http://i.imgur.com/kb8whRj.png

I put in a Thread.Sleep(500); call after the resize and that helped, but I'd like to get away from putting static sleep calls.

twilly86 commented 9 years ago

I saw this example..

https://gist.github.com/amaitland/96ebbfd92454d8bc36df

browser.Size = new Size(800, 600); await LoadPageAsync(browser,true); await Task.Delay(500); await browser.ScreenshotAsync().ContinueWith(DisplayBitmap);

In my code, I'm never reloading the page. I'm just injecting new content into the page via javascript and then taking a screen shot. I am rending a screenshot about every 100ms.

Is there a way to do.. await browser.Size = new Size(800, 600);

I'm also checking the returned BitMap's size and comparing that to Browser.Size and this randomly comes back with different dimensions. I know for certain my page isn't overlapping the browser window.

amaitland commented 9 years ago

Any ideas why the dimensions are different or how to check the correctly?

Does browser.Size match the dimensions of the generated Bitmap? Remembering the Size is that of the total canvas that's used, so the rendered content will likely be smaller. Step through https://github.com/cefsharp/CefSharp/blob/cefsharp/41/CefSharp.OffScreen/ChromiumWebBrowser.cs#L412 to debug, see what's actually going on.

await browser.Size = new Size(800, 600);

Unfortunately no. I'm not away of any straight forward event you can hook into.

It's probably worth searching through the ceforum, see if anyone else has a similar question, likely someone has asked something similar http://magpcss.org/ceforum/

Also the API (a slightly out of date very, though it hasn't changed that much), you can dig through there, see if there's anything that I'm not aware of http://magpcss.org/ceforum/apidocs3/index-all.html

twilly86 commented 9 years ago

I have a hunch it might be related to this issue which I just submitted.. https://github.com/cefsharp/CefSharp/issues/1209 which has more sample code on what I'm doing.

It looks like the screenshots might be out of date and aren't re-generated after javascript execution or browser resize which could be causing the mismatch. So maybe it's not that the browser resize is taking too long, it's that the screen shot hasn't been updated since the resize.

viscousbiscuit commented 9 years ago

I do a similar thing with re-sizing the browser but I use a System.Timers.Timer and wait at least 3 seconds before calling browser.ScreenshotOrNull(). This always provides an accurate screenshot after re-sizing, you may even have to wait a little longer.

amaitland commented 9 years ago

From a rendering point of view there is no easy way for the browser to notify you. Even in an OffScreen scenario, things may still be happening in the browser.

The idea I toyed with was hooking the rendering event when the page has finished loading (IsLoading = false) and then using a timer reset timer with small intervals. For each rendering event, reset the timer, if the timer eventually fires without being reset then use that as the marker everything has finished. A little more fine grained than just waiting an arbitrary period.

amaitland commented 9 years ago

If someone comes up with a creative solution or the CEF API provides functionality at some point in the future I'm happy to re-open this.