C＃Selenium Webdriver-如何保存特定图像，而不管位置

Question

I've seen a ton of examples how to save an image based on saving a screenshot.

This has a fundamental flaw. The take screenshot only takes whats visable on the page at the time. So if I have an image at the bottom of the page, and I want to save it based on the location of the elements that I found, either one or two problems occur.

If I save the screenshot and then try to save by the location, the screen shot ends at point 1200 but the image is located at 3000. If i focus on the image and then take a screen shot, the image is is now on the screen shot, however, the location doesn't work. It doesn't work because I still have a 1200px height image with a location of 3000.

How can I simply say, I have an image at 3000x 3014y and I just want to save it?

Answer 1

I've resolved it. Chrome vs IE vs Firefox take screen shots in different manners. Firefox will stitch the screenshot together, chrome only takes whats visible and IE will shrink everything to try to fit on one page.

If you need to do a screenshot of something that is not on the base page i'd suggest firefox

Answer 2

You can basically get base64 string of the image and save it to file.

var base64string = driver.ExecuteScript(@"
    var c = document.createElement('canvas');
    var ctx = c.getContext('2d');
    var img = document.getElementsByTagName('img')[0];
    c.height=img.height;
    c.width=img.width;
    ctx.drawImage(img, 0, 0,img.width, img.height);
    var base64String = c.toDataURL();
    return base64String;
    ") as string;

var base64 = base64string.Split(',').Last();
using (var stream = new MemoryStream(Convert.FromBase64String(base64)))
{
    using (var bitmap = new Bitmap(stream))
    {
        var filepath = Path.Combine(AppDomain.CurrentDomain.BaseDirectory, $"{Guid.NewGuid()}.jpg");
        bitmap.Save(filepath, ImageFormat.Jpeg);
    }
}