Интеграционное тестирование холста - PullRequest
5 голосов
/ 07 августа 2011

В течение последних нескольких недель я экспериментировал с методами, пытаясь найти лучший способ использования BDD для веб-приложения, которое зависит от элемента HTML5 canvas, и взаимодействия с ним пользователя.

IЯ использовал Jasmine и Cucumber с Rspec, чтобы специфицировать и тестировать интеграцию каждую часть моего приложения, но любая попытка интеграционного тестирования холста была ... неудачной.Я написал плагин jQuery, который обрабатывает взаимодействие с холстом и инициализирует его.

Я хотел провести интеграционное тестирование реального чертежа на холсте, убедившись, что когда вы вызываете что-то вроде

$("canvas").draw("lineTo", 10, 10)

, на самом деле в элементе холста в точках создается линия (10, 10).Это то, что оказалось изменчивым, я пытался использовать контекстный метод getImageData () на любых нарисованных пикселях.Это привело меня в дыру, независимо от того, как я запрашиваю холст, я получаю данные пикселя, представляющие черный прозрачный пиксель, который, согласно MDC, говорит, что я запрашиваю холст вне контекста.

Это, я думаю,проблема с жасминовым камнем с RoR.Если бы я мог решить эту проблему, я был бы золотым, но это не единственное решение, которое я готов принять.Я действительно хотел бы помочь придумать эффективный способ интеграционного тестирования холста, даже если я на самом деле не проверяю данные пикселей напрямую.

Спасибо всем за вашу помощь, это действительно загоняет меня в блок.

Ответы [ 2 ]

3 голосов
/ 16 декабря 2011

Я написал инструмент js-imagediff, который интегрируется с Jasmine для тестирования canvas.Вы можете увидеть пример здесь: холст модульного тестирования с javascript imagediff и jasmine .Дайте мне знать, если это полезно.

Однако для получения различий используется getImageData.Вы получаете конкретные ошибки с этим звонком?Или у вас есть ссылка на страницу MDC, на которую вы ссылаетесь?

0 голосов
/ 20 октября 2015

Вы можете использовать Nightwatchjs для этого ... http://nightwatchjs.org/ У него есть API для взаимодействия с элементами DOM, но он также расширяемый.Я написал несколько примеров пользовательских команд и утверждений, которые можно использовать для сквозного тестирования игр Phaser на основе Canvas, но вы можете увидеть, как это делается, и создать собственные тесты, которые выполняют вызовы API рисования холста.

см. Некоторые примеры здесь: https://github.com/hayesmaker/phase-2-e

...