Selenium save element image

Question

When I was using webBrowser to automate tasks my code to save images was short and clean:

    Image Getmg(WebBrowser webBrowser)
    {
        mshtml.HTMLWindow2 window = (mshtml.HTMLWindow2)webBrowser.Document.Window.DomWindow;
        window.execScript("var ctrlRange = document.body.createControlRange();ctrlRange.add(document.getElementById('captcha-image'));ctrlRange.execCommand('Copy');", "javascript");
        return Clipboard.GetImage();
    }

I was just injecting javascript. Now I am using Selenium and FireFox driver. I've made a method to save images:

private void takeScreenshotOfElement(By elementToFind, string outputFileName) {
    //find element
    IWebElement my_image = driver.FindElement(elementToFind);

    //scrool to element
    Actions moveAction = new Actions(driver);
    moveAction.MoveToElement(my_image);
    moveAction.Perform();

    //take screenshot of full page
    ITakesScreenshot its = (ITakesScreenshot)driver;
    Screenshot screenShot = its.GetScreenshot();

    //convert screenShot to Bitmap
    var ms = new MemoryStream(screenShot.AsByteArray);
    Bitmap image = new Bitmap(Image.FromStream(ms));

    //get element size
    int imageWidth = my_image.Size.Width;
    int imageHeight = my_image.Size.Height;

    //get element position
    RemoteWebElement element = (RemoteWebElement)my_image;
    Point imagePosition = new Point();
    imagePosition.X = element.LocationOnScreenOnceScrolledIntoView.X;
    imagePosition.Y = element.LocationOnScreenOnceScrolledIntoView.Y;

    //crop screenShot
    Rectangle section = new Rectangle(imagePosition, new Size(imageWidth, imageHeight));
    Bitmap final_image = CropImage(image, section);

    //save element image
    final_image.Save(outputFileName);
}

Basically it is working when elementToFing is on the top of browser. Also I can't scroll to this element. When I see elementToFind it is ok. But when this element is out of my view I am getting: 'System.InvalidOperationException' in WebDriver.dll. Do you have any idea how to do it?

To be clear, this code is not working properly:

//scroll to element
Actions moveAction = new Actions(driver);
moveAction.MoveToElement(my_image);
moveAction.Perform();

If I remember correctly, with Firefox you can directly capture the element ((ITakesScreenshot)element).GetScreenshot(). — Florent B.
– Florent B., Commented Oct 6, 2017 at 18:22
@FlorentB. unfortunelly this code Screenshot screenShot = ((ITakesScreenshot)elementToFind).GetScreenshot(); gave me 'System.InvalidCastException' in selenium.exe — user4940368
– user4940368, Commented Oct 6, 2017 at 18:32
you need to call it on a IWebElement or RemoteWebElement and not By type. — Florent B.
– Florent B., Commented Oct 6, 2017 at 18:40

iamsankalp89 · Accepted Answer · 2017-10-13 07:39:44Z

2

Use JavascriptExecutor to scroll like this:

((JavascriptExecutor) driver).executeScript("arguments[0].scrollIntoView(true);", my_image);
Thread.sleep(500);

from Scroll Element into View with Selenium

edited Oct 13, 2017 at 7:39

iamsankalp89

4,7592 gold badges17 silver badges36 bronze badges

answered Oct 6, 2017 at 18:05

Dale

1,95111 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Selenium save element image

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related