Example - Add DevToolsExtensions.CaptureScreenShotAsPng

Example of taking a screenshot as a png using the new devtools interface

Author: amaitland

CefSharp.Example/CefSharp.Example.csproj

@@ -62,6 +62,9 @@
   </PropertyGroup>
   <ItemGroup>
     <Reference Include="Microsoft.CSharp" />
+    <Reference Include="Newtonsoft.Json, Version=12.0.0.0, Culture=neutral, PublicKeyToken=30ad4fe6b2a6aeed, processorArchitecture=MSIL">
+      <HintPath>..\packages\Newtonsoft.Json.12.0.3\lib\net45\Newtonsoft.Json.dll</HintPath>
+    </Reference>
     <Reference Include="System" />
     <Reference Include="System.Core">
       <RequiredTargetFramework>3.5</RequiredTargetFramework>
@@ -72,6 +75,8 @@
   </ItemGroup>
   <ItemGroup>
     <Compile Include="Callback\RunFileDialogCallback.cs" />
+    <Compile Include="DevTools\DevToolsExtensions.cs" />
+    <Compile Include="DevTools\TaskMethodDevToolsMessageObserver.cs" />
     <Compile Include="Handlers\ExampleResourceRequestHandler.cs" />
     <Compile Include="Handlers\ExtensionHandler.cs" />
     <Compile Include="JavascriptBinding\AsyncBoundObject.cs" />
@@ -143,6 +148,7 @@
     <Content Include="Resources\assets\css\shCore.css" />
     <Content Include="Resources\assets\css\shCoreDefault.css" />
     <None Include="Extensions\set_page_color\manifest.json" />
+    <None Include="packages.config" />
     <None Include="Resources\assets\images\beach-2089936_1920.jpg" />
     <Content Include="Resources\assets\js\application.js" />
     <Content Include="Resources\assets\js\jquery.js" />

CefSharp.Example/DevTools/DevToolsExtensions.cs

@@ -0,0 +1,89 @@
+using System;
+using System.Text;
+using System.Threading;
+using System.Threading.Tasks;
+using Newtonsoft.Json;
+
+namespace CefSharp.Example.DevTools
+{
+    public static class DevToolsExtensions
+    {
+        private static int LastMessageId = 600000;
+        /// <summary>
+        /// Calls Page.captureScreenshot without any optional params
+        /// (Results in PNG image of default viewport)
+        /// https://chromedevtools.github.io/devtools-protocol/tot/Page/#method-captureScreenshot
+        /// </summary>
+        /// <param name="browser">the ChromiumWebBrowser</param>
+        /// <returns>png encoded image as byte[]</returns>
+        public static async Task<byte[]> CaptureScreenShotAsPng(this IWebBrowser chromiumWebBrowser)
+        {
+            //if (!browser.HasDocument)
+            //{
+            //    throw new System.Exception("Page hasn't loaded");
+            //}
+
+            var host = chromiumWebBrowser.GetBrowserHost();
+
+            if (host == null || host.IsDisposed)
+            {
+                throw new Exception("BrowserHost is Null or Disposed");
+            }
+
+            //var param = new Dictionary<string, object>
+            //{
+            //    { "format", "png" },
+            //}
+
+            var msgId = Interlocked.Increment(ref LastMessageId);
+
+            var observer = new TaskMethodDevToolsMessageObserver(msgId);
+
+            //Make sure to dispose of our observer registration when done
+            //TODO: Create a single observer that maps tasks to Id's
+            //Or at least create one for each type, events and method
+            using (var observerRegistration = host.AddDevToolsMessageObserver(observer))
+            {
+                //Page.captureScreenshot defaults to PNG, all params are optional
+                //for this DevTools method
+                int id = 0;
+                const string methodName = "Page.captureScreenshot";
+
+                //TODO: Simplify this, we can use an Func to reduce code duplication
+                if (Cef.CurrentlyOnThread(CefThreadIds.TID_UI))
+                {
+                    id = host.ExecuteDevToolsMethod(msgId, methodName);
+                }
+                else
+                {
+                    id = await Cef.UIThreadTaskFactory.StartNew(() =>
+                    {
+                        return host.ExecuteDevToolsMethod(msgId, methodName);
+                    });
+                }
+
+                if (id != msgId)
+                {
+                    throw new Exception("Message Id doesn't match the provided Id");
+                }
+
+                var result = await observer.Task;
+
+                var success = result.Item1;
+
+                dynamic response = JsonConvert.DeserializeObject<dynamic>(Encoding.UTF8.GetString(result.Item2));
+
+                //Success
+                if (success)
+                {
+                    return Convert.FromBase64String((string)response.data);
+                }
+
+                var code = (string)response.code;
+                var message = (string)response.message;
+
+                throw new Exception(code + ":" + message);
+            }
+        }
+    }
+}

CefSharp.Example/DevTools/TaskMethodDevToolsMessageObserver.cs

@@ -0,0 +1,67 @@
+using System;
+using System.IO;
+using System.Threading.Tasks;
+using CefSharp.Callback;
+
+namespace CefSharp.Example.DevTools
+{
+    /// <summary>
+    /// For capturing the response from a DevTools Method
+    /// (Doesn't handle DevTools events)
+    /// </summary>
+    public class TaskMethodDevToolsMessageObserver : IDevToolsMessageObserver
+    {
+        private readonly TaskCompletionSource<Tuple<bool, byte[]>> taskCompletionSource = new TaskCompletionSource<Tuple<bool, byte[]>>(TaskCreationOptions.RunContinuationsAsynchronously);
+        private readonly int matchMessageId;
+
+        public TaskMethodDevToolsMessageObserver(int messageId)
+        {
+            matchMessageId = messageId;
+        }
+
+        void IDisposable.Dispose()
+        {
+
+        }
+
+        void IDevToolsMessageObserver.OnDevToolsAgentAttached(IBrowser browser)
+        {
+
+        }
+
+        void IDevToolsMessageObserver.OnDevToolsAgentDetached(IBrowser browser)
+        {
+
+        }
+
+        void IDevToolsMessageObserver.OnDevToolsEvent(IBrowser browser, string method, Stream parameters)
+        {
+
+        }
+
+        bool IDevToolsMessageObserver.OnDevToolsMessage(IBrowser browser, Stream message)
+        {
+            return false;
+        }
+
+        void IDevToolsMessageObserver.OnDevToolsMethodResult(IBrowser browser, int messageId, bool success, Stream result)
+        {
+            //We found the message Id we're after
+            if (matchMessageId == messageId)
+            {
+                var memoryStream = new MemoryStream((int)result.Length);
+
+                result.CopyTo(memoryStream);
+
+                var response = Tuple.Create(success, memoryStream.ToArray());
+
+                taskCompletionSource.TrySetResult(response);
+            }
+        }
+
+        public Task<Tuple<bool, byte[]>> Task
+        {
+            get { return taskCompletionSource.Task; }
+        }
+    }
+}

CefSharp.Example/packages.config

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<packages>
+  <package id="Newtonsoft.Json" version="12.0.3" targetFramework="net462" />
+</packages>