Html5 canvas + sikuli + selenium 2 web driver

Canvas c Тестируем Sikuli помощью Script и

Selenium WebDriver

Что такое CanvasCanvas (англ. canvas — «холст») —

элемент HTML 5, который предназначен для создания растрового изображения при помощи JavaScript.

Слои Canvas элемента

Что такое Sikuli

Sikuli — открытая кросс-платформенная визуальная среда создания сценариев-скриптов, которая ориентирована на программирование графического интерфейса при помощи изображений (скриншотов).

Типы "изобразительного искусства" в автоматизации

canvas элемента при помощи selenium webdriver

Манипуляции вручную (если нужно нарисовать что-нибудь на canvas-е)

Графические объекты на canvas-е, которые генерируются кодом (графики, чарты, и тд).

Манипуляции вручную (примеры)

Как нарисовать квадрат размером 3 на 3 пикселя:

drawActions.moveToElement(siculiDraw,1,1).clickAndHold().moveByOffset(3, 0) .moveByOffset(0, 3).moveByOffset(-3, 0).moveByOffset(0, -3).release().perform();

Графические объекты на canvas-е

Ключевые этапы: нарезать эталонных картинок; найти эталонные картинки на экране с

помощью Sikuli Script; получить координаты картинки с

помощью Sikuli Script; выполнить необходимые действия с

помощью Selenium Web Driver;

Работа с изображением на экране с помощью

Sikuli ScriptУбедиться, что изображение есть на экране:

Получить центр изображения:

Больше примеров тестирующих различные сценарии с Canvas картами и графиками можно найти на нашем TFS сервере 192.168.100.9 по линку:

$/CSI - Training Center/Clients/Automation/Clients/Logi Analytics/Test projects/LogiAnalyticsCanvasElementsTest

Автор:

Эльдар Гусейновопыт в IT более 5 лет, работает в компании ISSoft,

специализируется в разработке (TSQL Developer) и автоматизированном тестировании програмного обеспечения (Web, Desktop, Mobile).