Interacting with a Canvas with Selenium Interacting with a Canvas with Selenium selenium selenium

Interacting with a Canvas with Selenium


I was also looking into the same issue, after searching for some time I understood that Selenium accesses canvas element. but it can't access the inner elements/child elements of it. Because selenium used DOM model and canvas's child elements wont visible in DOM.After looking into one example mentioned here, we can interact with the canvas using coordinates. But that's absurd, most of the times we will draw elements dynamically, and how can we get perticular shape's coordinates.If you are having coordinates of the shapes you can play with them using above link.


try this ,it worked for me.This will draw a circle on the 'canvas' id.

public function testDraw() {        try {            $this->execute(array('script' => "  var c = document.getElementById('canvas');             var ctx = c.getContext('2d');            ctx.beginPath();               ctx.arc(100, 75, 50, 0, 2 * Math.PI);                ctx.stroke();",                'args' => array()));            echo 'done';            sleep(10);        } catch (Exception $ex) {            echo 'not done';        }