Skip to content

Test guidelines

Jump to bottom
Julian Descottes edited this page Aug 25, 2014 · 9 revisions

Piskel currently uses 2 testing solutions :

  • unit tests with Karma runner / Jasmine
  • drawing tests (integration tests for drawing tools) with a custom record/replay utility

We would also like to use Selenium for additional integration/ui testing. It seems for now Piskel is incompatible with Selenium (can't detect the page load event).

Unit tests

overview

Unit tests are written using the Jasmine testing framework : http://jasmine.github.io/. They are executed using Karma runner : http://karma-runner.github.io/.

Please follow the installation guide at http://karma-runner.github.io/0.12/intro/installation.html to install karma-cli as a global.

conf

The configuration file for Karma can be found at the root of the project : /karma.conf.js.

Most importantly, this configuration defines which files are loaded to run the tests. All javascript files from src/js/**/*.js and test/js/**/*.js are loaded. As for the normal applications, the load order for files in src/js is defined in src/piskel-script-list.js.

writing tests

New unit tests should be located under test/js and should respect the folder hierarchy of the class being tested. By convention, append Test to the filename :

  • /src/js/service/HistoryService.js
  • /test/js/service/HistoryServiceTest.js

New tests are automatically picked up by the tester, no need to declare them in a test suite.

running tests

By default, the tests are run against PhantomJS. You can start them using the grunt task grunt unit-test.

If you want to start the Karma test server and rerun the test on each file change you can use the following command :

karma start karma.conf.js --log-level debug --no-single-run --auto-watch --browsers Chrome

Drawing tests

Introduction

overview

Drawing tests are records of events that can be replayed automatically to recreate a piskel. The record contains the list of events as well as the expected outcome of the drawing, in the form of a spritesheet png captured at the end of the recording.

All classes related to the drawing tests are in src/js/devtools. These files are not included in the built version of Piskel. This means you need to use the debug mode to either record or play drawing tests.

recorded events

At the moment the Recorder and the Player handle the following events :

  • mouse events (captured through the DrawingController MOUSE_EVENT events) with all possible meta modifiers
  • tool selection (captured through the ToolController TOOL_SELECTED events)
  • color selection (captured through the PaletteController [PRIMARY/SECONDARY]_COLOR_SELECTED events)
  • layer/frame modification (captured by decorating all methods of pskl.app.PiskelController that raise PISKEL_RESET events)

Record new tests

recording

Assuming grunt server:debug is running and serves Piskel in debug mode on 9901, go to http://localhost:9901/?debug&test=true.

There should be a small UI on the top left corner of the screen with 3 buttons :

  • load test
  • start recording
  • stop recording (disabled at this stage)

Before clicking on 'start recording', resize your piskel to the size you intend to use for your test, as the resize event is not captured at the moment. All the current tests have been recorded for 5x5 piskels. Smaller piskels mean less events to record and therefore smaller test records.

Click on 'start recording' (note that this button should be disabled now and 'stop recording' should be enabled).

Perform your drawing.

Click on 'stop recording'. A file named 'Piskel_record.json' will be automatically downloaded.

replay

Going to http://localhost:9901/?debug&test=true again (see above), click on 'Load Test' and select a test file. The drawing should be applied step by step.

add to test suite

The existing drawing tests are located in /test/integration/casperjs/drawing-records. Save your test in this folder first.

There are two different test suites for drawing tests:

  • CasperJS test suite : array in the beginning of /test/integration/casperjs/DrawingTest.js
  • Regular test suite : /test/integration/casperjs/drawing-records/TestSuite.json

Some drawing tests can not run on CasperJS (even though they run fine on all other browsers), that's why the test suites are separated. That being said, this is pretty messy and should be cleaned up later.

Test suite

run test suite : in browser

Go to http://localhost:9901/?debug&test-suite=TestSuite.json.

After loading piskel the test suite will run automatically, with a small UI on the top left of the screen tp follow the status of the tests. Current suite runs in approximately 30 seconds on my machine.

run test suite : in local casperjs

Use grunt test-local.

DrawingTest.js will be executed and will run drawing tests for all the drawing tests defined in the CasperJS test suite.

run test suite : with travis

Drawing tests always fail on Travis at the moment.

Until this is fixed, CasperJS DrawingTest is skipped on Travis.

Clone this wiki locally