I have problem getting output from html2canvas JS library within Chrome automated by selenium. Response is always null, but I can see in the Chrome console that code executed successfully and screenshot has been encoded

public byte[] TakeScreenshot(string fileName)
    {
        this.logger.Debug($"Taking screenshot");
        var seleniumDownloadPath = this.seleniumEngine.GetDownloadPath();
        IJavaScriptExecutor js = Driver as IJavaScriptExecutor;
        var html2canvasJs = System.IO.File.ReadAllText(Path.Combine(Path.GetDirectoryName(new Uri(Assembly.GetExecutingAssembly().CodeBase).LocalPath), this.seleniumEngine.GetHtml2CanvasPath()));
        var wait = new WebDriverWait(Driver, TimeSpan.FromSeconds(60));
        var response = new object { };

        js.ExecuteScript(html2canvasJs);

        string generateScreenshotJS =
             var canvasImgContentDecoded;
             @"function genScreenshot () {
             html2canvas(document.body).then(function(canvas) {
             window.canvasImgContentDecoded = canvas.toDataURL(""image/png"");
             console.log(window.canvasImgContentDecoded);
             return window.canvasImgContentDecoded;
             });
             }
             genScreenshot();";

        response = js.ExecuteScript(generateScreenshotJS);
}

I also tried solution from this Here but the behavior was unstable (e.g. when running realtime i got error of nulls, but if running using breakpoints, I got result sometime)

CodePudding user response：

Finally found the solution after finding out that execution of script takes more time and variable was null. So added wait function to retrieve once its filled - window.canvasImgContentDecoded

public byte[] TakeScreenshot(string fileName)
    {
        this.logger.Debug($"Taking screenshot");
        var seleniumDownloadPath = this.seleniumEngine.GetDownloadPath();
        IJavaScriptExecutor js = Driver as IJavaScriptExecutor;
        var html2canvasJs = System.IO.File.ReadAllText(Path.Combine(Path.GetDirectoryName(new Uri(Assembly.GetExecutingAssembly().CodeBase).LocalPath), this.seleniumEngine.GetHtml2CanvasPath()));
        var wait = new WebDriverWait(Driver, TimeSpan.FromSeconds(60));
        var response = new object { };

        js.ExecuteScript(html2canvasJs);

        string generateScreenshotJS =
             @"
             var canvasImgContentDecoded;
             function genScreenshot () {
             html2canvas(document.body).then(function(canvas) {
             window.canvasImgContentDecoded = canvas.toDataURL(""image/png"");
             console.log(window.canvasImgContentDecoded);
             });
             }
             genScreenshot();";

        response = js.ExecuteScript(generateScreenshotJS);

        string getSCreenShot = "return window.canvasImgContentDecoded;";

        var encodedPngContent = new object { };
        
        /*ADDED WAIT FUNCTION*/
        wait.Until(
        wd =>
        {
            encodedPngContent = js.ExecuteScript(getSCreenShot);
            if (encodedPngContent != null)
            {
                return true;
            }
            return false;
        });

        string pngContent = encodedPngContent.ToString();
        pngContent = pngContent.Replace("data:image/png;base64,", string.Empty);
        string fileSavePath = this.seleniumEngine.GetDownloadPath()   fileName;
        File.WriteAllBytes(fileSavePath, Convert.FromBase64String(pngContent));
        byte[] fileByte = System.IO.File.ReadAllBytes(fileSavePath);
        File.Delete(fileSavePath);
        return fileByte;
    }