# Working with Canvas Elements **URL:** \ **Category:** Web Testing\ **Tags:** katalon-studio\ **Created:** [May 2, 2018, 10:50am UTC](https://forum.katalon.com/t/working-with-canvas-elements/10622 "2018-05-02T10:50:27Z")\ **Posts on this page:** 10\ **Page:** 1
**Author:** ![sheetal\_sulay](https://avatars.discourse-cdn.com/v4/letter/s/9fc29f/32.png) [@sheetal\_sulay](https://forum.katalon.com/u/sheetal_sulay)\ **Post date:** [May 2, 2018, 10:50am UTC](https://forum.katalon.com/t/working-with-canvas-elements/10622/1 "2018-05-02T10:50:27Z")
Hi, Currently I am trying to automate games which are developed using Canvas tag. This game has buttons like play, help etc which I want to automate. Is there any possible way to automate these canvas elements using Katalon studio? Sheetal ---
**Author:** ![sheetal\_sulay](https://avatars.discourse-cdn.com/v4/letter/s/9fc29f/32.png) [@sheetal\_sulay](https://forum.katalon.com/u/sheetal_sulay)\ **Post date:** [May 15, 2018, 6:05am UTC](https://forum.katalon.com/t/working-with-canvas-elements/10622/2 "2018-05-15T06:05:34Z")
> [sheetal sulay](https://forum.katalon.com/profile/6609/sheetal%20sulay) said: > > Hi, > Currently I am trying to automate games which are developed using Canvas tag. > > This game has buttons like play, help etc which I want to automate. > Is there any possible way to automate these canvas elements using Katalon studio? > > Sheetal Anyone has any idea around this? Sheetal ---
**Author:** ![Mate\_Mrse](https://dub1.discourse-cdn.com/katalon/user_avatar/forum.katalon.com/mate_mrse/32/345_2.png) [@Mate\_Mrse](https://forum.katalon.com/u/Mate_Mrse)\ **Post date:** [May 15, 2018, 6:23am UTC](https://forum.katalon.com/t/working-with-canvas-elements/10622/3 "2018-05-15T06:23:42Z")
Not sure what is the question, but I will take a wild guess. Maybe try WebUI.switchToFrame() before working with canvas. Again, I’m not sure this will work, since I didn’t work with canvas, but hope it helps. ---
**Author:** ![sheetal\_sulay](https://avatars.discourse-cdn.com/v4/letter/s/9fc29f/32.png) [@sheetal\_sulay](https://forum.katalon.com/u/sheetal_sulay)\ **Post date:** [May 15, 2018, 6:56am UTC](https://forum.katalon.com/t/working-with-canvas-elements/10622/4 "2018-05-15T06:56:48Z")
Thank you @Mate Mrse for responding. Let me explain the issue. I am doing game automation. The game in included withing single canvas element. So I am doing below to automate the game:- WebUI.switchToFrame(findTestObject(‘Page\_GameLaunch/frm\_Game’),500) WebUI.waitForElementVisible(findTestObject(‘Page\_GameLaunch/canvas\_Game’), 50) WebUI.clickOffset(findTestObject(‘Page\_GameLaunch/canvas\_Game’),649,-166) WebUI.clickOffset(findTestObject(‘Page\_GameLaunch/canvas\_Game’),666,384) This is working fine.But this solution is not feasible as we have to find out the co-ordinates every time. So my question was to look for any other solution by which we do not need to provide co-ordinates for clicking. Regards, Sheetal ---
**Author:** ![Anthony\_Chapman](https://avatars.discourse-cdn.com/v4/letter/a/b3f665/32.png) [@Anthony\_Chapman](https://forum.katalon.com/u/Anthony_Chapman)\ **Post date:** [May 16, 2018, 2:37pm UTC](https://forum.katalon.com/t/working-with-canvas-elements/10622/5 "2018-05-16T14:37:09Z")
Sheetal, I’m a step behind you on this, how can I pull the coordinates needed? after that i’m also going to be looking for a better solution. ---
**Author:** ![sheetal\_sulay](https://avatars.discourse-cdn.com/v4/letter/s/9fc29f/32.png) [@sheetal\_sulay](https://forum.katalon.com/u/sheetal_sulay)\ **Post date:** [May 17, 2018, 9:41am UTC](https://forum.katalon.com/t/working-with-canvas-elements/10622/6 "2018-05-17T09:41:50Z")
Hi Anthony, I used selenium recorder to get the desired co-ordinates. Sheetal ---
**Author:** ![Devipriya\_Kalaimani](https://avatars.discourse-cdn.com/v4/letter/d/a88e4f/32.png) [@Devipriya\_Kalaimani](https://forum.katalon.com/u/Devipriya_Kalaimani)\ **Post date:** [August 27, 2018, 11:07pm UTC](https://forum.katalon.com/t/working-with-canvas-elements/10622/7 "2018-08-27T23:07:30Z")
\*\*Working with Canvas in Edge browser \*\*I work with canvas in my application. Chrome browser click the middle of the canvas using the action “focus” and “doubleClick”. The doubleClick/click action brings a slider window as expected in Chrome. Whereas in Edge browser, the canvas is recognised as elementPresent == true, but the doubleClick does not show the slider window. The Katalon script result shows the doubleClick action as ‘pass’ in Edge. But the slider window does not show up in the application. how to find in which coordinate, the script clicks on the canvas? Please assist. Thanks. ---
**Author:** ![abhishekprataps](https://avatars.discourse-cdn.com/v4/letter/a/3e96dc/32.png) [@abhishekprataps](https://forum.katalon.com/u/abhishekprataps)\ **Post date:** [January 4, 2019, 12:09pm UTC](https://forum.katalon.com/t/working-with-canvas-elements/10622/8 "2019-01-04T12:09:02Z")
Hi Sheetal, Did you found any better/feasible solution for this ? Regards, Abhishek ---
**Author:** ![rachu.2008](https://dub1.discourse-cdn.com/katalon/user_avatar/forum.katalon.com/rachu.2008/32/16104_2.png) [@rachu.2008](https://forum.katalon.com/u/rachu.2008)\ **Post date:** [August 11, 2021, 1:48pm UTC](https://forum.katalon.com/t/working-with-canvas-elements/10622/9 "2021-08-11T13:48:41Z")
try to get size of the canvas i.e., height and width height = WebUI.getElementHeight(findTestObject('Object Repository/##) width = WebUI.getElementWidth(findTestObject('Object Repository/#pollafter that WebUI.clickOffset(findTestObject(‘Page\_GameLaunch/canvas\_Game’),height_1/5,width_1/5) if you want to do from centre than use 1/2 I hope my solution helps you ---
**Author:** ![albert.vu](https://dub1.discourse-cdn.com/katalon/user_avatar/forum.katalon.com/albert.vu/32/20595_2.png) [@albert.vu](https://forum.katalon.com/u/albert.vu)\ **Post date:** [August 8, 2022, 7:31am UTC](https://forum.katalon.com/t/working-with-canvas-elements/10622/10 "2022-08-08T07:31:30Z")
Archived on August 8, 2022, 7:31am UTC