diff --git a/test/casperjs/integration/IntegrationSuite.js b/test/casperjs/integration/IntegrationSuite.js index 548c082..5889f31 100644 --- a/test/casperjs/integration/IntegrationSuite.js +++ b/test/casperjs/integration/IntegrationSuite.js @@ -1,5 +1,6 @@ (typeof exports != "undefined" ? exports : pskl_exports).tests = [ 'palettes/test-tiny-palettes.js', + 'preview/test-toggle-grid.js', 'settings/test-preferences-main.js', 'settings/test-export-gif.js', 'settings/test-export-gif-scale.js', diff --git a/test/casperjs/integration/include.js b/test/casperjs/integration/include.js index fb4ae03..9a54fe4 100644 --- a/test/casperjs/integration/include.js +++ b/test/casperjs/integration/include.js @@ -17,6 +17,13 @@ function getValue(selector) { }'); } +function getClassName(selector) { + return casper.evaluate( + 'function () { \ + return document.querySelector(\'' + selector + '\').className;\ + }'); +} + function isChecked(selector) { return casper.evaluate( 'function () { \ diff --git a/test/casperjs/integration/preview/test-toggle-grid.js b/test/casperjs/integration/preview/test-toggle-grid.js new file mode 100644 index 0000000..c5ea972 --- /dev/null +++ b/test/casperjs/integration/preview/test-toggle-grid.js @@ -0,0 +1,65 @@ +/* globals casper, setPiskelFromGrid, isDrawerExpanded, getValue, isChecked, + evalLine, waitForEvent, replaceFunction, setPiskelFromImageSrc */ + +casper.test.begin('Test toggling the grid using the animated preview toggle grid icon', 9, function(test) { + test.timeout = test.fail.bind(test, ['Test timed out']); + + var GRID_BUTTON_CLASS = 'toggle-grid-button'; + var ACTIVE_GRID_BUTTON_CLASS = 'icon-minimap-grid-gold'; + var INACTIVE_GRID_BUTTON_CLASS = 'icon-minimap-grid-white'; + + function isGridEnabled_() { + return evalLine('pskl.UserSettings.get(pskl.UserSettings.GRID_ENABLED)'); + } + + function gridButtonHasClass_(className) { + var gridButtonClassname = getClassName('.' + GRID_BUTTON_CLASS); + return gridButtonClassname.indexOf(className) != -1 + } + + function isGridButtonActive_() { + return gridButtonHasClass_(ACTIVE_GRID_BUTTON_CLASS) && !gridButtonHasClass_(INACTIVE_GRID_BUTTON_CLASS); + } + + function onTestStart() { + test.assertExists('#drawing-canvas-container canvas', 'Piskel ready, test starting'); + + casper.echo('Check that initially grid is disabled and grid button is inactive'); + test.assertEquals(isGridEnabled_(), false, 'Grid is not enabled'); + test.assert(!isGridButtonActive_(), 'Grid button is not active'); + + casper.echo('Click on grid button to enable grid'); + casper.click('.' + GRID_BUTTON_CLASS); + casper.waitForSelector('.' + ACTIVE_GRID_BUTTON_CLASS, onGridEnabled, test.timeout, 10000); + } + + function onGridEnabled() { + casper.echo('Check that grid is now enabled and grid button is active'); + test.assertEquals(isGridEnabled_(), true, 'Grid is enabled'); + test.assert(isGridButtonActive_(), 'Grid button is active'); + + casper.echo('Click again on grid button to disable grid'); + casper.click('.' + GRID_BUTTON_CLASS); + casper.waitForSelector('.' + INACTIVE_GRID_BUTTON_CLASS, onGridDisabled, test.timeout, 10000); + } + + function onGridDisabled() { + casper.echo('Check that grid is disabled again and grid button is inactive'); + test.assertEquals(isGridEnabled_(), false, 'Grid is not enabled'); + test.assert(!isGridButtonActive_(), 'Grid button is not active'); + casper.click('.' + GRID_BUTTON_CLASS); + + casper.echo('Enable grid via user settings'); + evalLine('pskl.UserSettings.set(pskl.UserSettings.GRID_ENABLED, true)'); + casper.waitForSelector('.' + ACTIVE_GRID_BUTTON_CLASS, onGridEnabledViaSettings, test.timeout, 10000); + } + + function onGridEnabledViaSettings() { + casper.echo('Check that grid is finally enabled and grid button is active'); + test.assertEquals(isGridEnabled_(), true, 'Grid is enabled'); + test.assert(isGridButtonActive_(), 'Grid button is active'); + // Test end + } + + startTest(test, onTestStart); +});