Issue #636 - add integration test for main settings panel

test/casperjs/integration/IntegrationSuite.js

@@ -1,5 +1,6 @@
 (typeof exports != "undefined" ? exports : pskl_exports).tests = [
   'palettes/test-tiny-palettes.js',
+  'settings/test-application-main.js',
   'settings/test-export-gif.js',
   'settings/test-export-gif-scale.js',
   'settings/test-export-gif-simple.js',

test/casperjs/integration/settings/test-application-main.js

@@ -0,0 +1,77 @@
+/* globals casper, setPiskelFromGrid, isDrawerExpanded, getValue, isChecked,
+   evalLine, waitForEvent, piskelFrameEqualsGrid, replaceFunction, setPiskelFromImageSrc */
+
+casper.test.begin('Application main settings test', 11, function(test) {
+  test.timeout = test.fail.bind(test, ['Test timed out']);
+
+  function onTestStart() {
+    test.assertExists('#drawing-canvas-container canvas', 'Piskel ready, test starting');
+
+    test.assert(!isDrawerExpanded(), 'settings drawer is closed');
+
+    // Open application/user/preferences panel.
+    test.assertDoesntExist('.expanded .settings-section-application', 'Check if application panel is closed');
+    casper.click('[data-setting="user"]');
+
+    casper.waitForSelector('.expanded .settings-section-application', onApplicationPanelReady, test.timeout, 10000);
+  }
+
+  function onApplicationPanelReady() {
+    casper.echo('Application panel ready');
+
+    test.assert(isDrawerExpanded(), 'settings drawer is expanded');
+    test.assertExists('.expanded .settings-section-application',
+                      'Check if application panel is opened');
+
+    test.assertExists('.application-panel-main', 'Check if main tab is rendered');
+    test.assertDoesntExist('.application-panel-grid', 'Check that grid tab is not rendered');
+    casper.click('[data-tab-id="grid"]');
+    casper.waitForSelector('[data-tab-id="grid"]', onGridTabSelected, test.timeout, 10000);
+  }
+
+  function onGridTabSelected() {
+    casper.echo('Grid tab ready');
+
+    test.assertDoesntExist('.application-panel-tile', 'Check that tile tab is not rendered');
+    casper.click('[data-tab-id="tile"]');
+    casper.waitForSelector('[data-tab-id="tile"]', onTileTabSelected, test.timeout, 10000);
+  }
+
+  function onTileTabSelected() {
+    casper.echo('Tile tab ready');
+
+    // Click on settings again to close the settings drawer.
+    casper.click('[data-setting="user"]');
+    casper.waitForSelector('[data-pskl-controller="settings"]:not(.expanded)', onDrawerClosed, test.timeout, 10000);
+  }
+
+  function onDrawerClosed() {
+    test.assert(!isDrawerExpanded(), 'settings drawer is closed');
+    // Open the settings again to check if the last tab is selected.
+    casper.click('[data-setting="user"]');
+    casper.waitForSelector('.expanded .settings-section-application', onApplicationPanelExpandedAgain, test.timeout, 10000);
+  }
+
+  function onApplicationPanelExpandedAgain() {
+    casper.echo('Tile tab ready');
+    test.assertExists('.application-panel-tile', 'Check if tile tab is selected');
+
+    // Close the panel a second time.
+    casper.click('[data-setting="user"]');
+    casper.waitForSelector('[data-pskl-controller="settings"]:not(.expanded)', onDrawerClosedAgain, test.timeout, 10000);
+  }
+
+  function onDrawerClosedAgain() {
+    test.assert(!isDrawerExpanded(), 'settings drawer is closed');
+  }
+
+  casper
+    .start(casper.cli.get('baseUrl')+"/?debug")
+    .then(function () {
+      casper.echo("URL loaded");
+      casper.waitForSelector('#drawing-canvas-container canvas', onTestStart, test.timeout, 20000);
+    })
+    .run(function () {
+      test.done();
+    });
+});